.earth-hero { background: radial-gradient(ellipse at 90% 15%, #36788a, transparent 65%), #102b3c; }
.earth-hero h1 { font-size: clamp(2.5rem, 6vw, 5rem); }
.earth-hero .hero-grid { min-height: auto; padding-block: 6.5rem 4rem; }
.earth-answer { max-width: 42rem; color: #b5eee3; font-weight: 750; }
.earth-hero-context { padding: clamp(1.5rem, 4vw, 2.5rem); border: 1px solid #678f9d; border-radius: var(--radius); background: #102d3d; }
.earth-hero-context > div { padding-block: 1rem; border-top: 1px solid #426779; }
.earth-hero-context span { color: #b6ece5; font-size: .75rem; text-transform: uppercase; letter-spacing: .07em; }
.earth-hero-context strong { display: block; margin-top: .3rem; font-size: 1.5rem; }
.earth-hero-context p { margin-bottom: 0; color: #c7dce5; }
.earth-dossier .section p { max-width: 68ch; }
.earth-tint { background: #f0f6f7; }
.earth-columns, .earth-comparison { display: grid; gap: clamp(1.5rem, 4vw, 3rem); align-items: center; }
.earth-columns > *, .earth-comparison > * { min-width: 0; }
.earth-source, .earth-license { margin-top: 1.25rem; color: var(--muted); font-size: .82rem; overflow-wrap: anywhere; }
.earth-dossier .section a { color: #135d73; text-underline-offset: .2em; }
.earth-stat { padding: 2rem; border: 1px solid #a2cbc8; border-radius: var(--radius); color: #174a56; background: #e0efed; }
.earth-stat > span { font-size: .8rem; }
.earth-stat > strong { display: block; font-size: clamp(2.5rem, 6vw, 4.5rem); }
.earth-stat small { font-size: 1rem; }
.earth-note { padding: 1.25rem; margin-block: 1.5rem; border-left: 3px solid #16837a; background: #edf6f4; color: #284c58; }
.earth-tint .earth-note { background: #fff; }
.earth-note p:last-child { margin-bottom: 0; }
.earth-takeaway { font-weight: 750; font-size: 1.15rem; color: #175d63; }
.earth-pending { padding: 1.5rem; border: 1px solid #b5ccd2; border-radius: var(--radius); background: #e6eff1; }
.earth-slot-label { color: #45616b; font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; }
.earth-pending h3 { margin-block: 1rem; }
.earth-pending p { color: #43616b; font-size: .9rem; }
.earth-pending a { font-size: .82rem; }
.earth-comparison { align-items: stretch; margin-block: 2rem; }
.earth-comparison article { padding: 1.5rem; border: 1px solid #bed1d6; border-radius: 1rem; background: #fff; }
.earth-comparison article > span { color: #14686d; font-size: .8rem; font-weight: 750; }
.earth-figure { min-width: 0; margin: 0; }
.earth-figure figcaption { padding: .8rem .25rem 0; color: #46616f; font-size: .78rem; }
.shadow-diagram, .horizon-diagram { position: relative; isolation: isolate; overflow: hidden; border: 1px solid #abc7d1; border-radius: 1rem; color: #183e54; background: #e4f0f4; }
.diagram-top { position: absolute; top: 1rem; left: 1rem; right: 1rem; z-index: 2; font-size: .8rem; font-weight: 750; }
.shadow-diagram { height: 21rem; }
.sun-rays { position: absolute; top: 3rem; left: 18%; right: 8%; display: flex; justify-content: space-between; color: #90641b; font-size: 4rem; }
.sun-rays i { font-style: normal; }
.shadow-world { position: absolute; width: 22rem; height: 22rem; top: 11rem; left: 50%; transform: translateX(-50%); border: 3px solid #268d86; border-radius: 50%; background: #bfdfda; }
.shadow-stick { position: absolute; display: block; width: .35rem; height: 4rem; background: #17475a; transform-origin: bottom; border-radius: .2rem; }
.stick-a { top: -4rem; left: 50%; }
.stick-b { top: -1.6rem; left: 83%; transform: rotate(40deg); }
.shadow-mark { position: absolute; top: 3.9rem; left: 80%; width: 2.5rem; height: .3rem; background: #90641b; transform: rotate(45deg); }
.shadow-label { position: absolute; z-index: 2; max-width: 8rem; padding: .5rem; border-radius: .4rem; background: #fff; font-size: .8rem; font-weight: 750; }
.label-a { top: 15rem; left: 10%; }
.label-b { top: 15rem; right: 4%; }
.horizon-diagram { aspect-ratio: 400 / 340; }
.horizon-world { position: absolute; top: 41.18%; left: 10%; width: 80%; aspect-ratio: 1; border: 2px solid #268d86; border-radius: 50%; background: #bfdfda; }
.sightline { position: absolute; left: 50%; height: 2px; transform-origin: left center; }
.sight-high { top: 14.7%; width: 48.3%; transform: rotate(50.3deg); background: #135b7d; }
.sight-low { top: 33.82%; width: 23.2%; transform: rotate(30.4deg); background: #90641b; }
.observer { position: absolute; left: 50%; transform: translateX(-100%); padding: .2rem .6rem; border-radius: .3rem; color: #fff; font-size: .75rem; font-weight: 750; }
.observer-high { top: 14.7%; background: #135b7d; }
.observer-low { top: 33.82%; background: #90641b; }
.horizon-dot { position: absolute; width: .6rem; height: .6rem; transform: translate(-50%, -50%); border-radius: 50%; }
.dot-high { left: 80.75%; top: 58.24%; background: #135b7d; }
.dot-low { left: 70%; top: 47.65%; background: #90641b; }
.horizon-surface { position: absolute; left: 15%; bottom: 15%; font-size: .85rem; font-weight: 750; }
.earth-logic { color: #fff; background: #102e3e; }
.earth-logic .eyebrow { color: #a8eee6; }
.earth-logic p { color: #d5e4ea; font-size: 1.1rem; }
.earth-checklist { display: grid; gap: 1rem; padding: 0; margin-block: 2rem; list-style: none; }
.earth-checklist li { padding: 1.25rem; border: 1px solid #5c8c96; border-radius: .75rem; font-weight: 750; }
.earth-checklist span { margin-right: .75rem; color: #a8eee6; }
.earth-source-note { margin: 0; padding: 0 1rem 1rem; color: var(--muted); font-size: .85rem; }
@media (min-width: 48rem) {
    .earth-columns, .earth-comparison { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .earth-checklist { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 40rem) {
    .earth-hero .hero-grid { padding-top: 6rem; }
    .shadow-diagram { height: 20rem; }
    .diagram-top { font-size: .72rem; }
}
