/* Page-specific styles after shared-theme refactor. */
/* -- Shared layout -- */
.hero {
    padding:58px 32px 40px;
    color:white;
    text-align:center;
}

.hero-eyebrow {
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-size:12px;
    font-weight:900;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:rgba(255,255,255,.74);
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.18);
    border-radius:999px;
    padding:8px 13px;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    margin-bottom:18px;
}

.hero h1 {
    font-size:clamp(42px, 7vw, 78px);
    font-weight:950;
    letter-spacing:-.06em;
    line-height:.92;
    margin-bottom:16px;
    text-shadow:0 14px 40px rgba(0,0,0,.38);
}

.hero-sub {
    font-size:18px;
    color:rgba(255,255,255,.80);
    margin-bottom:34px;
}

/* -- Apple/weather-style conditions card -- */
.conditions-hero {
    max-width:820px;
    margin:0 auto 52px;
    background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78));
    border:1px solid rgba(255,255,255,.46);
    border-radius:34px;
    box-shadow:var(--shadow);
    overflow:hidden;
    backdrop-filter:blur(22px) saturate(150%);
    -webkit-backdrop-filter:blur(22px) saturate(150%);
}

.ch-verdict {
    position:relative;
    padding:34px 38px 30px;
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:center;
    gap:24px;
    border-bottom:1px solid var(--border);
    text-align:left;
}

.ch-verdict::after {
    content:"";
    position:absolute;
    inset:auto 28px 0;
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(15,23,42,.10), transparent);
}

.ch-icon {
    width:88px;
    height:88px;
    border-radius:28px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:52px;
    line-height:1;
    background:rgba(255,255,255,.62);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.65), 0 12px 32px rgba(15,23,42,.14);
    flex-shrink:0;
}

.ch-status-row {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
}

.ch-status {
    font-size:clamp(40px, 6vw, 66px);
    font-weight:950;
    letter-spacing:-.065em;
    line-height:.95;
}

.ch-asof {
    white-space:nowrap;
    font-size:12px;
    font-weight:800;
    color:rgba(15,23,42,.54);
    background:rgba(255,255,255,.62);
    border:1px solid rgba(15,23,42,.08);
    border-radius:999px;
    padding:8px 11px;
    margin-top:4px;
}

.ch-detail {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:16px;
}

.ch-pill {
    display:inline-flex;
    align-items:center;
    gap:6px;
    font-size:13px;
    font-weight:850;
    color:#334155;
    background:rgba(255,255,255,.68);
    border:1px solid rgba(15,23,42,.08);
    border-radius:999px;
    padding:8px 11px;
}

.ch-stats {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1px;
    background:rgba(15,23,42,.07);
}

.ch-stat {
    min-height:128px;
    padding:20px 22px;
    background:rgba(255,255,255,.50);
    display:grid;
    grid-template-rows:1fr auto;
    align-items:end;
    justify-items:center;
    text-align:center;
}

.ch-stat-value {
    align-self:end;
    display:flex;
    align-items:flex-end;
    justify-content:center;
    min-height:54px;
    font-size:34px;
    font-weight:950;
    letter-spacing:-.045em;
    line-height:1;
    color:var(--text);
}

.ch-stat-unit {
    font-size:15px;
    font-weight:900;
    color:var(--muted);
    letter-spacing:-.02em;
    margin-left:4px;
    padding-bottom:3px;
}

.ch-forecast {
    max-width:180px;
    min-height:54px;
    align-items:center;
    font-size:18px;
    font-weight:900;
    letter-spacing:-.025em;
    line-height:1.12;
}

.ch-stat-label {
    height:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:var(--muted);
    margin-top:10px;
}

/* -- Page cards -- */
.cards-section {
    max-width:1180px;
    margin:0 auto;
    padding:0 28px 64px;
}

.section-label {
    font-size:12px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.12em;
    color:rgba(255,255,255,.68);
    margin:0 0 16px 4px;
}

.cards-grid {
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
    gap:18px;
}

.page-card {
    background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.74));
    border:1px solid rgba(255,255,255,.44);
    border-radius:26px;
    box-shadow:0 18px 50px rgba(0,0,0,.24);
    padding:26px 25px 22px;
    display:flex;
    flex-direction:column;
    transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
    position:relative;
    overflow:hidden;
    backdrop-filter:blur(18px) saturate(145%);
    -webkit-backdrop-filter:blur(18px) saturate(145%);
}

.page-card::before {
    content:"";
    position:absolute;
    inset:0 0 auto 0;
    height:5px;
    background:var(--card-accent, var(--teal));
}

.page-card:hover {
    transform:translateY(-5px) scale(1.01);
    background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.82));
    box-shadow:0 28px 70px rgba(0,0,0,.30);
}

.card-icon {
    width:52px;
    height:52px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    line-height:1;
    border-radius:18px;
    background:rgba(255,255,255,.66);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.65), 0 10px 28px rgba(15,23,42,.10);
    margin-bottom:16px;
}

.card-title {
    font-size:19px;
    font-weight:950;
    letter-spacing:-.035em;
    margin-bottom:7px;
}

.card-desc {
    font-size:13.5px;
    color:#475569;
    line-height:1.62;
    flex:1;
}

.card-footer {
    margin-top:18px;
    padding-top:15px;
    border-top:1px solid rgba(15,23,42,.08);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
}

.card-live {
    font-size:12px;
    font-weight:900;
    color:var(--teal);
}

.card-arrow {
    width:30px;
    height:30px;
    border-radius:999px;
    background:rgba(15,23,42,.06);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:17px;
    color:#475569;
    transition:transform .15s ease, background .15s ease, color .15s ease;
    flex-shrink:0;
}

.page-card:hover .card-arrow {
    transform:translateX(4px);
    background:var(--card-accent, var(--teal));
    color:white;
}

.footer {
    text-align:center;
    padding:30px 20px;
    color:rgba(255,255,255,.62);
    font-size:13px;
}
.footer @media (max-width:760px) {
    .hero { padding:38px 16px 28px; }
    .hero-sub { font-size:16px; margin-bottom:24px; }
    .conditions-hero { border-radius:28px; margin-bottom:34px; }
    .ch-verdict {
        grid-template-columns:1fr;
        text-align:center;
        justify-items:center;
        padding:26px 20px 24px;
    }
    .ch-status-row { display:block; }
    .ch-asof { display:inline-flex; margin-top:14px; white-space:normal; }
    .ch-detail { justify-content:center; }
    .ch-icon { width:76px; height:76px; font-size:44px; border-radius:24px; }
    .ch-stats { grid-template-columns:1fr; }
    .ch-stat { min-height:106px; }
    .cards-section { padding:0 16px 46px; }
}

.hero{text-align:center;padding:58px 32px 40px}.conditions-hero{border-radius:34px}
