/* ============================================================
   IQ CONNECT — RESOURCES HUB
   FULL PREMIUM UI / UX
   ============================================================ */

.rh{
    --bg:#ffffff;
    --soft:#f4f8fc;
    --soft-2:#eef5fb;
    --ink:#0b1d34;
    --text:#334e68;
    --muted:#7890a5;
    --line:#dbe7f0;

    --night:#030b16;
    --night-2:#061426;
    --night-3:#0a2341;

    --blue:#1687ff;
    --blue-2:#315cff;
    --cyan:#43e1ef;
    --violet:#8c7bff;
    --green:#45e09e;
    --amber:#ffbd57;

    width:100%;
    overflow:hidden;
    color:var(--ink);
    background:#fff;
    font-family:inherit;
}

.rh *,
.rh *::before,
.rh *::after{
    box-sizing:border-box;
}

.rh img{
    display:block;
    max-width:100%;
}

.rh a{
    color:inherit;
    text-decoration:none;
}

.rh button,
.rh input{
    font:inherit;
}

.rh button{
    cursor:pointer;
}

.rh-container{
    width:min(1240px,calc(100% - 48px));
    margin-inline:auto;
}

.rh-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--blue);
    font-size:10px;
    line-height:1;
    font-weight:900;
    letter-spacing:.17em;
    text-transform:uppercase;
}

.rh-eyebrow::before{
    content:"";
    width:18px;
    height:1px;
    background:currentColor;
}


/* ============================================================
   BUTTONS
   ============================================================ */

.rh-btn{
    min-height:50px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:11px;
    padding:0 21px;
    border:1px solid transparent;
    border-radius:12px;
    font-size:12px;
    font-weight:900;
    transition:
        transform .25s ease,
        border-color .25s ease,
        background .25s ease,
        box-shadow .25s ease;
}

.rh-btn:hover{
    transform:translateY(-3px);
}

.rh-btn--primary{
    color:#fff;
    border-color:rgba(92,195,255,.25);
    background:linear-gradient(135deg,var(--blue),var(--blue-2));
    box-shadow:0 18px 40px rgba(22,110,255,.22);
}

.rh-btn--ghost{
    color:#c4d5e4;
    border-color:rgba(255,255,255,.12);
    background:rgba(255,255,255,.035);
}


/* ============================================================
   HERO
   ============================================================ */

.rh-hero{
    position:relative;
    min-height:780px;
    display:flex;
    align-items:center;
    padding:62px 0 76px;
    overflow:hidden;
    color:#fff;
    background:
        radial-gradient(circle at 84% 28%,rgba(29,123,255,.23),transparent 31%),
        radial-gradient(circle at 12% 86%,rgba(67,225,239,.08),transparent 27%),
        linear-gradient(120deg,#020914 0%,#061426 51%,#0b2b55 100%);
}

.rh-hero__grid{
    position:absolute;
    inset:0;
    opacity:.32;
    pointer-events:none;
    background-image:
        linear-gradient(rgba(73,148,205,.07) 1px,transparent 1px),
        linear-gradient(90deg,rgba(73,148,205,.07) 1px,transparent 1px);
    background-size:48px 48px;
}

.rh-hero__glow{
    position:absolute;
    border-radius:50%;
    filter:blur(70px);
    pointer-events:none;
}

.rh-hero__glow--one{
    width:520px;
    height:520px;
    right:-180px;
    top:-210px;
    background:rgba(32,130,255,.16);
}

.rh-hero__glow--two{
    width:420px;
    height:420px;
    left:-190px;
    bottom:-220px;
    background:rgba(67,225,239,.08);
}

.rh-hero__layout{
    position:relative;
    z-index:2;
    width:min(1240px,calc(100% - 48px));
    margin-inline:auto;
    display:grid;
    grid-template-columns:minmax(0,.92fr) minmax(520px,1.08fr);
    align-items:center;
    gap:66px;
}

.rh-breadcrumb{
    display:flex;
    align-items:center;
    gap:9px;
    margin-bottom:53px;
    color:#6f899f;
    font-size:12px;
}

.rh-breadcrumb a{
    color:#91a7b9;
}

.rh-breadcrumb strong{
    color:#e5edf4;
}

.rh-kicker{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:18px;
    color:#43e1ef;
    font-size:10px;
    font-weight:900;
    letter-spacing:.17em;
}

.rh-kicker i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--green);
    box-shadow:0 0 17px rgba(69,224,158,.65);
}

.rh-hero h1{
    max-width:700px;
    margin:0;
    color:#fff;
    font-size:clamp(55px,5.2vw,80px);
    line-height:.91;
    letter-spacing:-.068em;
}

.rh-hero h1 span{
    display:block;
    margin-top:9px;
    color:transparent;
    background:linear-gradient(90deg,#43e1ef,#39a9ff 42%,#8c7bff);
    -webkit-background-clip:text;
    background-clip:text;
}

.rh-hero__copy > p{
    max-width:620px;
    margin:27px 0 0;
    color:#89a3b9;
    font-size:14px;
    line-height:1.85;
}

.rh-hero__actions{
    display:flex;
    flex-wrap:wrap;
    gap:11px;
    margin-top:31px;
}

.rh-hero__signals{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    margin-top:45px;
    border-top:1px solid rgba(255,255,255,.085);
    border-bottom:1px solid rgba(255,255,255,.085);
}

.rh-hero__signals > div{
    min-height:96px;
    display:grid;
    grid-template-columns:30px 1fr;
    align-items:center;
    gap:10px;
    padding:15px 13px;
}

.rh-hero__signals > div:not(:last-child){
    border-right:1px solid rgba(255,255,255,.075);
}

.rh-hero__signals > div > span{
    color:var(--cyan);
    font-size:10px;
    font-weight:900;
}

.rh-hero__signals strong{
    display:block;
    margin-bottom:3px;
    color:#d9e6ef;
    font-size:10px;
}

.rh-hero__signals p{
    margin:0;
    color:#6d879c;
    font-size:8px;
    line-height:1.5;
}


/* ============================================================
   HERO TERMINAL
   ============================================================ */

.rh-terminal{
    position:relative;
    overflow:hidden;
    border:1px solid rgba(100,184,248,.17);
    border-radius:23px;
    color:#dbe8f1;
    background:
        radial-gradient(circle at 95% 0%,rgba(38,131,255,.12),transparent 30%),
        linear-gradient(180deg,rgba(12,31,54,.98),rgba(4,14,27,.99));
    box-shadow:
        0 45px 110px rgba(0,0,0,.43),
        inset 0 1px rgba(255,255,255,.04);
}

.rh-terminal::before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.22;
    pointer-events:none;
    background-image:
        linear-gradient(rgba(75,150,210,.05) 1px,transparent 1px),
        linear-gradient(90deg,rgba(75,150,210,.05) 1px,transparent 1px);
    background-size:30px 30px;
}

.rh-terminal__top{
    position:relative;
    z-index:2;
    min-height:65px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:0 19px;
    border-bottom:1px solid rgba(255,255,255,.07);
}

.rh-terminal__identity{
    display:flex;
    align-items:center;
    gap:11px;
}

.rh-live-dot{
    width:9px;
    height:9px;
    border-radius:50%;
    background:var(--green);
    box-shadow:0 0 17px rgba(69,224,158,.7);
}

.rh-terminal__identity small{
    display:block;
    color:#4e718b;
    font-size:6px;
    font-weight:900;
    letter-spacing:.14em;
}

.rh-terminal__identity strong{
    display:block;
    margin-top:3px;
    color:#d9e7f1;
    font-size:10px;
}

.rh-terminal__status{
    padding:7px 10px;
    border:1px solid rgba(69,224,158,.15);
    border-radius:7px;
    color:#65e5aa;
    background:rgba(69,224,158,.045);
    font-size:6px;
    font-weight:900;
}

.rh-terminal__body{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:135px minmax(0,1fr);
    min-height:475px;
}

.rh-terminal__sidebar{
    padding:13px 8px;
    border-right:1px solid rgba(255,255,255,.07);
}

.rh-terminal__sidebar button{
    width:100%;
    min-height:50px;
    display:grid;
    grid-template-columns:26px 1fr;
    align-items:center;
    gap:7px;
    padding:0 8px;
    border:1px solid transparent;
    border-radius:8px;
    color:#607d94;
    background:transparent;
    font-size:7px;
    text-align:left;
}

.rh-terminal__sidebar button.is-active,
.rh-terminal__sidebar button:hover{
    color:#d9e7f1;
    border-color:rgba(67,225,239,.11);
    background:rgba(67,225,239,.045);
}

.rh-terminal__sidebar button i{
    color:#4d7088;
    font-style:normal;
}

.rh-terminal__sidebar button.is-active i{
    color:var(--cyan);
}

.rh-terminal__workspace{
    min-width:0;
    padding:24px;
}

.rh-terminal__workspace-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
}

.rh-terminal__workspace-head span{
    color:var(--cyan);
    font-size:6px;
    font-weight:900;
    letter-spacing:.14em;
}

.rh-terminal__workspace-head h3{
    margin:6px 0 0;
    color:#fff;
    font-size:22px;
    letter-spacing:-.035em;
}

.rh-terminal__workspace-head button{
    width:35px;
    height:35px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:8px;
    color:#7894aa;
    background:rgba(255,255,255,.025);
}

.rh-terminal__description{
    max-width:470px;
    margin:11px 0 0;
    color:#68839a;
    font-size:8px;
    line-height:1.7;
}

.rh-terminal__metrics{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    margin-top:20px;
}

.rh-terminal__metrics article{
    min-height:88px;
    padding:13px;
    border:1px solid rgba(255,255,255,.065);
    border-radius:10px;
    background:rgba(255,255,255,.018);
}

.rh-terminal__metrics article > span{
    color:#4c6d86;
    font-size:5px;
    font-weight:900;
}

.rh-terminal__metrics strong{
    display:block;
    margin-top:11px;
    color:#d3e2ed;
    font-size:11px;
}

.rh-terminal__metrics small{
    display:block;
    margin-top:4px;
    color:#536f86;
    font-size:5px;
}

.rh-terminal__visual{
    display:grid;
    grid-template-columns:minmax(0,1fr) 120px;
    gap:8px;
    margin-top:9px;
}

.rh-terminal__chart,
.rh-terminal__signal{
    min-height:180px;
    padding:13px;
    border:1px solid rgba(255,255,255,.065);
    border-radius:10px;
    background:rgba(255,255,255,.016);
}

.rh-chart__head{
    display:flex;
    justify-content:space-between;
    gap:10px;
}

.rh-chart__head span{
    color:#7892a7;
    font-size:6px;
    font-weight:900;
}

.rh-chart__head small{
    color:#4e6b83;
    font-size:5px;
}

.rh-chart__bars{
    height:122px;
    display:flex;
    align-items:flex-end;
    justify-content:space-around;
    gap:7px;
    padding-top:18px;
}

.rh-chart__bars > div{
    height:100%;
    flex:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-end;
    gap:7px;
}

.rh-chart__bars > div > span{
    width:min(23px,72%);
    height:var(--height);
    min-height:12px;
    border-radius:5px 5px 2px 2px;
    background:linear-gradient(180deg,var(--cyan),var(--blue));
}

.rh-chart__bars small{
    color:#526e85;
    font-size:5px;
}

.rh-terminal__signal{
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.rh-terminal__signal > span{
    color:var(--green);
    font-size:5px;
    font-weight:900;
    letter-spacing:.12em;
}

.rh-terminal__signal strong{
    margin-top:12px;
    color:#fff;
    font-size:12px;
    line-height:1.35;
}

.rh-terminal__signal p{
    margin:9px 0 0;
    color:#617e95;
    font-size:6px;
    line-height:1.65;
}

.rh-terminal__signal a{
    margin-top:16px;
    color:var(--cyan);
    font-size:6px;
    font-weight:900;
}

.rh-terminal__footer{
    position:relative;
    z-index:2;
    min-height:39px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 18px;
    border-top:1px solid rgba(255,255,255,.06);
    color:#45647c;
    font-size:5px;
    font-weight:800;
}


/* ============================================================
   TOPIC BAND
   ============================================================ */

.rh-topic-band{
    overflow:hidden;
    padding:0 !important;
    border-top:1px solid #132d49;
    border-bottom:1px solid #132d49;
    background:#061426 !important;
}

.rh-topic-band__track{
    min-height:58px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:25px;
    white-space:nowrap;
    color:#7593aa;
    font-size:9px;
    font-weight:900;
    letter-spacing:.08em;
}

.rh-topic-band__track i{
    color:var(--cyan);
    font-style:normal;
}


/* ============================================================
   SHARED SECTION HEAD
   ============================================================ */

.rh-featured,
.rh-library,
.rh-topics{
    padding:105px 0;
}

.rh-section-head{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(280px,430px);
    align-items:end;
    gap:50px;
    margin-bottom:50px;
}

.rh-section-head h2,
.rh-path h2,
.rh-stack h2,
.rh-final h2{
    max-width:720px;
    margin:13px 0 0;
    color:var(--ink);
    font-size:clamp(40px,4.5vw,62px);
    line-height:.96;
    letter-spacing:-.058em;
}

.rh-section-head h2 span,
.rh-path h2 span,
.rh-stack h2 span{
    color:var(--blue);
}

.rh-section-head > p{
    margin:0;
    color:var(--muted);
    font-size:13px;
    line-height:1.8;
}


/* ============================================================
   FEATURED INSIGHT
   ============================================================ */

.rh-featured{
    background:#fff;
}

.rh-feature-card{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
    overflow:hidden;
    border:1px solid var(--line);
    border-radius:25px;
    background:#fff;
    box-shadow:0 30px 80px rgba(21,53,79,.08);
}

.rh-feature-card__visual{
    position:relative;
    min-height:480px;
    overflow:hidden;
    background:
        radial-gradient(circle at 50% 45%,rgba(46,143,255,.25),transparent 25%),
        linear-gradient(135deg,#06101e,#0b2442);
}

.rh-feature-card__image{
    position:absolute;
    inset:0;
    opacity:.3;
    background:
        linear-gradient(rgba(5,15,28,.2),rgba(5,15,28,.65)),
        url("https://images.unsplash.com/photo-1566073771259-6a8506099945?auto=format&fit=crop&w=1400&q=85")
        center/cover no-repeat;
}

.rh-feature-card__overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg,rgba(3,11,22,.4),transparent),
        radial-gradient(circle at 50% 50%,transparent,rgba(3,11,22,.38));
}

.rh-feature-card__visual-top{
    position:absolute;
    z-index:2;
    top:24px;
    left:25px;
    right:25px;
    display:flex;
    justify-content:space-between;
    color:#9eb4c5;
    font-size:8px;
    font-weight:900;
}

.rh-feature-card__visual-top strong{
    color:var(--green);
}

.rh-feature-card__architecture{
    position:absolute;
    z-index:2;
    width:330px;
    height:330px;
    left:50%;
    top:53%;
    transform:translate(-50%,-50%);
    border:1px solid rgba(72,177,255,.13);
    border-radius:50%;
}

.rh-feature-card__architecture::before,
.rh-feature-card__architecture::after{
    content:"";
    position:absolute;
    border:1px solid rgba(72,177,255,.1);
    border-radius:50%;
}

.rh-feature-card__architecture::before{
    inset:45px;
}

.rh-feature-card__architecture::after{
    inset:92px;
}

.rh-feature-card__core{
    position:absolute;
    z-index:3;
    left:50%;
    top:50%;
    width:100px;
    height:100px;
    transform:translate(-50%,-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(67,225,239,.3);
    border-radius:50%;
    background:rgba(8,31,54,.88);
    box-shadow:0 0 55px rgba(22,135,255,.25);
}

.rh-feature-card__core strong{
    color:#fff;
    font-size:31px;
    letter-spacing:-.07em;
}

.rh-feature-card__core span{
    margin-top:2px;
    color:var(--cyan);
    font-size:6px;
    font-weight:900;
    letter-spacing:.15em;
}

.rh-architecture-node{
    position:absolute;
    z-index:4;
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.1);
    border-radius:50%;
    color:#a9c0d1;
    background:#0a1d32;
    font-size:7px;
    font-weight:900;
    box-shadow:0 10px 30px rgba(0,0,0,.25);
}

.rh-architecture-node--1{left:141px;top:-24px}
.rh-architecture-node--2{right:10px;top:65px}
.rh-architecture-node--3{right:-18px;top:190px}
.rh-architecture-node--4{left:141px;bottom:-24px}
.rh-architecture-node--5{left:-18px;top:190px}
.rh-architecture-node--6{left:10px;top:65px}

.rh-feature-card__content{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:60px;
}

.rh-resource-meta{
    display:flex;
    align-items:center;
    gap:9px;
    color:#6e8aa0;
    font-size:8px;
    font-weight:900;
    letter-spacing:.12em;
}

.rh-resource-meta i{
    width:3px;
    height:3px;
    border-radius:50%;
    background:var(--blue);
}

.rh-feature-card__content h3{
    margin:18px 0 0;
    color:var(--ink);
    font-size:35px;
    line-height:1.06;
    letter-spacing:-.045em;
}

.rh-feature-card__content > p{
    margin:19px 0 0;
    color:#71879a;
    font-size:13px;
    line-height:1.8;
}

.rh-feature-card__points{
    margin-top:28px;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
}

.rh-feature-card__points > div{
    display:grid;
    grid-template-columns:35px 1fr;
    gap:12px;
    padding:14px 0;
}

.rh-feature-card__points > div:not(:last-child){
    border-bottom:1px solid var(--line);
}

.rh-feature-card__points span{
    color:var(--blue);
    font-size:9px;
    font-weight:900;
}

.rh-feature-card__points p{
    margin:0;
    color:#8093a4;
    font-size:10px;
}

.rh-feature-card__points strong{
    color:#203d55;
}

.rh-resource-link{
    width:max-content;
    min-height:46px;
    display:inline-flex;
    align-items:center;
    gap:11px;
    margin-top:28px;
    padding:0 18px;
    border:0;
    border-radius:10px;
    color:#fff;
    background:linear-gradient(135deg,var(--blue),var(--blue-2));
    font-size:10px;
    font-weight:900;
}


/* ============================================================
   RESOURCE LIBRARY
   ============================================================ */

.rh-library{
    background:var(--soft);
}

.rh-library__toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    margin-bottom:30px;
}

.rh-search{
    width:min(470px,100%);
    min-height:52px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:0 15px;
    border:1px solid #d7e4ed;
    border-radius:12px;
    background:#fff;
    box-shadow:0 8px 25px rgba(18,50,76,.035);
}

.rh-search > span{
    color:#7892a5;
}

.rh-search input{
    width:100%;
    min-width:0;
    border:0;
    outline:0;
    color:#18364e;
    background:transparent;
    font-size:11px;
}

.rh-search input::placeholder{
    color:#9babb8;
}

.rh-search kbd{
    color:#95a5b1;
    font-family:inherit;
    font-size:6px;
    font-weight:900;
}

.rh-filter{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:6px;
}

.rh-filter button{
    min-height:38px;
    padding:0 13px;
    border:1px solid #d5e2eb;
    border-radius:9px;
    color:#627b8f;
    background:#fff;
    font-size:9px;
    font-weight:800;
    transition:.2s ease;
}

.rh-filter button:hover,
.rh-filter button.is-active{
    color:#fff;
    border-color:var(--blue);
    background:var(--blue);
}

.rh-library__grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:15px;
}

.rh-resource-card{
    min-width:0;
    overflow:hidden;
    border:1px solid #dce7ef;
    border-radius:17px;
    background:#fff;
    box-shadow:0 14px 40px rgba(15,49,76,.04);
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
}

.rh-resource-card:hover{
    transform:translateY(-5px);
    border-color:rgba(22,135,255,.23);
    box-shadow:0 24px 55px rgba(15,49,76,.09);
}

.rh-resource-card__visual{
    position:relative;
    min-height:180px;
    overflow:hidden;
    padding:18px;
    background:#081a2e;
}

.rh-resource-card__visual > span{
    position:relative;
    z-index:3;
    color:#7ea0b8;
    font-size:7px;
    font-weight:900;
    letter-spacing:.13em;
}

.rh-resource-card__visual::before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.4;
    background-image:
        linear-gradient(rgba(92,163,218,.07) 1px,transparent 1px),
        linear-gradient(90deg,rgba(92,163,218,.07) 1px,transparent 1px);
    background-size:25px 25px;
}

.rh-resource-card__visual--distribution{
    background:linear-gradient(135deg,#06182b,#0c3c69);
}

.rh-resource-card__visual--revenue{
    background:linear-gradient(135deg,#160e31,#3430a0);
}

.rh-resource-card__visual--direct{
    background:linear-gradient(135deg,#082536,#087f96);
}

.rh-resource-card__visual--operations{
    background:linear-gradient(135deg,#08251f,#126b54);
}

.rh-resource-card__visual--guest{
    background:linear-gradient(135deg,#29132c,#7c356d);
}

.rh-resource-card__visual--shopper{
    background:linear-gradient(135deg,#151d34,#284f8d);
}

.rh-resource-card__visual--crs{
    background:linear-gradient(135deg,#0d1c37,#274b9b);
}

.rh-resource-card__visual--launch{
    background:linear-gradient(135deg,#2b1c0b,#87501a);
}

.rh-resource-card__visual--reputation{
    background:linear-gradient(135deg,#26182c,#774a27);
}

.rh-resource-card__body{
    padding:25px;
}

.rh-resource-card__body h3{
    min-height:54px;
    margin:14px 0 0;
    color:#18364e;
    font-size:19px;
    line-height:1.18;
    letter-spacing:-.025em;
}

.rh-resource-card__body > p{
    min-height:67px;
    margin:12px 0 0;
    color:#7a8fa0;
    font-size:10px;
    line-height:1.7;
}

.rh-resource-card__body > button{
    display:flex;
    align-items:center;
    gap:8px;
    margin-top:19px;
    padding:0;
    border:0;
    color:var(--blue);
    background:transparent;
    font-size:9px;
    font-weight:900;
}

.rh-resource-card__body > button span{
    transition:transform .2s ease;
}

.rh-resource-card:hover .rh-resource-card__body > button span{
    transform:translateX(4px);
}

/* card visual mini network */

.rh-mini-network{
    position:absolute;
    inset:43px 25px 20px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:15px;
}

.rh-mini-network b{
    width:70px;
    height:70px;
    display:grid;
    place-items:center;
    border:1px solid rgba(67,225,239,.28);
    border-radius:50%;
    color:#fff;
    background:rgba(67,225,239,.08);
    font-size:9px;
}

.rh-mini-network i{
    width:40px;
    height:40px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.1);
    border-radius:50%;
    color:#8cb0c8;
    font-size:6px;
    font-style:normal;
}

/* revenue mini chart */

.rh-mini-chart{
    position:absolute;
    left:30px;
    right:30px;
    bottom:25px;
    height:100px;
    display:flex;
    align-items:flex-end;
    gap:10px;
}

.rh-mini-chart i{
    flex:1;
    height:var(--bar);
    border-radius:5px 5px 2px 2px;
    background:linear-gradient(180deg,#927cff,#4b69ff);
}

/* direct booking browser */

.rh-browser{
    position:absolute;
    left:28px;
    right:28px;
    top:55px;
    bottom:25px;
    padding:11px;
    border:1px solid rgba(255,255,255,.15);
    border-radius:10px;
    background:rgba(255,255,255,.08);
}

.rh-browser > div{
    display:flex;
    gap:4px;
}

.rh-browser > div i{
    width:5px;
    height:5px;
    border-radius:50%;
    background:#72a7b7;
}

.rh-browser strong{
    display:block;
    margin-top:25px;
    color:#fff;
    font-size:14px;
}

.rh-browser button{
    margin-top:12px;
    padding:7px 11px;
    border:0;
    border-radius:5px;
    color:#07313c;
    background:var(--cyan);
    font-size:6px;
    font-weight:900;
}

/* rooms */

.rh-room-grid{
    position:absolute;
    left:30px;
    right:30px;
    bottom:25px;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:7px;
}

.rh-room-grid i{
    height:38px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.1);
    border-radius:7px;
    color:#8bc4af;
    background:rgba(255,255,255,.04);
    font-size:7px;
    font-style:normal;
}

/* guest */

.rh-guest-profile{
    position:absolute;
    left:30px;
    right:30px;
    top:70px;
    display:flex;
    align-items:center;
    gap:13px;
}

.rh-guest-profile > i{
    width:56px;
    height:56px;
    display:grid;
    place-items:center;
    border-radius:50%;
    color:#fff;
    background:linear-gradient(135deg,#ff79b5,#9b65ff);
    font-style:normal;
    font-weight:900;
}

.rh-guest-profile strong{
    display:block;
    color:#fff;
    font-size:10px;
}

.rh-guest-profile small{
    display:block;
    margin-top:5px;
    color:#bd9eb8;
    font-size:6px;
}

/* rate shopper */

.rh-rate-list{
    position:absolute;
    left:27px;
    right:27px;
    bottom:22px;
}

.rh-rate-list > div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:9px 0;
    border-bottom:1px solid rgba(255,255,255,.08);
}

.rh-rate-list b{
    color:#8ea8bc;
    font-size:7px;
}

.rh-rate-list strong{
    color:#fff;
    font-size:9px;
}

/* CRS */

.rh-crs-flow{
    position:absolute;
    inset:65px 25px 25px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
}

.rh-crs-flow i{
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.12);
    border-radius:50%;
    color:#a9bfdf;
    font-size:7px;
    font-style:normal;
}

.rh-crs-flow i:nth-of-type(2){
    color:#fff;
    border-color:rgba(67,225,239,.28);
    background:rgba(67,225,239,.08);
}

.rh-crs-flow b{
    color:#52789e;
}

/* launch */

.rh-launch-flow{
    position:absolute;
    left:22px;
    right:22px;
    bottom:36px;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:6px;
}

.rh-launch-flow i{
    min-height:42px;
    display:grid;
    place-items:center;
    border:1px solid rgba(255,255,255,.11);
    border-radius:7px;
    color:#d7b37c;
    background:rgba(255,255,255,.035);
    font-size:6px;
    font-style:normal;
}

/* reputation */

.rh-rating{
    position:absolute;
    inset:55px 25px 20px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}

.rh-rating strong{
    color:#fff;
    font-size:38px;
    letter-spacing:-.06em;
}

.rh-rating div{
    margin-top:5px;
    color:#ffbd57;
    letter-spacing:3px;
}

.rh-rating small{
    margin-top:7px;
    color:#ad987e;
    font-size:6px;
    font-weight:900;
}

.rh-empty{
    margin-top:20px;
    padding:35px;
    border:1px dashed #ccdbe6;
    border-radius:15px;
    text-align:center;
    background:#fff;
}

.rh-empty strong{
    color:#18364e;
}

.rh-empty p{
    color:#7d91a2;
}

.rh-empty button{
    padding:9px 14px;
    border:0;
    border-radius:8px;
    color:#fff;
    background:var(--blue);
}


/* ============================================================
   KNOWLEDGE CENTER
   ============================================================ */

.rh-knowledge{
    position:relative;
    padding:110px 0;
    color:#fff;
    background:
        radial-gradient(circle at 78% 35%,rgba(22,135,255,.13),transparent 30%),
        #04101e;
}

.rh-section-head--dark h2{
    color:#fff;
}

.rh-section-head--dark h2 span{
    color:var(--cyan);
}

.rh-section-head--dark > p{
    color:#6f899f;
}

.rh-knowledge__layout{
    display:grid;
    grid-template-columns:190px minmax(0,1fr) 220px;
    gap:12px;
}

.rh-knowledge__nav,
.rh-knowledge__workspace,
.rh-knowledge__insights{
    border:1px solid rgba(255,255,255,.075);
    border-radius:16px;
    background:rgba(255,255,255,.025);
}

.rh-knowledge__nav{
    overflow:hidden;
    padding:8px;
}

.rh-knowledge__nav button{
    width:100%;
    min-height:67px;
    display:grid;
    grid-template-columns:28px 1fr;
    align-items:center;
    gap:10px;
    padding:0 10px;
    border:1px solid transparent;
    border-radius:9px;
    color:#658096;
    background:transparent;
    text-align:left;
}

.rh-knowledge__nav button + button{
    margin-top:3px;
}

.rh-knowledge__nav button > span{
    color:#41647e;
    font-size:8px;
    font-weight:900;
}

.rh-knowledge__nav strong{
    display:block;
    color:#9bb0c0;
    font-size:9px;
}

.rh-knowledge__nav small{
    display:block;
    margin-top:3px;
    color:#4e6b81;
    font-size:6px;
}

.rh-knowledge__nav button.is-active{
    border-color:rgba(67,225,239,.13);
    background:rgba(67,225,239,.055);
}

.rh-knowledge__nav button.is-active > span{
    color:var(--cyan);
}

.rh-knowledge__nav button.is-active strong{
    color:#fff;
}

.rh-knowledge__workspace{
    min-width:0;
    padding:28px;
}

.rh-knowledge__top{
    display:flex;
    justify-content:space-between;
    gap:20px;
}

.rh-knowledge__top > div > span{
    color:var(--cyan);
    font-size:7px;
    font-weight:900;
    letter-spacing:.12em;
}

.rh-knowledge__top h3{
    margin:8px 0 0;
    color:#fff;
    font-size:25px;
    letter-spacing:-.04em;
}

.rh-knowledge__live{
    height:28px;
    display:flex;
    align-items:center;
    gap:6px;
    padding:0 9px;
    border:1px solid rgba(69,224,158,.14);
    border-radius:999px;
    color:#63dda7;
    font-size:6px;
    font-weight:900;
}

.rh-knowledge__live i{
    width:5px;
    height:5px;
    border-radius:50%;
    background:var(--green);
}

.rh-knowledge__workspace > p{
    max-width:620px;
    margin:14px 0 0;
    color:#6d879c;
    font-size:9px;
    line-height:1.75;
}

.rh-knowledge__diagram{
    position:relative;
    width:390px;
    max-width:100%;
    height:320px;
    margin:30px auto;
}

.rh-knowledge__diagram::before,
.rh-knowledge__diagram::after{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    border:1px solid rgba(69,168,236,.11);
    border-radius:50%;
}

.rh-knowledge__diagram::before{
    width:270px;
    height:270px;
}

.rh-knowledge__diagram::after{
    width:190px;
    height:190px;
}

.rh-knowledge__core{
    position:absolute;
    z-index:3;
    left:50%;
    top:50%;
    width:110px;
    height:110px;
    transform:translate(-50%,-50%);
    display:grid;
    place-items:center;
    border:1px solid rgba(67,225,239,.3);
    border-radius:50%;
    background:#09213a;
    box-shadow:0 0 55px rgba(22,135,255,.18);
    text-align:center;
}

.rh-knowledge__core strong{
    display:block;
    color:#fff;
    font-size:27px;
}

.rh-knowledge__core span{
    display:block;
    margin-top:2px;
    color:var(--cyan);
    font-size:6px;
    font-weight:900;
}

.rh-knowledge__orbit{
    position:absolute;
    z-index:4;
}

.rh-knowledge__orbit span{
    min-width:75px;
    height:31px;
    display:grid;
    place-items:center;
    padding:0 10px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:999px;
    color:#8da6b9;
    background:#0a1c30;
    font-size:7px;
    font-weight:800;
}

.rh-knowledge__orbit--one{
    left:50%;
    top:5px;
    transform:translateX(-50%);
}

.rh-knowledge__orbit--two{
    right:0;
    top:50%;
    transform:translateY(-50%);
}

.rh-knowledge__orbit--three{
    left:50%;
    bottom:5px;
    transform:translateX(-50%);
}

.rh-knowledge__orbit--four{
    left:0;
    top:50%;
    transform:translateY(-50%);
}

.rh-knowledge__footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
    padding-top:18px;
    border-top:1px solid rgba(255,255,255,.07);
}

.rh-knowledge__footer > div > span{
    color:#486a83;
    font-size:6px;
    font-weight:900;
}

.rh-knowledge__footer strong{
    display:block;
    max-width:450px;
    margin-top:6px;
    color:#b8cbd9;
    font-size:8px;
    line-height:1.6;
}

.rh-knowledge__footer button{
    min-width:100px;
    height:37px;
    border:1px solid rgba(67,225,239,.14);
    border-radius:8px;
    color:var(--cyan);
    background:rgba(67,225,239,.04);
    font-size:7px;
    font-weight:900;
}

.rh-knowledge__insights{
    padding:18px;
}

.rh-knowledge__insights > span{
    color:#4f7088;
    font-size:6px;
    font-weight:900;
    letter-spacing:.13em;
}

.rh-knowledge__insights article{
    display:flex;
    align-items:center;
    gap:10px;
    margin-top:10px;
    padding:13px 10px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:9px;
    background:rgba(255,255,255,.018);
}

.rh-knowledge__insights article > i{
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    border-radius:7px;
    color:var(--cyan);
    background:rgba(67,225,239,.06);
    font-size:9px;
    font-style:normal;
}

.rh-knowledge__insights strong{
    display:block;
    color:#b9cad6;
    font-size:8px;
}

.rh-knowledge__insights small{
    display:block;
    margin-top:3px;
    color:#516e84;
    font-size:6px;
}


/* ============================================================
   TOPICS
   ============================================================ */

.rh-topics{
    background:#fff;
}

.rh-topics__grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border-top:1px solid var(--line);
    border-left:1px solid var(--line);
}

.rh-topic-card{
    position:relative;
    min-height:275px;
    padding:29px;
    border-right:1px solid var(--line);
    border-bottom:1px solid var(--line);
    background:#fff;
    transition:.25s ease;
}

.rh-topic-card:hover{
    z-index:2;
    transform:translateY(-5px);
    background:#f9fcff;
    box-shadow:0 22px 50px rgba(17,52,80,.08);
}

.rh-topic-card > span{
    color:var(--blue);
    font-size:8px;
    font-weight:900;
}

.rh-topic-card > i{
    position:absolute;
    right:28px;
    top:27px;
    width:35px;
    height:35px;
    display:grid;
    place-items:center;
    border:1px solid var(--line);
    border-radius:50%;
    color:#7891a4;
    font-style:normal;
}

.rh-topic-card h3{
    margin:62px 0 0;
    color:#18364e;
    font-size:25px;
    letter-spacing:-.04em;
}

.rh-topic-card p{
    max-width:270px;
    margin:11px 0 0;
    color:#7a8f9f;
    font-size:10px;
    line-height:1.7;
}

.rh-topic-card strong{
    position:absolute;
    left:29px;
    bottom:27px;
    color:var(--blue);
    font-size:8px;
}


/* ============================================================
   LEARNING PATH
   ============================================================ */

.rh-path{
    padding:105px 0;
    background:var(--soft);
}

.rh-path__intro{
    max-width:680px;
}

.rh-path__flow{
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr;
    align-items:center;
    gap:10px;
    margin-top:50px;
}

.rh-path__flow > article{
    min-height:205px;
    padding:22px;
    border:1px solid var(--line);
    border-radius:15px;
    background:#fff;
    transition:.25s ease;
}

.rh-path__flow > article:hover{
    transform:translateY(-5px);
    border-color:rgba(22,135,255,.25);
    box-shadow:0 20px 45px rgba(17,52,80,.07);
}

.rh-path__flow article > span{
    color:var(--blue);
    font-size:8px;
    font-weight:900;
}

.rh-path__flow article > i{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    margin-top:28px;
    border-radius:10px;
    color:var(--blue);
    background:rgba(22,135,255,.07);
    font-size:15px;
    font-style:normal;
}

.rh-path__flow h3{
    margin:18px 0 0;
    color:#17354d;
    font-size:18px;
}

.rh-path__flow p{
    margin:7px 0 0;
    color:#8193a2;
    font-size:9px;
    line-height:1.6;
}

.rh-path__flow > b{
    color:#9aafbf;
    font-weight:400;
}


/* ============================================================
   PRODUCT STACK
   ============================================================ */

.rh-stack{
    padding:110px 0;
    color:#fff;
    background:
        radial-gradient(circle at 85% 20%,rgba(22,135,255,.13),transparent 30%),
        #061426;
}

.rh-stack__header{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:30px;
}

.rh-stack h2{
    color:#fff;
}

.rh-stack h2 span{
    color:var(--cyan);
}

.rh-stack__header > a{
    color:var(--cyan);
    font-size:9px;
    font-weight:900;
}

.rh-stack__grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    margin-top:48px;
    border-top:1px solid rgba(255,255,255,.08);
    border-left:1px solid rgba(255,255,255,.08);
}

.rh-stack__grid > a{
    position:relative;
    min-height:150px;
    padding:23px;
    border-right:1px solid rgba(255,255,255,.08);
    border-bottom:1px solid rgba(255,255,255,.08);
    transition:.25s ease;
}

.rh-stack__grid > a:hover{
    background:rgba(67,225,239,.045);
}

.rh-stack__grid > a > span{
    color:#466981;
    font-size:7px;
    font-weight:900;
}

.rh-stack__grid strong{
    display:block;
    margin-top:36px;
    color:#d9e6ef;
    font-size:15px;
}

.rh-stack__grid small{
    display:block;
    margin-top:4px;
    color:#5f7d93;
    font-size:7px;
}

.rh-stack__grid i{
    position:absolute;
    right:22px;
    bottom:22px;
    color:var(--cyan);
    font-style:normal;
}


/* ============================================================
   FINAL CTA
   ============================================================ */

.rh-final{
    position:relative;
    overflow:hidden;
    padding:120px 0;
    color:#fff;
    background:linear-gradient(135deg,#020914,#081c35);
}

.rh-final__grid{
    position:absolute;
    inset:0;
    opacity:.32;
    background-image:
        linear-gradient(rgba(69,145,205,.06) 1px,transparent 1px),
        linear-gradient(90deg,rgba(69,145,205,.06) 1px,transparent 1px);
    background-size:45px 45px;
}

.rh-final__glow{
    position:absolute;
    width:600px;
    height:600px;
    right:-200px;
    top:-230px;
    border-radius:50%;
    background:rgba(22,135,255,.15);
    filter:blur(90px);
}

.rh-final__layout{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0,1fr) 430px;
    align-items:center;
    gap:70px;
}

.rh-final h2{
    color:#fff;
}

.rh-final h2 span{
    display:block;
    color:var(--cyan);
}

.rh-final p{
    max-width:580px;
    margin:20px 0 0;
    color:#7791a6;
    font-size:13px;
    line-height:1.8;
}

.rh-final__actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:28px;
}

.rh-final__visual{
    position:relative;
    width:390px;
    max-width:100%;
    height:390px;
    margin:auto;
}

.rh-final__ring{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    border:1px solid rgba(71,170,240,.13);
    border-radius:50%;
}

.rh-final__ring--one{
    width:360px;
    height:360px;
}

.rh-final__ring--two{
    width:270px;
    height:270px;
}

.rh-final__ring--three{
    width:180px;
    height:180px;
}

.rh-final__core{
    position:absolute;
    z-index:3;
    left:50%;
    top:50%;
    width:125px;
    height:125px;
    transform:translate(-50%,-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(67,225,239,.28);
    border-radius:50%;
    background:#09213a;
    box-shadow:0 0 65px rgba(22,135,255,.2);
}

.rh-final__core strong{
    color:#fff;
    font-size:35px;
    letter-spacing:-.07em;
}

.rh-final__core span{
    color:var(--cyan);
    font-size:6px;
    font-weight:900;
}

.rh-final__node{
    position:absolute;
    z-index:4;
    min-width:67px;
    height:31px;
    display:grid;
    place-items:center;
    padding:0 10px;
    border:1px solid rgba(255,255,255,.1);
    border-radius:999px;
    color:#88a4b8;
    background:#0a1d32;
    font-size:6px;
    font-style:normal;
    font-weight:900;
}

.rh-final__node--1{
    left:50%;
    top:0;
    transform:translateX(-50%);
}

.rh-final__node--2{
    right:0;
    top:50%;
    transform:translateY(-50%);
}

.rh-final__node--3{
    left:50%;
    bottom:0;
    transform:translateX(-50%);
}

.rh-final__node--4{
    left:0;
    top:50%;
    transform:translateY(-50%);
}


/* ============================================================
   MODAL
   ============================================================ */

.rh-modal{
    position:fixed;
    z-index:9999;
    inset:0;
    display:grid;
    place-items:center;
    padding:20px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:.25s ease;
}

.rh-modal[aria-hidden="false"]{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}

.rh-modal__backdrop{
    position:absolute;
    inset:0;
    background:rgba(2,9,18,.8);
    backdrop-filter:blur(10px);
}

.rh-modal__dialog{
    position:relative;
    z-index:2;
    width:min(560px,100%);
    max-height:calc(100vh - 40px);
    overflow:auto;
    padding:35px;
    border:1px solid rgba(105,182,239,.16);
    border-radius:22px;
    color:#dbe8f1;
    background:
        radial-gradient(circle at 90% 0%,rgba(22,135,255,.13),transparent 30%),
        #071729;
    box-shadow:0 45px 120px rgba(0,0,0,.5);
}

.rh-modal__close{
    position:absolute;
    right:16px;
    top:16px;
    width:35px;
    height:35px;
    border:1px solid rgba(255,255,255,.1);
    border-radius:50%;
    color:#9cb1c0;
    background:rgba(255,255,255,.035);
    font-size:18px;
}

.rh-modal__top{
    display:flex;
    align-items:center;
    gap:10px;
    color:#56788f;
    font-size:7px;
    font-weight:900;
}

.rh-modal__top > span{
    color:var(--cyan);
}

.rh-modal__icon{
    width:67px;
    height:67px;
    display:grid;
    place-items:center;
    margin-top:30px;
    border:1px solid rgba(67,225,239,.2);
    border-radius:18px;
    color:#fff;
    background:rgba(67,225,239,.06);
    font-size:18px;
    font-weight:900;
}

.rh-modal__dialog h3{
    margin:22px 0 0;
    color:#fff;
    font-size:32px;
    line-height:1.05;
    letter-spacing:-.045em;
}

.rh-modal__dialog > p{
    margin:14px 0 0;
    color:#7690a5;
    font-size:11px;
    line-height:1.75;
}

.rh-modal__points{
    margin-top:25px;
    border-top:1px solid rgba(255,255,255,.075);
}

.rh-modal__points > div{
    display:grid;
    grid-template-columns:30px 1fr;
    gap:12px;
    padding:15px 0;
    border-bottom:1px solid rgba(255,255,255,.075);
}

.rh-modal__points span{
    color:var(--cyan);
    font-size:8px;
    font-weight:900;
}

.rh-modal__points strong{
    color:#b8cad7;
    font-size:9px;
}

.rh-modal__actions{
    margin-top:25px;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media(max-width:1120px){

    .rh-hero__layout{
        grid-template-columns:1fr;
    }

    .rh-terminal{
        width:min(800px,100%);
    }

    .rh-library__grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .rh-knowledge__layout{
        grid-template-columns:175px minmax(0,1fr);
    }

    .rh-knowledge__insights{
        grid-column:1/-1;
        display:grid;
        grid-template-columns:repeat(4,1fr);
        gap:8px;
    }

    .rh-knowledge__insights > span{
        grid-column:1/-1;
    }

    .rh-knowledge__insights article{
        margin-top:0;
    }

    .rh-path__flow{
        grid-template-columns:repeat(5,1fr);
    }

    .rh-path__flow > b{
        display:none;
    }
}


@media(max-width:900px){

    .rh-section-head{
        grid-template-columns:1fr;
        gap:20px;
    }

    .rh-library__toolbar{
        align-items:flex-start;
        flex-direction:column;
    }

    .rh-filter{
        justify-content:flex-start;
    }

    .rh-topics__grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .rh-stack__grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .rh-final__layout{
        grid-template-columns:1fr;
    }

    .rh-feature-card{
        grid-template-columns:1fr;
    }

    .rh-feature-card__visual{
        min-height:420px;
    }
}


@media(max-width:720px){

    .rh-container,
    .rh-hero__layout{
        width:calc(100% - 28px);
    }

    .rh-hero{
        min-height:auto;
        padding:45px 0 65px;
    }

    .rh-breadcrumb{
        margin-bottom:38px;
    }

    .rh-hero h1{
        font-size:47px;
    }

    .rh-hero__signals{
        grid-template-columns:1fr;
    }

    .rh-hero__signals > div:not(:last-child){
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.075);
    }

    .rh-terminal__body{
        grid-template-columns:1fr;
    }

    .rh-terminal__sidebar{
        display:flex;
        overflow-x:auto;
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.07);
    }

    .rh-terminal__sidebar button{
        width:125px;
        flex:none;
    }

    .rh-terminal__visual{
        grid-template-columns:1fr;
    }

    .rh-featured,
    .rh-library,
    .rh-topics,
    .rh-knowledge,
    .rh-path,
    .rh-stack,
    .rh-final{
        padding:78px 0;
    }

    .rh-feature-card__content{
        padding:35px 25px;
    }

    .rh-library__grid{
        grid-template-columns:1fr;
    }

    .rh-knowledge__layout{
        grid-template-columns:1fr;
    }

    .rh-knowledge__nav{
        display:flex;
        overflow-x:auto;
    }

    .rh-knowledge__nav button{
        width:140px;
        flex:none;
    }

    .rh-knowledge__insights{
        grid-template-columns:repeat(2,1fr);
    }

    .rh-topics__grid{
        grid-template-columns:1fr;
    }

    .rh-path__flow{
        grid-template-columns:1fr;
    }

    .rh-stack__header{
        align-items:flex-start;
        flex-direction:column;
    }

    .rh-final__visual{
        height:340px;
    }
}


@media(max-width:520px){

    .rh-hero h1{
        font-size:41px;
    }

    .rh-hero__actions,
    .rh-final__actions{
        display:grid;
    }

    .rh-btn{
        width:100%;
    }

    .rh-terminal__top{
        align-items:flex-start;
        flex-direction:column;
        padding:15px;
    }

    .rh-terminal__workspace{
        padding:17px 13px;
    }

    .rh-terminal__metrics{
        grid-template-columns:1fr;
    }

    .rh-section-head h2,
    .rh-path h2,
    .rh-stack h2,
    .rh-final h2{
        font-size:38px;
    }

    .rh-feature-card__visual{
        min-height:350px;
    }

    .rh-feature-card__architecture{
        width:270px;
        height:270px;
    }

    .rh-architecture-node--1{left:111px}
    .rh-architecture-node--4{left:111px}

    .rh-knowledge__workspace{
        padding:20px 15px;
    }

    .rh-knowledge__top{
        flex-direction:column;
    }

    .rh-knowledge__diagram{
        height:280px;
    }

    .rh-knowledge__insights{
        grid-template-columns:1fr;
    }

    .rh-stack__grid{
        grid-template-columns:1fr;
    }

    .rh-final__visual{
        height:300px;
    }

    .rh-final__ring--one{
        width:290px;
        height:290px;
    }

    .rh-final__ring--two{
        width:220px;
        height:220px;
    }

    .rh-final__ring--three{
        width:150px;
        height:150px;
    }

    .rh-modal__dialog{
        padding:28px 20px;
    }
}


/* ============================================================
   ACCESSIBILITY / REDUCED MOTION
   ============================================================ */

@media(prefers-reduced-motion:reduce){

    .rh *,
    .rh *::before,
    .rh *::after{
        scroll-behavior:auto !important;
        animation:none !important;
        transition:none !important;
    }

    .rh-resource-card:hover,
    .rh-topic-card:hover,
    .rh-path__flow > article:hover,
    .rh-btn:hover{
        transform:none;
    }
}