/* 21 · Aurora */
.ed-aurora {
    --canvas: #0d192a; --surface: #142436; --wash: #183042; --line: #3a5867;
    --ink: #edfffc; --muted: #bfdbde; --accent: #93f0da; --action: #93f0da; --on-action: #142c30; --radius: 20px;
}
.ed-aurora .ed-hero {
    display: grid; align-items: end; min-height: min(735px, 84svh);
    grid-template-columns: minmax(0,1fr) minmax(210px, .38fr);
    padding: clamp(26px,7vw,96px) max(var(--gutter),calc((100% - var(--max)) / 2));
}
.ed-aurora :is(.ed-cover,.ed-inner-art) {
    background: radial-gradient(ellipse at 15% 12%, #466998aa, transparent 52%), #101926;
    isolation: isolate;
}
.ed-aurora .ed-cover { position: absolute; inset: 0; z-index: -1; }
.ed-aurora :is(.ed-cover,.ed-inner-art)::after {
    content: ""; position: absolute; inset: 0;
    background:
        radial-gradient(ellipse at 76% 10%, #fac9fc89, transparent 46%),
        repeating-linear-gradient(104deg, #b8ffdc24 0 2%, transparent 4% 8%),
        linear-gradient(110deg,#26306a 3%,#33a58d 28%,#b9ffd5 50%,#4fd7c8 59%,#273b72 86%);
    clip-path: polygon(0 30%, 26% 40%, 50% 23%, 76% 7%, 100% 13%, 100% 52%, 76% 40%, 50% 55%, 26% 66%, 0 57%);
    clip-path: shape(from 0 31%, curve to 51% 23% with 19% 51% / 32% 44%, curve to 100% 13% with 64% 5% / 79% 1%, line to 100% 52%, curve to 50% 55% with 80% 35% / 66% 37%, curve to 0 57% with 30% 75% / 15% 68%, close);
    mask-image: linear-gradient(black 12%, #000e 48%, transparent 82%);
}
.ed-aurora .ed-hero-frame { width: 100%; margin: 0; }
.ed-aurora .ed-hero-nav { display: grid; gap: 0; border-top: 1px solid var(--line); }
.ed-aurora .ed-hero-nav a { padding-block: 4px; border-bottom: 1px solid var(--line); }
.ed-aurora .ed-overview { border: 1px solid var(--line); background: linear-gradient(130deg,var(--wash),var(--surface)); }
.ed-aurora .ed-plan { border-radius: 24px 24px 8px 8px; }
.ed-aurora .ed-recommended { box-shadow: inset 0 3px var(--accent); }

/* 22 · Sky deck */
.ed-monument {
    --canvas: #f1f8f9; --surface: #fff; --wash: #e0ecee; --line: #c6dce1;
    --ink: #163c4b; --muted: #365c69; --accent: #245e71; --action: #245e71; --radius: 15px;
}
.ed-monument .ed-hero { display: grid; min-height: min(730px,82svh); grid-template-rows: auto minmax(320px,1fr); text-align: center; overflow: hidden; }
.ed-monument .ed-hero-frame { grid-row: 1; padding-block: clamp(30px,6vw,80px) 16px; }
.ed-monument .ed-hero-copy { margin-inline: auto; }
.ed-monument .ed-actions { justify-content: center; }
.ed-monument .ed-cover { display: block; grid-row: 2; min-height: 0; position: relative; }
.ed-monument .ed-cover img { position: absolute; inset: 0; object-position: 50% 38%; }
.ed-monument .ed-cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(var(--canvas),transparent 39%); }
.ed-monument .ed-overview { grid-template-columns: 1fr; text-align: center; background: var(--surface); border-block: 1px solid var(--line); }
.ed-monument .ed-plan { border-width: 0 1px 4px; }
.ed-monument .ed-recommended { border-bottom-color: var(--accent); }
.ed-monument .ed-downloads li { background: linear-gradient(var(--surface),var(--wash)); }

/* 23 · Berry color blocks */
.ed-muse {
    --canvas: #fff7f6; --surface: #fffdfa; --wash: #ffdee3; --line: #e9b9c4;
    --ink: #521936; --muted: #774459; --accent: #8b2150; --action: #8b2150; --radius: 32px;
}
.ed-muse .ed-hero { display: grid; grid-template: "copy art" minmax(390px,55svh) "nav art" auto / minmax(0,.83fr) minmax(0,1.17fr); gap: 16px; padding-block: 30px 0; }
.ed-muse .ed-hero-frame { grid-area: copy; width: 100%; display: grid; align-content: center; padding: clamp(20px,4vw,54px); border-radius: 42px 14px 14px 14px; background: var(--wash); }
.ed-muse .ed-cover { grid-area: art; border-radius: 14px 42px 14px 14px; }
.ed-muse :is(.ed-cover,.ed-inner-art) {
    background:
        radial-gradient(circle at 69% 26%,#fff 0 3%,#ffffff70 3.5%,transparent 13%),
        radial-gradient(circle at 64% 37%,#ffc0d9,#aa2558 23%,transparent 23.5%),
        radial-gradient(circle at 36% 66%,#ffb087,#e74371 24%,transparent 24.5%),
        radial-gradient(circle at 66% 71%,#f7a3eb,#a83f86 18%,transparent 18.5%),
        repeating-linear-gradient(135deg,#fbc7d5 0 24px,#ffcfdc 25px 48px);
}
.ed-muse .ed-hero-nav { grid-area: nav; padding: 6px 20px; background: #f8d1b5; border-radius: 14px; }
.ed-muse .ed-hero-nav a { width: 100%; }
.ed-muse .ed-plan { background: var(--surface); border-radius: 38px 13px; }
.ed-muse .ed-recommended { background: var(--wash); }
.ed-muse .ed-downloads li { border-radius: 100px; }
.ed-muse .ed-experiences { background: var(--wash); }

/* 24 · Analog radio */
.ed-tide {
    --canvas: #efe3ca; --surface: #fff1d6; --wash: #e5d4ab; --line: #aa9672;
    --ink: #422c23; --muted: #655144; --accent: #79331f; --action: #79331f; --radius: 2px; --button-radius: 4px;
    --heading: Georgia, "Songti SC", "SimSun", serif;
}
.ed-tide .ed-hero { display: grid; grid-template: "art copy" minmax(380px,55svh) "nav nav" auto / minmax(0,.9fr) minmax(0,1.1fr); border: 1px solid var(--line); margin-block: 34px 0; background: var(--surface); }
.ed-tide .ed-cover { grid-area: art; border-right: 1px solid var(--line); }
.ed-tide :is(.ed-cover,.ed-inner-art) {
    background:
        radial-gradient(circle at 48% 49%,#f9dfaf 0 9%,#a75230 9.5% 12%,transparent 12.4%),
        repeating-radial-gradient(circle at 48% 49%,#39291f 0 2px,#b56e41 3px 6px,#78472d 7px 9px);
}
.ed-tide .ed-hero-frame { grid-area: copy; width: 100%; padding: clamp(20px,6vw,76px); align-self: center; }
.ed-tide .ed-hero-nav { grid-area: nav; padding: 6px clamp(16px,4vw,54px); border-top: 1px solid var(--line); background: var(--wash); gap: 4px 28px; }
.ed-tide .ed-overview { border-block: 3px double var(--line); background: transparent; }
.ed-tide .ed-plans { grid-template-columns: 1fr; gap: 0; }
.ed-tide .ed-plan { border-width: 1px 0 0; }
.ed-tide .ed-downloads { grid-template-columns: 1fr; }
.ed-tide .ed-downloads li { background: transparent; border-width: 0 0 1px; }

/* 25 · Theater stage */
.ed-terra {
    --canvas: #24141f; --surface: #31202b; --wash: #3d2432; --line: #684859;
    --ink: #fff2da; --muted: #e3c8ca; --accent: #efca83; --action: #ecc980; --on-action: #37251e; --radius: 5px; --button-radius: 2px;
    --heading: Georgia, "Songti SC", "SimSun", serif;
}
.ed-terra .ed-hero { display: grid; grid-template-rows: minmax(330px,50svh) auto auto; text-align: center; isolation: isolate; background: #1c121a; padding-bottom: 22px; }
.ed-terra .ed-cover { grid-row: 1; position: relative; }
.ed-terra .ed-cover img { position: absolute; inset: 0; object-fit: contain; background: #10100b; }
.ed-terra .ed-cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 69%,#1c121a); }
.ed-terra .ed-hero-frame { grid-row: 2; }
.ed-terra .ed-hero-copy { margin-inline: auto; }
.ed-terra .ed-actions { justify-content: center; }
.ed-terra .ed-hero-nav { justify-content: center; margin-top: 14px; }
.ed-terra .ed-overview { border: 3px double var(--line); background: transparent; }
.ed-terra .ed-plan { border-top: 3px double var(--line); border-bottom: 3px double var(--line); }
.ed-terra .ed-recommended { border-block-color: var(--accent); }
.ed-terra .ed-inner-cover > img { object-position: 50% 57%; }

/* 26 · Optical studies */
.ed-frame {
    --canvas: #f2f2fb; --surface: #fbfbff; --wash: #e9e5f9; --line: #cdc6df;
    --ink: #252244; --muted: #555374; --accent: #4b388a; --action: #4b388a; --radius: 9px; --button-radius: 8px;
}
.ed-frame .ed-hero { display: grid; grid-template: "art copy" minmax(480px,63svh) "art nav" auto / minmax(0,1.25fr) minmax(0,.75fr); gap: 0 clamp(20px,3vw,36px); padding-top: 30px; }
.ed-frame .ed-cover { grid-area: art; border-radius: var(--radius); }
.ed-frame :is(.ed-cover,.ed-inner-art) {
    background:
        conic-gradient(from 210deg at 54% 53%, #b3e8fb 0 13%, #daecf7 16%, #b0a4ea 28%, #ebc0e6 36%, #ffedf7 40%, #683da3 49%, #b1bbf0 61%, #eee7ff 75%, #9ed8ff 85%, #b3e8fb 100%);
    box-shadow: inset 0 0 80px #1f115033;
}
.ed-frame .ed-hero-frame { grid-area: copy; width: 100%; align-self: center; }
.ed-frame .ed-hero-nav { grid-area: nav; display: grid; gap: 0; border-block: 1px solid var(--line); }
.ed-frame .ed-hero-nav a + a { border-top: 1px solid var(--line); }
.ed-frame .ed-overview { border-radius: 0; background: transparent; padding-inline: 0; border-top: 3px solid var(--accent); }
.ed-frame .ed-plan .ed-measure { display: grid; grid-template-columns: 1fr 1fr; }
.ed-frame .ed-downloads li { border-color: transparent; background: var(--wash); }

/* 27 · Pinball grid */
.ed-signal {
    --canvas: #1d1430; --surface: #291c42; --wash: #3c2451; --line: #684b7d;
    --ink: #fff3fb; --muted: #e3cbe9; --accent: #ffacde; --action: #ffacde; --on-action: #34203e; --radius: 16px;
}
.ed-signal .ed-hero { display: grid; grid-template-rows: minmax(430px,63svh) auto; padding-block: 32px 0; gap: 12px; }
.ed-signal .ed-cover { grid-area: 1 / 1; border-radius: 36px; z-index: -1; }
.ed-signal :is(.ed-cover,.ed-inner-art) {
    background:
        radial-gradient(circle at 72% 47%,#fff6 0 3%,transparent 4%),
        radial-gradient(circle at 78% 56%,#ffc8e5 4%,#b03497 4.5% 12%,transparent 12.5%),
        radial-gradient(circle at 88% 27%,#ffd09d 0 4%,#bd4685 4.5% 7%,transparent 7.5%),
        radial-gradient(circle at 60% 31%,#d7e3ff 0 4%,#5e52aa 4.5% 9%,transparent 9.5%),
        repeating-linear-gradient(150deg,transparent 0 46px,#d386f334 48px 52px,transparent 54px 96px),
        linear-gradient(105deg,#251837 35%,#522960);
}
.ed-signal .ed-hero-frame { grid-area: 1 / 1; width: 100%; align-self: center; padding: clamp(23px,5vw,64px); }
.ed-signal .ed-hero-copy { width: min(100%,510px); padding: 22px; background: #291a3cdb; border-radius: 28px; border: 1px solid var(--line); }
.ed-signal .ed-hero-nav { grid-row: 2; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.ed-signal .ed-hero-nav a { padding: 8px 13px; background: var(--wash); border-radius: var(--radius); }
.ed-signal .ed-overview { background: transparent; border: 1px solid var(--line); }
.ed-signal .ed-recommended { outline: 1px solid var(--accent); outline-offset: -5px; }
.ed-signal .ed-downloads li { grid-template-columns: auto minmax(0,1fr); }
.ed-signal .ed-downloads a { grid-column: 2; }

/* 28 · Floating island */
.ed-loft {
    --canvas: #f4f3ff; --surface: #fff; --wash: #e8e5fb; --line: #d4cceb;
    --ink: #352855; --muted: #5a5272; --accent: #5d438d; --action: #5d438d; --radius: 27px;
}
.ed-loft .ed-hero { display: grid; min-height: min(735px,84svh); align-items: center; padding-block: 40px; background: #dde6f8; }
.ed-loft .ed-cover { position: absolute; inset: 0; z-index: -1; }
.ed-loft .ed-cover img { object-position: 67% 53%; }
.ed-loft .ed-cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,#e9e8f8 0%,#e9e8f8ad 34%,transparent 66%); }
.ed-loft .ed-hero-copy { max-width: 455px; padding: clamp(20px,4vw,46px); background: #fbf9ffe8; border-radius: 38px; box-shadow: 0 10px 32px #34306b29; }
.ed-loft .ed-overview { border-radius: 42px; }
.ed-loft .ed-downloads li { background: transparent; border-color: transparent; }
.ed-loft .ed-service { background: var(--wash); padding: clamp(20px,4vw,46px); border-radius: var(--radius); }
.ed-loft .ed-inner-cover { border-radius: 42px; }

/* 29 · Desert observatory */
.ed-canvas {
    --canvas: #f9ede5; --surface: #fff5ef; --wash: #f3dcd7; --line: #d8b9b6;
    --ink: #542d48; --muted: #6c495f; --accent: #7d3c63; --action: #7d3c63; --radius: 15px;
    --heading: Georgia, "Songti SC", "SimSun", serif;
}
.ed-canvas .ed-hero { display: grid; grid-template: "copy nav" auto "art art" clamp(310px,50vw,560px) / minmax(0,1fr) minmax(150px,.35fr); column-gap: 28px; padding-top: clamp(26px,5vw,60px); }
.ed-canvas .ed-hero-frame { grid-area: copy; width: 100%; padding-bottom: 24px; }
.ed-canvas .ed-hero-nav { grid-area: nav; align-content: center; flex-flow: column nowrap; gap: 0; padding-bottom: 22px; }
.ed-canvas .ed-hero-nav a + a { border-top: 1px solid var(--line); }
.ed-canvas .ed-cover { grid-area: art; border-radius: 3px; }
.ed-canvas .ed-cover img { object-position: 58% 44%; }
.ed-canvas .ed-overview { grid-template-columns: 1fr; background: var(--surface); border-left: 3px solid var(--accent); }
.ed-canvas .ed-plan { border-width: 0 0 2px; background: transparent; }
.ed-canvas .ed-recommended { border-bottom-color: var(--accent); background: var(--wash); }
.ed-canvas .ed-inner-cover { border-block: 1px solid var(--line); }

/* 30 · Deep sea */
.ed-voyage {
    --canvas: #09242c; --surface: #10343a; --wash: #143c43; --line: #426973;
    --ink: #e9fff9; --muted: #bcdad6; --accent: #a3ebcf; --action: #a3ebcf; --on-action: #0b3236; --radius: 7px; --button-radius: 4px;
}
.ed-voyage .ed-hero { display: grid; align-items: center; min-height: min(760px,86svh); text-align: center; padding-block: min(6vh,54px) min(20vh,180px); }
.ed-voyage :is(.ed-cover,.ed-inner-art) {
    background:
        radial-gradient(ellipse at 50% -16%,#7dd7c7 0%,#348b8c79 23%,transparent 56%),
        repeating-radial-gradient(ellipse at 50% 0%,#92f8e31f 0 2px,transparent 3px 50px),
        linear-gradient(#276c75,#0b313d 47%,#061b2a 82%);
}
.ed-voyage .ed-cover { position: absolute; inset: 0; z-index: -1; }
.ed-voyage .ed-hero-copy { margin-inline: auto; }
.ed-voyage .ed-actions { justify-content: center; }
.ed-voyage .ed-hero-nav { position: absolute; inset: auto var(--gutter) 6%; justify-content: center; }
.ed-voyage .ed-hero-nav a { padding: 3px 16px; border: 1px solid var(--line); background: var(--surface); }
.ed-voyage .ed-overview { border: 1px solid var(--line); }
.ed-voyage .ed-plans { border-block: 1px solid var(--line); padding-block: 8px; }
.ed-voyage .ed-plan { border-width: 0 0 0 2px; }
.ed-voyage .ed-recommended { border-left-color: var(--accent); }
.ed-voyage .ed-downloads li { background: var(--wash); }

:is(.ed-muse,.ed-tide,.ed-frame,.ed-signal,.ed-canvas) .ed-hero { width: min(var(--max),calc(100% - var(--gutter) * 2)); margin-inline: auto; }
.ed-inner-cover > .ed-inner-art { grid-area: 1 / 2; position: relative; align-self: stretch; min-width: 0; padding: 0; }
.ed-inner-cover > .ed-inner-art + div { grid-area: 1 / 1; }

@media (min-width: 860px) {
    .ed-tide .ed-plan { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.6fr) minmax(0,1.4fr); align-items: baseline; }
    .ed-tide .ed-plan .ed-measure { grid-column: 3; grid-row: 1 / span 2; grid-template-columns: 1fr 1fr; padding: 0; border: 0; }
    .ed-tide .ed-plan > .ed-button { grid-column: 2; justify-self: start; }
}
@media (max-width: 720px) {
    .ed-aurora .ed-hero { grid-template-columns: 1fr; align-content: end; min-height: 72svh; padding-top: 200px; gap: 22px; }
    .ed-aurora .ed-hero-nav { grid-template-columns: 1fr 1fr; gap: 14px; }
    .ed-monument .ed-hero { grid-template-rows: auto minmax(230px,42svh); min-height: auto; }
    .ed-muse .ed-hero { grid-template: "art" clamp(210px,62vw,330px) "copy" auto "nav" auto / minmax(0,1fr); gap: 10px; padding-top: 20px; }
    .ed-muse .ed-cover { border-radius: 26px 26px 12px 12px; }
    .ed-muse .ed-hero-frame { border-radius: 12px; }
    .ed-tide .ed-hero { grid-template: "art" clamp(170px,48vw,270px) "copy" auto "nav" auto / 1fr; }
    .ed-tide .ed-cover { border-right: 0; }
    .ed-terra .ed-hero { grid-template-rows: minmax(220px,39svh) auto auto; }
    .ed-frame .ed-hero { grid-template: "art" clamp(230px,68vw,370px) "copy" auto "nav" auto / minmax(0,1fr); gap: 18px; }
    .ed-signal .ed-hero { grid-template-rows: minmax(420px,66svh) auto; }
    .ed-signal .ed-hero-frame { align-self: end; }
    .ed-signal .ed-hero-nav { grid-template-columns: 1fr; }
    .ed-loft .ed-hero { min-height: 68svh; align-items: end; padding-block: 225px 26px; }
    .ed-loft .ed-cover img { object-position: 63% center; }
    .ed-loft .ed-cover::after { background: linear-gradient(0deg,#dadff4,transparent 60%); }
    .ed-canvas .ed-hero { grid-template: "copy" auto "art" clamp(210px,64vw,370px) "nav" auto / minmax(0,1fr); }
    .ed-canvas .ed-hero-nav { padding: 5px 0 0; }
    .ed-voyage .ed-hero { min-height: 65svh; padding-block: 48px 182px; }
    .ed-voyage .ed-hero-nav { justify-content: stretch; display: grid; grid-template-columns: 1fr; }
}
@media (max-width: 360px) {
    .ed-tide .ed-hero, .ed-frame .ed-hero, .ed-muse .ed-hero { grid-template-rows:clamp(150px,27svh,205px) auto auto; }
    .ed-loft .ed-hero { padding-block-start:165px; }
}
