/* =========================
   TravelIAQ Lexicon Base / Desktop
   ========================= */

html,
body{
    margin:0;
    padding:0;
    background:#fff9e8;
}

body.traveliaq{
    margin:0;
    padding:0;
    background:#fff9e8;
    overflow-x:hidden;
}

.tia-lexicon{
    max-width:1100px;
    margin:44px auto 60px;
    padding:0 22px;
    font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    color:#102a43;
}

.tia-lexicon-hero{
    background:#0f172a;
    color:#fff;
    border-radius:26px;
    padding:44px;
    margin-bottom:34px;
    box-shadow:0 18px 52px rgba(15,23,42,.16);
}

.tia-kicker{
    font-size:12px;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:#facc15;
    margin:0 0 12px;
    font-weight:900;
}

.tia-lexicon h1{
    font-size:52px;
    line-height:1.06;
    margin:0 0 16px;
    color:#08233f;
    letter-spacing:-.04em;
}

.tia-lexicon-hero h1{
    color:#fff;
}

.tia-lead{
    font-size:22px;
    line-height:1.55;
    margin:0 0 10px;
}

.tia-sublead{
    opacity:.82;
    margin:0;
    line-height:1.65;
}

.tia-lexicon-tree::before{
    content:'Most people stop after the first screen.\A Curiosity doesn\2019t. ↓';
    white-space:pre-line;
    display:block;
    max-width:720px;
    margin:0 auto 28px;
    padding:18px 22px;
    text-align:center;
    background:#fff;
    border:1px solid rgba(16,42,67,.12);
    border-radius:18px;
    color:#334155;
    font-weight:850;
    line-height:1.45;
    box-shadow:0 10px 30px rgba(15,23,42,.05);
}

.tia-tree{
    list-style:none;
    padding-left:0;
    margin:0;
}

.tia-tree .tia-tree{
    padding-left:30px;
    margin-top:14px;
    border-left:2px solid rgba(15,23,42,.12);
}

.tia-tree-card{
    position:relative;
    background:#fff;
    border:1px solid rgba(16,42,67,.12);
    border-left-width:7px;
    border-radius:18px;
    margin:16px 0;
    padding:18px 20px;
    box-shadow:0 8px 24px rgba(15,23,42,.045);
    overflow:visible;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.tia-tree-card:hover{
    transform:translateY(-2px);
    box-shadow:0 16px 36px rgba(15,23,42,.08);
}

.tia-tree-card.is-loading{
    opacity:.78;
}

.tia-tree-card.is-open{
    box-shadow:0 18px 42px rgba(15,23,42,.09);
}

.tia-lexicon-card-link{
    display:block;
    text-decoration:none;
    color:#0f172a;
}

.tia-term-title{
    display:block;
    font-size:19px;
    font-weight:950;
    line-height:1.25;
    color:#0f172a;
}

.tia-term-excerpt{
    display:block;
    margin-top:8px;
    font-size:15px;
    line-height:1.58;
    color:#64748b;
}

.tia-level-badge{
    position:absolute;
    top:-17px;
    right:-17px;
    z-index:5;
    width:42px;
    height:42px;
    border-radius:999px;
    background:#080808;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:12px;
    font-weight:950;
    letter-spacing:-.02em;
    box-shadow:0 10px 20px rgba(0,0,0,.2);
    pointer-events:none;
}

.tia-level-1{ background:#f8fbff; border-left-color:#2563eb; }
.tia-level-2{ background:#f4fcfb; border-left-color:#0f766e; }
.tia-level-3{ background:#f8fcf5; border-left-color:#4d7c0f; }
.tia-level-4{ background:#fffdf4; border-left-color:#ca8a04; }
.tia-level-5{ background:#fff8f3; border-left-color:#ea580c; }
.tia-level-6{ background:#fff5f5; border-left-color:#b91c1c; }
.tia-level-7{ background:#fdf5ff; border-left-color:#7e22ce; }
.tia-level-8{ background:#f7f5ff; border-left-color:#4338ca; }
.tia-level-9{ background:#f5f7fa; border-left-color:#334155; }

.tia-lexicon-inline-preview{
    display:none;
}

.tia-tree-card.is-open > .tia-lexicon-inline-preview{
    display:block;
    margin-top:18px;
}

.tia-preview-panel{
    background:#fff;
    border:1px solid rgba(16,42,67,.14);
    border-radius:18px;
    padding:22px;
    box-shadow:inset 0 0 0 1px rgba(250,204,21,.18), 0 14px 38px rgba(15,23,42,.06);
}

.tia-preview-head small{
    display:block;
    margin-bottom:8px;
    color:#64748b;
    text-transform:uppercase;
    letter-spacing:.12em;
    font-size:11px;
    font-weight:900;
}

.tia-preview-head h3{
    margin:0 0 12px;
    color:#0f172a;
    font-size:24px;
    line-height:1.18;
    letter-spacing:-.03em;
}

.tia-preview-motto{
    margin:0 0 14px;
    padding-left:14px;
    border-left:4px solid #facc15;
    color:#334155;
    font-size:17px;
    line-height:1.55;
    font-weight:750;
}

.tia-preview-definition{
    color:#334155;
    font-size:16px;
    line-height:1.72;
}

.tia-preview-definition p{
    margin:0 0 14px;
}

.tia-preview-examples,
.tia-preview-children{
    margin-top:16px;
}

.tia-preview-examples strong,
.tia-preview-children strong{
    display:block;
    margin-bottom:8px;
    color:#0f172a;
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.tia-preview-examples ul{
    margin:0;
    padding-left:20px;
    color:#475569;
    line-height:1.6;
}

.tia-preview-children div{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.tia-preview-children a{
    display:inline-flex;
    padding:9px 12px;
    border-radius:999px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    color:#0f172a;
    text-decoration:none;
    font-weight:800;
    font-size:13px;
}

.tia-preview-readmore{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:18px;
    padding:12px 18px;
    border-radius:999px;
    background:#0f172a;
    color:#fff !important;
    text-decoration:none;
    font-weight:900;
}

/* Single term page */

.tia-lexicon-single{
    background:#fff;
    border-radius:24px;
    padding:38px;
    border:1px solid rgba(16,42,67,.12);
    box-shadow:0 14px 46px rgba(15,23,42,.08);
}

.tia-lexicon-single h1{
    font-size:46px;
}

.tia-term-motto{
    font-size:22px;
    line-height:1.45;
    color:#334e68;
    border-left:4px solid #facc15;
    padding-left:18px;
    margin:18px 0;
}

.tia-term-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:18px 0 24px;
}

.tia-term-meta span{
    background:#eef2ff;
    color:#1e3a8a;
    border-radius:999px;
    padding:7px 11px;
    font-size:12px;
    font-weight:800;
}

.tia-definition{
    font-size:18px;
    line-height:1.75;
}

.tia-lexicon h2{
    color:#08233f;
    font-size:26px;
    margin:28px 0 14px;
}

.tia-related-concepts{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.tia-related-concepts a{
    background:#f8fafc;
    border:1px solid rgba(16,42,67,.14);
    padding:10px 14px;
    border-radius:999px;
    text-decoration:none;
    color:#102a43;
    font-weight:800;
}

.tia-lexicon-note{
    margin-top:30px;
    background:#fffbeb;
    border:1px solid #fde68a;
    border-radius:16px;
    padding:18px 20px;
    color:#713f12;
}

.tia-lexicon-note p{
    margin-bottom:0;
}

.tia-concept-nav{
    margin-top:38px;
    padding-top:28px;
    border-top:1px solid #e5e7eb;
}

.tia-concept-nav-home{
    display:inline-block;
    padding:10px 18px;
    border-radius:999px;
    background:#0f172a;
    color:#fff !important;
    text-decoration:none;
    font-weight:800;
    margin-bottom:22px;
}

.tia-concept-nav-parent-label,
.tia-concept-nav-children-label{
    display:block;
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:#94a3b8;
    margin:18px 0 12px;
}

.tia-concept-nav-parent,
.tia-concept-nav-children a{
    display:inline-flex;
    align-items:center;
    padding:12px 18px;
    border-radius:999px;
    background:#f8fafc;
    border:1px solid #e2e8f0;
    color:#0f172a !important;
    text-decoration:none;
    font-weight:800;
}

.tia-concept-nav-children{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

/* Desktop / Mobile renderer switch */
.tia-lexicon-tree-mobile{
    display:none;
}

.tia-lexicon-tree-desktop{
    display:block;
}

/* ================================================================
 * IAQ Lexicon onboarding
 * Presentation only. Copy/model lives in src/IAQLexiconOnboarding.php
 * so the onboarding concept is not coupled to WordPress.
 * ================================================================ */

body.tia-lexicon-onboarding-open{
    overflow:hidden;
}

.tia-lexicon-onboarding[hidden]{
    display:none !important;
}

.tia-lexicon-onboarding{
    position:fixed;
    inset:0;
    z-index:2147483000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:28px;
}

.tia-lexicon-onboarding-backdrop{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.72);
    backdrop-filter:blur(2px);
    -webkit-backdrop-filter:blur(2px);
}

.tia-lexicon-onboarding-dialog{
    position:relative;
    z-index:1;
    width:min(780px, calc(100vw - 56px));
    max-height:calc(100vh - 56px);
    overflow:auto;
    padding:38px 42px 34px;
    border-radius:26px;
    background:rgba(255,252,245,.98);
    border:1px solid rgba(190,145,55,.35);
    box-shadow:0 30px 100px rgba(0,0,0,.38);
    color:#102a43;
    outline:none;
}

.tia-lexicon-onboarding-x{
    position:absolute;
    top:16px;
    right:18px;
    width:40px;
    height:40px;
    border:0;
    border-radius:50%;
    background:rgba(15,23,42,.07);
    color:#0f172a;
    font-size:27px;
    line-height:1;
    cursor:pointer;
}

.tia-lexicon-onboarding-eyebrow{
    margin:0 0 10px;
    color:#b7791f;
    font-size:12px;
    font-weight:900;
    letter-spacing:.18em;
    text-transform:uppercase;
}

.tia-lexicon-onboarding-dialog h2{
    margin:0 48px 14px 0;
    color:#08233f;
    font-size:38px;
    line-height:1.08;
    letter-spacing:-.035em;
}

.tia-lexicon-onboarding-intro{
    margin:0 0 18px;
    color:#183b56;
    font-size:20px;
    line-height:1.55;
    font-weight:750;
}

.tia-lexicon-onboarding-dialog > p:not(.tia-lexicon-onboarding-eyebrow):not(.tia-lexicon-onboarding-intro){
    margin:0 0 14px;
    color:#44566c;
    font-size:16px;
    line-height:1.72;
}

.tia-lexicon-onboarding-levels{
    margin:24px 0 20px;
    padding:22px;
    border-radius:18px;
    background:#fff;
    border:1px solid rgba(16,42,67,.11);
}

.tia-lexicon-onboarding-levels h3{
    margin:0 0 14px;
    color:#08233f;
    font-size:21px;
}

.tia-lexicon-onboarding-level-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px;
}

.tia-lexicon-onboarding-level{
    min-height:92px;
    padding:15px;
    border-radius:14px;
    background:#fffaf0;
    border:1px solid rgba(190,145,55,.20);
}

.tia-lexicon-onboarding-level strong{
    display:block;
    margin-bottom:7px;
    color:#b7791f;
    font-size:18px;
}

.tia-lexicon-onboarding-level span{
    color:#425466;
    font-size:14px;
    line-height:1.5;
}

.tia-lexicon-onboarding-level-note{
    margin:14px 0 0;
    color:#334155;
    font-size:14px;
    line-height:1.55;
    font-weight:800;
}

.tia-lexicon-onboarding-cycle{
    margin:18px 0;
    padding:18px 20px;
    border-left:4px solid #d99b18;
    background:rgba(255,255,255,.72);
}

.tia-lexicon-onboarding-cycle p{
    margin:0;
    color:#183b56;
    font-size:16px;
    line-height:1.6;
    font-weight:800;
}

.tia-lexicon-onboarding-cycle p + p{
    margin-top:4px;
}

.tia-lexicon-onboarding-dialog blockquote{
    margin:18px 0 22px;
    padding:0;
    border:0;
    color:#53657a;
    font-family:Georgia, "Times New Roman", serif;
    font-size:18px;
    line-height:1.5;
    font-style:italic;
    text-align:center;
}

.tia-lexicon-onboarding-actions{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:12px;
}

.tia-lexicon-onboarding-primary,
.tia-lexicon-onboarding-secondary,
.tia-lexicon-onboarding-trigger{
    font:inherit;
    cursor:pointer;
}

.tia-lexicon-onboarding-primary{
    padding:13px 20px;
    border:0;
    border-radius:999px;
    background:#0f2b46;
    color:#fff;
    font-weight:900;
}

.tia-lexicon-onboarding-secondary{
    padding:11px 16px;
    border:0;
    background:transparent;
    color:#5d6d7e;
    font-weight:800;
}

.tia-lexicon-onboarding-trigger{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:18px;
    padding:10px 15px;
    border:1px solid rgba(255,255,255,.34);
    border-radius:999px;
    background:rgba(255,255,255,.08);
    color:#fff;
    font-size:13px;
    font-weight:850;
    text-decoration:none;
}

.tia-lexicon-hero-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-top:18px;
}

.tia-lexicon-hero-actions .tia-lexicon-onboarding-trigger{margin-top:0}

@media(max-width:560px){
    .tia-lexicon-hero-actions{align-items:stretch;flex-direction:column}
    .tia-lexicon-hero-actions .tia-lexicon-onboarding-trigger{width:100%;box-sizing:border-box}
}

.tia-lexicon-single-help{
    display:flex;
    justify-content:flex-end;
    margin:-8px 0 12px;
}

.tia-lexicon-single-help .tia-lexicon-onboarding-trigger{
    margin-top:0;
    border-color:rgba(16,42,67,.16);
    background:#fffaf0;
    color:#102a43;
}

@media (max-width:767px){
    .tia-lexicon-onboarding{
        padding:14px;
        align-items:flex-end;
    }

    .tia-lexicon-onboarding-dialog{
        width:100%;
        max-height:calc(100vh - 28px);
        padding:30px 22px 24px;
        border-radius:24px 24px 18px 18px;
    }

    .tia-lexicon-onboarding-dialog h2{
        margin-right:40px;
        font-size:31px;
    }

    .tia-lexicon-onboarding-intro{
        font-size:18px;
    }

    .tia-lexicon-onboarding-level-grid{
        grid-template-columns:1fr;
    }

    .tia-lexicon-onboarding-level{
        min-height:0;
    }

    .tia-lexicon-onboarding-actions{
        align-items:stretch;
        flex-direction:column;
    }

    .tia-lexicon-onboarding-primary,
    .tia-lexicon-onboarding-secondary{
        width:100%;
    }
}

/* IAQ Lexicon term context navigation */
.tia-lexicon-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 22px;
    color: #718096;
    font-size: 14px;
    line-height: 1.5;
}

.tia-lexicon-breadcrumb a {
    color: #52667a;
    text-decoration: none;
    border-bottom: 1px solid transparent;
}

.tia-lexicon-breadcrumb a:hover,
.tia-lexicon-breadcrumb a:focus-visible {
    color: #102a43;
    border-bottom-color: currentColor;
}

.tia-lexicon-breadcrumb span {
    color: #a0aec0;
}

.tia-first-appeared {
    margin-top: 10px;
}

.tia-first-appeared-link {
    display: inline;
    color: #5b21b6;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.tia-first-appeared-link:hover,
.tia-first-appeared-link:focus-visible {
    color: #3b0764;
}

.tia-first-appeared-link {
    display: inline-block;
    color: #234e70;
    font-weight: 600;
    line-height: 1.55;
    text-decoration: none;
    border-bottom: 1px solid rgba(35, 78, 112, 0.28);
    transition:
        color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

.tia-first-appeared-link:hover,
.tia-first-appeared-link:focus {
    color: #102a43;
    border-bottom-color: #102a43;
    transform: translateY(-1px);
}

.tia-first-appeared-link:focus-visible {
    outline: 2px solid rgba(35, 78, 112, 0.35);
    outline-offset: 4px;
    border-radius: 2px;
}
