:root {
    --bg: #ebfadd;
    --bg-soft: #ebf1b1;
    --government-blue: #254a5a;
    --government-blue-deep: #112f15;
    --soft-surface: rgba(235, 250, 221, 0.84);
    --panel: rgba(17, 47, 21, 0.42);
    --panel-strong: rgba(17, 47, 21, 0.72);
    --panel-light: rgba(235, 250, 221, 0.14);
    --text: #112f15;
    --muted: rgba(17, 47, 21, 0.7);
    --muted-strong: rgba(17, 47, 21, 0.88);
    --forest: #728d5a;
    --forest-deep: #112f15;
    --mango: #d99202;
    --mango-soft: #eac96c;
    --line: rgba(17, 47, 21, 0.14);
    --shadow: 0 28px 90px rgba(37, 74, 90, 0.18);
    --radius-xl: 36px;
    --radius-lg: 28px;
    --radius-md: 22px;
    --radius-sm: 18px;
    --hero-text: #ebfadd;
    --hero-muted: rgba(235, 250, 221, 0.76);
    --hero-line: rgba(235, 241, 177, 0.22);
    --glass-bg: rgba(235, 250, 221, 0.1);
    --glass-bg-strong: rgba(235, 250, 221, 0.16);
    --catalog-transition: all 0.7s cubic-bezier(0.25, 1, 0.5, 1);
    --scroll-progress: 0;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    min-height: 100vh;
    overflow-x: hidden;
    font-family: 'Manrope', sans-serif;
    color: var(--text);
    background: linear-gradient(180deg, #ffffff 0%, #f5f7f1 54%, #e5ece0 100%);
    position: relative;
    isolation: isolate;
}

body::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background-image: linear-gradient(rgba(17, 47, 21, 0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(17, 47, 21, 0.03) 1px, transparent 1px);
    background-size: 80px 80px;
    mask-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.7), transparent 76%);
    opacity: 0.12;
}

body::after {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(circle at top left, rgba(217, 146, 2, calc(0.06 + var(--scroll-progress) * 0.1)), transparent 18%),
        radial-gradient(circle at 82% 18%, rgba(214, 187, 122, calc(0.07 + var(--scroll-progress) * 0.12)), transparent 20%),
        linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(241, 244, 236, calc(var(--scroll-progress) * 0.64)) 55%, rgba(156, 170, 144, calc(var(--scroll-progress) * 0.42)) 100%);
    opacity: calc(0.14 + var(--scroll-progress) * 0.92);
    transition: opacity 0.24s ease, background 0.24s ease;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input {
    font: inherit;
}

button {
    border: 0;
    background: none;
    color: inherit;
    cursor: pointer;
}

.experience-shell {
    min-height: 100vh;
    padding: 24px;
    position: relative;
    z-index: 1;
}

.hero-dashboard {
    position: relative;
    min-height: calc(100vh - 48px);
    padding: 28px 28px 24px;
    border-radius: 40px;
    overflow: hidden;
    isolation: isolate;
    box-shadow: var(--shadow);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.22), rgba(111, 139, 89, 0.42));
    color: var(--hero-text);
    transition: var(--catalog-transition);
}

.hero-video,
.hero-backdrop,
.hero-vignette,
.hero-grain,
.hero-type {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.hero-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    filter: saturate(0.96) brightness(1);
    opacity: 0.98;
    transform: scale(1.06);
    transition: var(--catalog-transition);
}

.hero-backdrop {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.74) 0%, rgba(255, 255, 255, 0.48) 18%, rgba(255, 255, 255, 0.22) 34%, rgba(255, 255, 255, 0.06) 56%, rgba(255, 255, 255, 0) 100%),
        radial-gradient(circle at 18% 22%, rgba(235, 250, 221, 0.14), transparent 18%),
        radial-gradient(circle at 74% 16%, rgba(235, 241, 177, 0.12), transparent 24%),
        radial-gradient(circle at 54% 70%, rgba(234, 201, 108, 0.08), transparent 28%);
    transform: scale(1.04);
    filter: saturate(0.98) brightness(1.02);
    opacity: 0.72;
    transition: var(--catalog-transition);
}

.hero-backdrop::before,
.hero-backdrop::after {
    content: '';
    position: absolute;
    inset: -8%;
    transition: var(--catalog-transition);
}

.hero-backdrop::before {
    background: radial-gradient(circle at 20% 24%, rgba(255, 255, 255, 0.22), transparent 22%), radial-gradient(circle at 78% 30%, rgba(234, 201, 108, 0.18), transparent 24%);
    opacity: 0.34;
    transform: translate3d(-2%, -2%, 0) scale(1.02);
}

.hero-backdrop::after {
    background: linear-gradient(135deg, rgba(17, 47, 21, 0.08), transparent 34%, rgba(235, 250, 221, 0.02) 60%, rgba(17, 47, 21, 0.06));
    opacity: 0.18;
    transform: translate3d(0, 0, 0);
}
.hero-dashboard[data-active-index="0"] .hero-video {
    transform: scale(1.06) translate3d(0, 0, 0);
    filter: saturate(0.96) brightness(1);
}

.hero-dashboard[data-active-index="1"] .hero-video {
    transform: scale(1.09) translate3d(-1.8%, -1.2%, 0);
    filter: saturate(1) brightness(1.02);
}

.hero-dashboard[data-active-index="2"] .hero-video {
    transform: scale(1.1) translate3d(1.6%, -1.8%, 0);
    filter: saturate(1.02) brightness(1.03);
}

.hero-dashboard[data-active-index="3"] .hero-video {
    transform: scale(1.08) translate3d(0.8%, 1.4%, 0);
    filter: saturate(1.04) brightness(1.01);
}


.hero-vignette {
    background:
    radial-gradient(circle at 16% 24%, rgba(255, 255, 255, 0.14), transparent 24%),
    radial-gradient(circle at 78% 18%, rgba(255, 255, 255, 0.08), transparent 28%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.02), rgba(24, 47, 23, 0.015));
}

.hero-grain {
    background-image: radial-gradient(rgba(255, 255, 255, 0.08) 0.7px, transparent 0.7px);
    background-size: 14px 14px;
    opacity: 0.08;
}

.hero-type {
    font-family: 'Syne', sans-serif;
    font-size: clamp(5rem, 15vw, 15rem);
    line-height: 0.84;
    letter-spacing: -0.08em;
    color: rgba(255, 255, 255, 0.28);
    mix-blend-mode: soft-light;
    text-transform: uppercase;
    opacity: 0;
    transform: translateY(42px);
    transition: var(--catalog-transition);
}

.hero-type.active {
    opacity: 1;
    transform: translateY(0);
}

.hero-type-a {
    top: 12%;
    left: -1%;
    inset: auto auto auto 2%;
}

.hero-type-b {
    inset: auto 2% 11% auto;
    text-align: right;
}

.topbar,
.hero-grid,
.floating-search {
    position: relative;
    z-index: 2;
}

.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 16px 18px;
    border: 1px solid rgba(235, 241, 177, 0.18);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.48), rgba(255, 255, 255, 0.22));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 18px 50px rgba(17, 47, 21, 0.08);
    backdrop-filter: blur(30px) saturate(170%);
    -webkit-backdrop-filter: blur(30px) saturate(170%);
}

.brand-lockup {
    display: inline-flex;
    align-items: center;
    gap: 14px;
}

.brand-mark {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(24, 49, 29, 0.08);
    box-shadow: 0 18px 42px rgba(17, 47, 21, 0.08);
    overflow: hidden;
}

.brand-mark img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 6px;
}

.brand-lockup > span:last-child {
    display: grid;
    gap: 3px;
}

.brand-lockup strong {
    font-size: 0.98rem;
    font-weight: 700;
    color: var(--hero-text);
}

.brand-lockup small,
.topbar-links a,
.hero-copy p,
.hero-stats span,
.stack-card p,
.slider-insight p,
.insight-meta span {
    color: var(--hero-muted);
}

.topbar-links {
    display: inline-flex;
    gap: 22px;
    font-size: 0.92rem;
}

.topbar-links a {
    transition: color 0.2s ease;
}

.topbar-links a:hover,
.topbar-links a:focus-visible {
    color: var(--hero-text);
}

.topbar-cta,
.button,
.planner-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0 22px;
    border-radius: 999px;
    font-weight: 700;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.topbar-cta,
.planner-button {
    color: #16311d;
    background: linear-gradient(135deg, #ffd84c, #ff9a1f 58%, #fff1a8);
    border: 1px solid rgba(255, 173, 25, 0.32);
    box-shadow: 0 18px 40px rgba(255, 154, 31, 0.28), inset 0 1px 0 rgba(255, 249, 214, 0.94);
}

.planner-button {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(235, 250, 221, 0.78));
    border-color: rgba(24, 49, 29, 0.12);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 14px 32px rgba(17, 47, 21, 0.08);
}

.button-primary {
    color: #102015;
    background: linear-gradient(135deg, var(--mango-soft), var(--mango));
    box-shadow: 0 18px 40px rgba(241, 165, 52, 0.24);
}

.button-secondary {
    border: 1px solid rgba(235, 241, 177, 0.2);
    background: linear-gradient(180deg, rgba(235, 250, 221, 0.12), rgba(235, 250, 221, 0.06));
    color: var(--hero-text);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

.topbar-cta:hover,
.button:hover,
.planner-button:hover,
.control-button:hover,
.quick-pill:hover {
    transform: translateY(-2px);
}

.hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(420px, 0.88fr);
    gap: 28px;
    align-items: center;
    min-height: calc(100vh - 176px);
    padding: 34px 8px 30px;
}

.hero-copy {
    max-width: 580px;
    padding: 24px 22px 24px 18px;
    border-radius: 34px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.14));
    border: 1px solid rgba(255, 255, 255, 0.26);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 24px 58px rgba(17, 47, 21, 0.08);
    backdrop-filter: blur(18px) saturate(145%);
    -webkit-backdrop-filter: blur(18px) saturate(145%);
}

.eyebrow,
.panel-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid rgba(235, 241, 177, 0.22);
    background: linear-gradient(180deg, rgba(235, 250, 221, 0.14), rgba(235, 250, 221, 0.08));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(24px) saturate(160%);
    -webkit-backdrop-filter: blur(24px) saturate(160%);
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--mango-soft);
}

.hero-copy h1,
.panel-header h2,
.slider-insight h3 {
    font-family: 'Cormorant Garamond', serif;
    letter-spacing: -0.04em;
}

.hero-copy h1 {
    max-width: 8ch;
    margin: 16px 0 16px;
    font-size: clamp(3.6rem, 6.2vw, 6.8rem);
    line-height: 0.92;
    color: var(--hero-text);
    text-shadow: 0 10px 30px rgba(0, 0, 0, 0.16);
}

.hero-copy p {
    max-width: 48ch;
    font-size: 0.98rem;
    line-height: 1.68;
    color: var(--hero-muted);
}

.hero-copy .button-secondary {
    color: var(--hero-text);
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 26px;
}

.hero-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 28px;
}

.hero-stats article {
    padding: 16px 16px 18px;
    border: 1px solid rgba(235, 241, 177, 0.18);
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(235, 250, 221, 0.14), rgba(235, 250, 221, 0.07));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(26px) saturate(165%);
    -webkit-backdrop-filter: blur(26px) saturate(165%);
}

.hero-stats strong {
    display: block;
    margin-bottom: 8px;
    font-family: 'Syne', sans-serif;
    font-size: clamp(1.6rem, 3vw, 2.6rem);
    color: var(--hero-text);
}

.slider-panel {
    padding: 20px;
    border: 1px solid rgba(235, 241, 177, 0.16);
    border-radius: var(--radius-xl);
    background: linear-gradient(180deg, rgba(17, 47, 21, 0.34), rgba(111, 139, 89, 0.18));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(34px) saturate(170%);
    -webkit-backdrop-filter: blur(34px) saturate(170%);
    overflow: hidden;
}

.panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.panel-header h2 {
    font-size: clamp(2rem, 3vw, 3rem);
    line-height: 0.92;
}

.slider-controls {
    display: inline-flex;
    gap: 10px;
}

.control-button {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: 1px solid rgba(235, 241, 177, 0.2);
    background: linear-gradient(180deg, rgba(235, 250, 221, 0.14), rgba(235, 250, 221, 0.08));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(24px) saturate(165%);
}

.stacked-slider {
    position: relative;
    display: flex;
    gap: 14px;
    align-items: stretch;
    height: 356px;
    overflow: hidden;
    border-radius: 28px;
}

.stack-card {
    position: relative;
    inset: auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    align-items: end;
    flex: 0 0 96px;
    min-width: 96px;
    min-height: 100%;
    padding: 18px 16px;
    border: 1px solid rgba(235, 241, 177, 0.14);
    border-radius: 26px;
    background: linear-gradient(180deg, rgba(17, 47, 21, 0.28), rgba(111, 139, 89, 0.14));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(28px) saturate(170%);
    -webkit-backdrop-filter: blur(28px) saturate(170%);
    overflow: hidden;
    cursor: pointer;
    will-change: transform, opacity, flex-basis;
    transform-origin: center center;
    transition: var(--catalog-transition);
}

.stack-card::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.22), transparent 34%, transparent 70%, rgba(235, 241, 177, 0.14));
    opacity: 0;
    transition: var(--catalog-transition);
}

.stack-card:hover,
.stack-card:focus-visible {
    border-color: rgba(255, 199, 111, 0.2);
}

.stack-card.active,
.stack-card.is-active {
    z-index: 3;
    flex: 1 1 0;
    min-width: 0;
    border-color: rgba(234, 201, 108, 0.34);
    background: linear-gradient(180deg, rgba(17, 47, 21, 0.38), rgba(111, 139, 89, 0.2));
    transform: translate3d(0, 0, 0) scale(1);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.34);
}

.stack-card.active::after,
.stack-card.is-active::after {
    opacity: 1;
}

.stack-card.is-prev {
    z-index: 2;
    flex-basis: 118px;
    transform: translate3d(0, 0, 0) scale(0.98);
    opacity: 0.9;
    filter: saturate(0.88);
}

.stack-card.is-next {
    z-index: 1;
    flex-basis: 92px;
    transform: translate3d(0, 0, 0) scale(0.96);
    opacity: 0.72;
    filter: saturate(0.76);
}

.stack-card.is-hidden {
    z-index: 0;
    flex-basis: 76px;
    opacity: 0.48;
    pointer-events: auto;
    transform: translate3d(0, 0, 0) scale(0.92);
}

.card-image {
    position: absolute;
    inset: 0;
    height: 100%;
    min-height: 100%;
    border-radius: 24px;
    background-position: center;
    background-size: cover;
    box-shadow: inset 0 -140px 120px rgba(0, 0, 0, 0.34);
    transform: scale(1.02);
    filter: saturate(0.74) brightness(0.84);
    transition: var(--catalog-transition);
}

.stack-card.active .card-image,
.stack-card.is-active .card-image {
    transform: scale(1);
    filter: saturate(1) brightness(1);
}

.card-content {
    position: relative;
    z-index: 1;
    margin-top: auto;
    padding-right: 0;
    display: grid;
    align-content: end;
    gap: 8px;
    transition: var(--catalog-transition);
}

.card-index {
    display: inline-flex;
    margin-bottom: 12px;
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    color: var(--mango-soft);
}

.stack-card h3 {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.65rem, 2.2vw, 2.3rem);
    line-height: 0.95;
    color: var(--hero-text);
    max-width: 7ch;
    transition: var(--catalog-transition);
}

.stack-card p {
    max-width: 36ch;
    margin-top: 8px;
    font-size: 0.92rem;
    line-height: 1.55;
    opacity: 0;
    max-height: 56px;
    overflow: hidden;
    transition: var(--catalog-transition);
}

.stack-card.active p,
.stack-card.is-active p {
    opacity: 1;
    max-height: 108px;
}

.stack-card:not(.active):not(.is-active) .card-content {
    transform: translateY(6px);
}

.stack-card:not(.active):not(.is-active) h3 {
    max-width: none;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-size: 1.05rem;
    line-height: 0.88;
    text-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
}

.stack-card:not(.active):not(.is-active) p {
    opacity: 0;
    max-height: 0;
    margin-top: 0;
}

.hero-dashboard[data-active-index="0"] .hero-backdrop {
    transform: scale(1.04) translate3d(0, 0, 0);
    filter: saturate(0.94) brightness(0.97);
}

.hero-dashboard[data-active-index="1"] .hero-backdrop {
    transform: scale(1.07) translate3d(-1.6%, -1.2%, 0);
    filter: saturate(1.04) brightness(1.01);
}

.hero-dashboard[data-active-index="2"] .hero-backdrop {
    transform: scale(1.08) translate3d(1.4%, -1.8%, 0);
    filter: saturate(1.08) brightness(1.03);
}

.hero-dashboard[data-active-index="3"] .hero-backdrop {
    transform: scale(1.06) translate3d(0.8%, 1.4%, 0);
    filter: saturate(1.12) brightness(1);
}

.hero-dashboard[data-active-index="0"] .hero-backdrop::before {
    transform: translate3d(-2%, -2%, 0) scale(1.02);
    opacity: 0.52;
}

.hero-dashboard[data-active-index="1"] .hero-backdrop::before {
    transform: translate3d(6%, -6%, 0) scale(1.08);
    opacity: 0.62;
}

.hero-dashboard[data-active-index="2"] .hero-backdrop::before {
    transform: translate3d(-5%, 4%, 0) scale(1.1);
    opacity: 0.66;
}

.hero-dashboard[data-active-index="3"] .hero-backdrop::before {
    transform: translate3d(4%, 8%, 0) scale(1.04);
    opacity: 0.58;
}

.hero-dashboard[data-active-index="0"] .hero-type-a,
.hero-dashboard[data-active-index="0"] .hero-type-b {
    opacity: 0.14;
}

.hero-dashboard[data-active-index="1"] .hero-type-a,
.hero-dashboard[data-active-index="1"] .hero-type-b {
    opacity: 0.12;
    transform: translateY(-8px);
}

.hero-dashboard[data-active-index="2"] .hero-type-a,
.hero-dashboard[data-active-index="2"] .hero-type-b {
    opacity: 0.15;
    transform: translateY(8px);
}

.hero-dashboard[data-active-index="3"] .hero-type-a,
.hero-dashboard[data-active-index="3"] .hero-type-b {
    opacity: 0.13;
    transform: translateY(-4px);
}

.slider-insight {
    display: grid;
    gap: 14px;
    position: relative;
    z-index: 4;
    margin-top: 18px;
    padding: 18px;
    border-radius: 24px;
    border: 1px solid rgba(235, 241, 177, 0.18);
    background: linear-gradient(180deg, rgba(235, 250, 221, 0.14), rgba(235, 250, 221, 0.08));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(28px) saturate(165%);
    -webkit-backdrop-filter: blur(28px) saturate(165%);
}

.slider-insight h3 {
    font-size: clamp(1.9rem, 2.8vw, 2.7rem);
    line-height: 0.94;
    color: var(--hero-text);
}

.insight-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.insight-meta span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.floating-search {
    position: relative;
    left: auto;
    bottom: auto;
    transform: none;
    width: min(1040px, 100%);
    margin: 8px auto 0;
    display: grid;
    grid-template-columns: minmax(260px, 1.25fr) minmax(280px, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 16px;
    border: 1px solid rgba(235, 241, 177, 0.18);
    border-radius: 32px;
    background: linear-gradient(180deg, rgba(17, 47, 21, 0.28), rgba(111, 139, 89, 0.14));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 22px 64px rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(34px) saturate(170%);
    -webkit-backdrop-filter: blur(34px) saturate(170%);
    box-shadow: 0 22px 64px rgba(0, 0, 0, 0.24);
}

.search-field {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 64px;
    padding: 0 20px;
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(235, 250, 221, 0.14), rgba(235, 250, 221, 0.08));
    border: 1px solid rgba(235, 241, 177, 0.18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(24px) saturate(165%);
    -webkit-backdrop-filter: blur(24px) saturate(165%);
}

.search-field i {
    color: var(--mango-soft);
}

.search-field input {
    width: 100%;
    color: var(--hero-text);
    background: transparent;
    border: 0;
    outline: 0;
}

.search-field input::placeholder {
    color: var(--hero-muted);
}

.quick-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.quick-pill {
    min-height: 48px;
    padding: 0 16px;
    border-radius: 999px;
    color: var(--hero-text);
    background: linear-gradient(180deg, rgba(235, 250, 221, 0.14), rgba(235, 250, 221, 0.08));
    border: 1px solid rgba(235, 241, 177, 0.18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(24px) saturate(165%);
    -webkit-backdrop-filter: blur(24px) saturate(165%);
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.quick-pill.is-selected {
    color: #0f1d14;
    background: linear-gradient(135deg, rgba(255, 199, 111, 0.98), rgba(241, 165, 52, 0.98));
    border-color: transparent;
}

.hero-dashboard :is(h1, h2, h3, strong, b, .topbar-links a, .brand-lockup small, .button-secondary, .stack-card, .slider-insight, .search-field input, .quick-pill, .control-button) {
    color: #16311a;
}

.hero-dashboard :is(.hero-copy p, .hero-stats span, .stack-card p, .slider-insight p, .insight-meta span) {
    color: rgba(24, 49, 29, 0.88);
}

.hero-dashboard :is(.topbar, .hero-stats article, .slider-panel, .slider-insight, .floating-search, .quick-pill, .search-field, .control-button, .button-secondary) {
    background-color: rgba(255, 255, 255, 0.14);
}

.hero-dashboard :is(.topbar, .hero-stats article, .slider-panel, .slider-insight, .floating-search, .quick-pill, .search-field, .control-button, .button-secondary) {
    border-color: rgba(235, 241, 177, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.04), 0 18px 42px rgba(17, 47, 21, 0.08);
}

.hero-dashboard .button-primary,
.hero-dashboard .quick-pill.is-selected,
.hero-dashboard .planner-button {
    color: #102015;
}

.hero-dashboard .brand-lockup strong,
.hero-dashboard .brand-lockup small,
.hero-dashboard .topbar-links a,
.hero-dashboard .hero-copy h1,
.hero-dashboard .hero-copy p {
    color: #18311d;
}

.hero-dashboard .hero-copy h1 {
    color: #14301a;
    text-shadow: 0 10px 18px rgba(255, 255, 255, 0.16);
    opacity: 1;
}

.hero-dashboard .hero-copy p,
.hero-dashboard .topbar-links a,
.hero-dashboard .brand-lockup small {
    color: rgba(24, 49, 29, 0.88);
    opacity: 1;
}

.hero-dashboard .hero-copy,
.hero-dashboard .topbar,
.hero-dashboard .hero-grid,
.hero-dashboard .floating-search,
.hero-dashboard .slider-panel,
.hero-dashboard .slider-insight {
    isolation: isolate;
}

.slider-panel {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.36), rgba(207, 223, 181, 0.26));
}

.floating-search {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.32), rgba(207, 223, 181, 0.2));
}

.hero-dashboard .eyebrow {
    color: #c58a05;
    border-color: rgba(24, 49, 29, 0.1);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.44), rgba(255, 255, 255, 0.24));
}

.hero-dashboard.is-ready .hero-copy,
.hero-dashboard.is-ready .slider-panel,
.hero-dashboard.is-ready .floating-search,
.hero-dashboard.is-ready .topbar {
    animation: riseIn 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.hero-dashboard.is-ready .eyebrow,
.hero-dashboard.is-ready .hero-stats article,
.hero-dashboard.is-ready .stack-card,
.hero-dashboard.is-ready .slider-insight {
    animation: fadeLift 1s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.hero-dashboard.is-ready .eyebrow {
    animation-delay: 0.04s;
}

.hero-dashboard.is-ready .hero-stats article:nth-child(1) {
    animation-delay: 0.22s;
}

.hero-dashboard.is-ready .hero-stats article:nth-child(2) {
    animation-delay: 0.3s;
}

.hero-dashboard.is-ready .hero-stats article:nth-child(3) {
    animation-delay: 0.38s;
}

.hero-dashboard.is-ready .stack-card:nth-child(1) {
    animation-delay: 0.14s;
}

.hero-dashboard.is-ready .stack-card:nth-child(2) {
    animation-delay: 0.2s;
}

.hero-dashboard.is-ready .stack-card:nth-child(3) {
    animation-delay: 0.26s;
}

.hero-dashboard.is-ready .stack-card:nth-child(4) {
    animation-delay: 0.32s;
}

.hero-dashboard.is-ready .slider-insight {
    animation-delay: 0.24s;
}

.reveal {
    opacity: 0;
    transform: translate3d(0, 64px, 0) scale(0.985);
    filter: blur(16px);
    transition: opacity 1s cubic-bezier(0.25, 1, 0.5, 1), transform 1s cubic-bezier(0.25, 1, 0.5, 1), filter 1s cubic-bezier(0.25, 1, 0.5, 1);
}

.reveal.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
}

.reveal-child {
    opacity: 0;
    transform: translate3d(0, 38px, 0) scale(0.98);
    filter: blur(12px);
    transition: opacity 0.92s cubic-bezier(0.25, 1, 0.5, 1), transform 0.92s cubic-bezier(0.25, 1, 0.5, 1), filter 0.92s cubic-bezier(0.25, 1, 0.5, 1);
}

.reveal.is-visible .reveal-child {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
}

.reveal .section-heading.reveal-child {
    transform: translate3d(0, 46px, 0) scale(0.985);
}

.reveal .glass-card.reveal-child,
.reveal .connect-card.reveal-child {
    transform: translate3d(0, 44px, 0) scale(0.965);
}

.reveal.is-visible .glass-card.reveal-child:hover,
.reveal.is-visible .connect-card.reveal-child:hover {
    transform: translate3d(0, -6px, 0) scale(1.01);
}

.reveal.is-visible .reveal-child:nth-child(2) {
    transition-delay: 0.08s;
}

.reveal.is-visible .reveal-child:nth-child(3) {
    transition-delay: 0.16s;
}

.reveal.is-visible .reveal-child:nth-child(4) {
    transition-delay: 0.24s;
}

.reveal.is-visible .reveal-child:nth-child(5) {
    transition-delay: 0.32s;
}

@keyframes fadeLift {
    from {
        opacity: 0;
        transform: translateY(18px);
        filter: blur(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }
}

.content-section {
    padding: 26px 24px 0;
}

.section-shell {
    width: min(1280px, 100%);
    margin: 0 auto;
}

.section-heading {
    display: grid;
    gap: 12px;
    max-width: 760px;
    margin-bottom: 24px;
}

.section-kicker,
.mini-label,
.news-tag {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 36px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid rgba(17, 47, 21, 0.12);
    background: rgba(255, 255, 255, 0.74);
    color: var(--mango);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.section-heading h2,
.search-panel h3,
.trend-card h3,
.video-card h3,
.news-card h3,
.connect-card h3 {
    font-family: 'Cormorant Garamond', serif;
    letter-spacing: -0.04em;
    color: #16311a;
}

.section-heading h2 {
    font-size: clamp(2.3rem, 4.2vw, 4.2rem);
    line-height: 0.96;
}

.section-heading p,
.search-panel p,
.trend-card p,
.video-card p,
.news-card p,
.connect-card p,
.connect-card a {
    color: rgba(17, 47, 21, 0.72);
    line-height: 1.66;
}

.glass-card {
    border: 1px solid rgba(17, 47, 21, 0.1);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(232, 238, 228, 0.54));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86), 0 22px 54px rgba(17, 47, 21, 0.08);
    backdrop-filter: blur(26px) saturate(145%);
    -webkit-backdrop-filter: blur(26px) saturate(145%);
}

.trends-grid {
    display: grid;
    grid-template-columns: minmax(420px, 0.48fr) minmax(0, 1fr);
    gap: 18px;
}

.trends-sidebar {
    display: grid;
    gap: 18px;
}

.search-panel,
.support-card,
.trend-card,
.video-card,
.news-card,
.connect-shell,
.connect-card {
    border-radius: 30px;
}

.search-panel,
.support-card {
    display: grid;
    gap: 14px;
    padding: 26px;
}

.support-media,
.contact-preview {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(17, 47, 21, 0.08);
    aspect-ratio: 16 / 10;
    background: rgba(17, 47, 21, 0.08);
}

.support-media img,
.contact-preview img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.live-widget {
    display: grid;
    gap: 10px;
    padding: 14px;
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.46);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0.24)),
        radial-gradient(circle at top left, rgba(255, 255, 255, 0.34), transparent 34%),
        linear-gradient(180deg, rgba(229, 236, 224, 0.42), rgba(255, 255, 255, 0.18));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86), 0 18px 42px rgba(17, 47, 21, 0.08);
    backdrop-filter: blur(34px) saturate(170%);
    -webkit-backdrop-filter: blur(34px) saturate(170%);
}

.live-widget-top,
.live-widget-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.live-location {
    color: rgba(17, 47, 21, 0.68);
    font-weight: 700;
    font-size: 0.94rem;
}

.live-weather strong,
.live-widget-grid strong {
    display: block;
    font-family: 'Syne', sans-serif;
    font-size: clamp(1.28rem, 2vw, 1.9rem);
    line-height: 0.9;
    letter-spacing: -0.05em;
    overflow-wrap: anywhere;
    color: #16311a;
}

[data-live-time] {
    max-width: 100%;
    font-size: clamp(1rem, 1.8vw, 1.32rem);
    line-height: 0.88;
    letter-spacing: -0.06em;
    white-space: nowrap;
}

.live-weather span,
.live-widget-grid span,
.live-widget-grid small {
    color: rgba(17, 47, 21, 0.72);
    font-size: 0.78rem;
    line-height: 1.32;
}

.live-icon {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.62), rgba(232, 192, 108, 0.54));
    border: 1px solid rgba(255, 255, 255, 0.5);
    color: #18311d;
    font-size: 1.2rem;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 14px 30px rgba(147, 167, 132, 0.14);
}

.live-widget-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.live-widget-grid article {
    display: grid;
    align-content: start;
    gap: 5px;
    min-width: 0;
    overflow: hidden;
    min-height: 0;
    padding: 11px 12px;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.42);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.48), rgba(233, 239, 229, 0.28));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.search-tags,
.social-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.search-tags span,
.social-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid rgba(17, 47, 21, 0.12);
    background: rgba(255, 255, 255, 0.66);
    color: #16311a;
}

.contact-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 18px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--mango-soft), var(--mango));
    color: #102015;
    font-weight: 700;
    box-shadow: 0 14px 28px rgba(217, 146, 2, 0.2);
}

.trend-list,
.video-grid,
.news-grid,
.connect-grid {
    display: grid;
    gap: 18px;
}

.trend-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.trend-card,
.video-card,
.news-card,
.connect-card {
    display: grid;
    gap: 12px;
    padding: 24px;
}

.trend-index,
.play-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 18px;
    color: #102015;
    background: linear-gradient(135deg, var(--mango-soft), var(--mango));
    box-shadow: 0 12px 30px rgba(217, 146, 2, 0.18);
}

.trend-card small,
.news-link {
    color: #254a5a;
    font-weight: 700;
}

.video-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.video-card {
    min-height: 320px;
    align-content: start;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.78)),
        radial-gradient(circle at top right, rgba(217, 146, 2, 0.18), transparent 24%),
    linear-gradient(180deg, rgba(233, 239, 229, 0.78), rgba(255, 255, 255, 0.92));
}

.video-media {
    position: relative;
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(17, 47, 21, 0.1);
    background: rgba(17, 47, 21, 0.08);
    aspect-ratio: 9 / 13;
}

.video-media video {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    background: #dfe8d2;
}

.play-badge {
    width: 44px;
    height: 44px;
    margin-top: 4px;
}

.news-grid {
    grid-template-columns: 1.2fr 1fr 1fr;
}

.news-card-feature {
    grid-row: span 2;
    min-height: 100%;
}

.news-card {
    overflow: hidden;
}

.news-card-link {
    display: grid;
    gap: 16px;
    height: 100%;
}

.news-card-link:hover .news-media img,
.news-card-link:focus-visible .news-media img,
.support-card:hover .support-media img,
.support-card:focus-within .support-media img,
.contact-preview:hover img {
    transform: scale(1.04);
}

.news-copy {
    display: grid;
    gap: 12px;
}

.news-media {
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid rgba(17, 47, 21, 0.08);
    aspect-ratio: 16 / 10;
    background: rgba(17, 47, 21, 0.08);
}

.news-media img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.35s ease;
}

.connect-shell {
    padding: 26px;
    margin-top: 10px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(241, 244, 238, 0.74));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 22px 54px rgba(17, 47, 21, 0.06);
}

.connect-section {
    position: relative;
    z-index: 0;
    padding-bottom: 20px;
}

.connect-section .section-heading p,
.connect-section .connect-card p,
.connect-section .connect-card a {
    color: rgba(17, 47, 21, 0.8);
}

.connect-section .mini-label,
.connect-section .section-kicker {
    background: rgba(255, 255, 255, 0.9);
}

.connect-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 12px;
    align-items: start;
}

.connect-card {
    align-content: start;
}

.connect-card .mini-label {
    justify-self: start;
}

.connect-card a {
    text-decoration: none;
}

.connect-card a + a {
    margin-top: 4px;
}

.social-links {
    align-items: center;
}

.social-links a {
    width: 54px;
    min-width: 54px;
    min-height: 54px;
    padding: 0;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(241, 244, 238, 0.58));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84), 0 10px 24px rgba(17, 47, 21, 0.06);
}

.contact-button {
    min-height: 50px;
    width: fit-content;
    min-width: 190px;
    justify-self: start;
    padding: 0 24px;
    border: 1px solid rgba(255, 214, 94, 0.46);
    border-radius: 999px;
    background: linear-gradient(135deg, #f7cf61, #eda700 72%);
    box-shadow: 0 14px 30px rgba(217, 146, 2, 0.18), inset 0 1px 0 rgba(255, 245, 214, 0.9);
}

.hero-dashboard.is-ready .slider-panel {
    animation-delay: 0.08s;
}

.hero-dashboard.is-ready .floating-search {
    animation-delay: 0.16s;
}

.hero-dashboard.is-ready .topbar {
    animation-delay: 0.24s;
}

@keyframes riseIn {
    from {
        opacity: 0;
        transform: translateY(24px);
        filter: blur(14px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }
}

@media (max-width: 1320px) {
    .experience-shell {
        padding: 16px;
    }

    .hero-dashboard {
        min-height: auto;
        padding: 22px;
        border-radius: 32px;
    }

    .topbar {
        flex-wrap: wrap;
        border-radius: 32px;
        padding: 14px;
    }

    .topbar-links {
        order: 3;
        width: 100%;
        justify-content: space-between;
    }

    .topbar-cta {
        width: 100%;
    }

    .hero-grid {
        grid-template-columns: 1fr;
        min-height: auto;
        gap: 22px;
        padding: 28px 0 22px;
    }

    .hero-copy {
        max-width: none;
    }

    .hero-copy h1 {
        max-width: 10ch;
        font-size: clamp(3.3rem, 8vw, 5.4rem);
    }

    .slider-panel {
        max-width: 100%;
        width: 100%;
    }

    .floating-search {
        grid-template-columns: 1fr;
        width: 100%;
    }

    .planner-button {
        width: 100%;
    }

    .hero-type {
        font-size: clamp(4rem, 14vw, 8rem);
    }
}

@media (max-width: 1180px) {
    .trends-grid {
        grid-template-columns: 1fr;
    }

    .trend-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1024px) {
    .hero-grid {
        grid-template-columns: 1fr;
        min-height: auto;
        padding-bottom: 22px;
    }

    .hero-copy {
        max-width: none;
    }

    .slider-panel {
        max-width: 760px;
    }

    .floating-search {
        grid-template-columns: 1fr;
    }

    .stacked-slider {
        height: 332px;
    }

    .trends-grid,
    .video-grid,
    .news-grid,
    .connect-grid {
        grid-template-columns: 1fr 1fr;
    }

    .trend-list {
        grid-template-columns: 1fr;
    }

    .news-card-feature {
        grid-row: auto;
        grid-column: 1 / -1;
    }
}

@media (max-width: 820px) {
    .experience-shell {
        padding: 12px;
    }

    .hero-dashboard {
        min-height: auto;
        padding: 18px;
        border-radius: 28px;
    }

    .topbar {
        flex-wrap: wrap;
        border-radius: 28px;
    }

    .topbar-links {
        width: 100%;
        justify-content: space-between;
        order: 3;
    }

    .hero-grid {
        padding: 40px 0 204px;
    }

    .hero-copy h1 {
        font-size: clamp(3.2rem, 15vw, 5.2rem);
    }

    .hero-stats {
        grid-template-columns: 1fr;
    }

    .slider-panel {
        padding: 18px;
    }

    .stacked-slider {
        height: auto;
        display: grid;
        gap: 14px;
    }

    .stack-card,
    .stack-card.is-active {
        position: relative;
        inset: auto;
        grid-template-columns: 1fr;
        min-height: auto;
        transform: none;
        opacity: 1;
        filter: none;
        pointer-events: auto;
    }

    .stack-card.is-prev,
    .stack-card.is-next,
    .stack-card.is-hidden {
        position: relative;
        inset: auto;
        transform: none;
        opacity: 1;
        filter: none;
        pointer-events: auto;
    }

    .card-image,
    .stack-card.is-active .card-image {
        min-height: 170px;
    }

    .floating-search {
        position: relative;
        left: auto;
        bottom: auto;
        width: 100%;
        margin-top: 28px;
        transform: none;
    }

    .quick-pills {
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 4px;
    }

    .quick-pill {
        white-space: nowrap;
    }

    .hero-type {
        font-size: clamp(4rem, 22vw, 7rem);
    }

    .hero-type-a,
    .hero-type-b {
        display: none;
    }

    .content-section {
        padding: 18px 12px 0;
    }

    .trends-grid,
    .video-grid,
    .news-grid,
    .connect-grid {
        grid-template-columns: 1fr;
    }

    .connect-shell,
    .search-panel,
    .trend-card,
    .video-card,
    .news-card,
    .connect-card {
        padding: 20px;
        border-radius: 24px;
    }

    .news-card-link {
        gap: 14px;
    }

    .news-media {
        aspect-ratio: 16 / 11;
    }

    .live-widget-main {
        align-items: flex-start;
    }

    .live-icon {
        width: 72px;
        height: 72px;
        border-radius: 22px;
        font-size: 1.7rem;
    }

    .live-widget-grid {
        grid-template-columns: 1fr;
    }

    .live-widget-grid article {
        min-height: auto;
    }

    .live-weather strong,
    .live-widget-grid strong {
        font-size: clamp(1.85rem, 12vw, 2.9rem);
    }

    [data-live-time] {
        font-size: clamp(1.45rem, 8vw, 2.1rem);
    }
}

@media (max-width: 480px) {
    .topbar-links {
        gap: 12px;
        font-size: 0.86rem;
    }

    .brand-mark {
        width: 58px;
        height: 58px;
        border-radius: 18px;
    }

    .hero-copy {
        padding: 18px 16px;
        border-radius: 26px;
    }

    .hero-copy h1 {
        font-size: clamp(2.7rem, 13vw, 4rem);
        max-width: none;
    }

    .hero-actions {
        grid-template-columns: 1fr;
    }

    .hero-actions .button,
    .hero-actions a {
        width: 100%;
    }

    .hero-dashboard {
        padding: 14px;
        border-radius: 24px;
    }

    .live-widget {
        gap: 10px;
        padding: 14px;
        border-radius: 24px;
    }

    .live-widget-top,
    .live-widget-main {
        gap: 8px;
    }

    .live-location {
        font-size: 0.9rem;
    }

    .live-weather strong,
    .live-widget-grid strong {
        font-size: clamp(1.35rem, 8vw, 1.9rem);
    }

    .live-weather span,
    .live-widget-grid span,
    .live-widget-grid small {
        font-size: 0.72rem;
        line-height: 1.35;
    }

    [data-live-time] {
        font-size: clamp(1.1rem, 6vw, 1.45rem);
    }

    .live-icon {
        width: 58px;
        height: 58px;
        border-radius: 18px;
        font-size: 1.3rem;
    }

    .live-widget-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .live-widget-grid article {
        gap: 6px;
        padding: 12px;
        border-radius: 18px;
    }

    .trends-section .section-heading {
        margin-bottom: 18px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation: none !important;
        transition: none !important;
        scroll-behavior: auto !important;
    }
}