/* Aeterna · Magna Roma — base negro y oro + carmesí imperial + cian contenido (solo líneas) */
.ae {
  --crimson: #8f1d2c;
  --crimson-hi: #c43a4b;
  --crimson-lo: #4a0b14;
  --crimson-ink: #f2a5ad;
  --cyan: #5fd4e6;
  --f-roman: "Cinzel", "Trajan Pro", "Spectral SC", serif;
  position: relative; background: #050306; overflow: clip;
}
.ae-kick { font-family: var(--f-roman); font-weight: 600; font-size: .82rem; letter-spacing: .32em; text-transform: uppercase; color: var(--gold-leaf); margin: 0 0 .9rem; }
.ae-h2 { font-family: var(--f-roman); font-weight: 600; font-size: clamp(2rem, 1.2rem + 3.6vw, 4.4rem); letter-spacing: .06em; line-height: 1.05; color: var(--ink); text-transform: uppercase; }
.ae-h2 i { font-style: normal; color: var(--crimson-hi); }
.ae-sub { font-family: var(--f-roman); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-hi); font-size: clamp(.95rem, .85rem + .4vw, 1.2rem); margin: .8rem 0 0; }
.ae-lede { color: var(--ink-2); max-width: 62ch; margin: 1.3rem auto 0; font-size: 1.08rem; }
.ae-head { text-align: center; max-width: 900px; margin: 0 auto clamp(2.6rem, 6vw, 4.4rem); }
.ae-head--row { display: flex; align-items: end; justify-content: space-between; gap: 1rem 3rem; flex-wrap: wrap; text-align: left; max-width: none; margin-bottom: 2rem; }
.ae-sec { padding-block: clamp(4.5rem, 10vw, 8.5rem); position: relative; }

/* botones romanos */
.ae-btn { display: inline-flex; align-items: center; gap: .6em; min-height: 50px; padding: .7em 1.5em; font-family: var(--f-roman); font-weight: 600; font-size: .92rem; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; color: #fff4ea; background: linear-gradient(180deg, #a5283a, var(--crimson) 60%, #6e1421); border: 1px solid #d6b26a; box-shadow: inset 0 0 0 3px rgba(5,3,6,.35), inset 0 0 0 4px rgba(214,178,106,.45), 0 10px 30px -10px rgba(143,29,44,.7); position: relative; overflow: hidden; isolation: isolate; transition: transform .3s var(--ease-out), box-shadow .3s; }
.ae-btn::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(115deg, transparent 35%, rgba(255,230,190,.35) 50%, transparent 65%); transform: translateX(-120%); transition: transform 1s var(--ease-out); }
.ae-btn:hover { color: #fff; transform: translateY(-2px); text-decoration: none; }
.ae-btn:hover::after { transform: translateX(120%); }
.ae-btn--ghost { background: rgba(5,3,6,.55); color: var(--gold-hi); box-shadow: none; backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.ae-btn--ghost:hover { color: #fff4ea; background: rgba(143,29,44,.55); }
.ae-btn .icon { width: 1.1em; height: 1.1em; }

/* ───── hero ───── */
.ae-hero { position: relative; min-height: calc(100svh - 67px); display: grid; isolation: isolate; overflow: hidden; }
.ae-hero__img { position: absolute; inset: 0; z-index: -2; }
.ae-hero__img img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; transform-origin: 50% 70%; animation: aeZoom 30s var(--ease-out) both; }
@keyframes aeZoom { from { transform: scale(1.12); filter: brightness(.45) saturate(.8); } 40% { filter: brightness(1) saturate(1); } to { transform: scale(1); } }
.ae-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background:
  linear-gradient(180deg, rgba(5,3,6,.72) 0%, rgba(5,3,6,.2) 26%, transparent 42%, rgba(5,3,6,.25) 58%, rgba(5,3,6,.9) 84%, #050306 100%),
  radial-gradient(60% 40% at 50% 18%, rgba(5,3,6,.35), transparent 70%); }
.ae-hero__in { display: flex; flex-direction: column; align-items: center; text-align: center; padding: clamp(2.2rem, 7vh, 5rem) var(--gutter) clamp(4.5rem, 9vh, 6rem); }
.ae-hero .ae-kick { animation: aeFade 1.4s var(--ease-out) .2s both; text-shadow: 0 2px 12px rgba(0,0,0,.8); }
.ae-title { margin: 0; line-height: .9; }
.ae-title__w { display: block; font-family: var(--f-roman); font-weight: 700; font-size: clamp(3.4rem, 1rem + 12vw, 12.5rem); letter-spacing: .12em; margin-right: -.12em; color: transparent;
  background: linear-gradient(180deg, #fff6dc 0%, #f0d695 38%, #d6b26a 62%, #8a6a2c 100%); -webkit-background-clip: text; background-clip: text;
  filter: drop-shadow(0 2px 0 rgba(60,40,10,.9)) drop-shadow(0 18px 40px rgba(0,0,0,.65));
  animation: aeRise 1.8s var(--ease-out) .35s both; }
@keyframes aeRise { from { opacity: 0; letter-spacing: .5em; filter: blur(14px); } to { opacity: 1; } }
@keyframes aeFade { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.ae-world { font-family: var(--f-roman); letter-spacing: .26em; text-transform: uppercase; font-size: clamp(.72rem, .66rem + .3vw, .95rem); color: #f6ead0; margin: 1.1rem 0 0; text-shadow: 0 2px 10px rgba(0,0,0,.9); animation: aeFade 1.4s var(--ease-out) 1.1s both; display: flex; align-items: center; gap: .7em; }
.ae-world::before, .ae-world::after { content: ""; width: clamp(24px, 6vw, 80px); height: 1px; background: linear-gradient(90deg, transparent, var(--cyan)); opacity: .8; }
.ae-world::after { transform: scaleX(-1); }
.ae-hero__low { margin-top: auto; display: flex; flex-direction: column; align-items: center; max-width: 760px; animation: aeFade 1.4s var(--ease-out) 1.5s both; }
.ae-motto { font-family: var(--f-roman); font-weight: 600; text-transform: uppercase; letter-spacing: .1em; font-size: clamp(1.05rem, .8rem + 1.2vw, 1.75rem); line-height: 1.35; color: #fff4dc; margin: 0; text-shadow: 0 2px 16px rgba(0,0,0,.9); }
.ae-oath { margin: 1rem 0 0; max-width: 54ch; }
.ae-oath p { margin: 0; font-style: italic; font-weight: 300; font-size: clamp(1rem, .95rem + .3vw, 1.18rem); color: #ecdfc5; text-shadow: 0 1px 10px rgba(0,0,0,.95); }
.ae-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: .8rem; margin-top: 1.7rem; }
.ae-scroll { position: absolute; left: 50%; bottom: 18px; width: 26px; height: 42px; margin-left: -13px; border: 1px solid rgba(214,178,106,.6); border-radius: 14px; }
.ae-scroll span { position: absolute; left: 50%; top: 8px; width: 2px; height: 8px; margin-left: -1px; background: var(--gold-hi); border-radius: 2px; animation: aeWheel 2s ease-in-out infinite; }
@keyframes aeWheel { 0% { opacity: 0; transform: translateY(0); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(14px); } }
@media (max-width: 760px) {
  .ae-hero { min-height: calc(100svh - 67px); }
  .ae-hero__img img { object-position: 50% 50%; }
  .ae-hero::before { background: linear-gradient(180deg, rgba(5,3,6,.7) 0%, rgba(5,3,6,.15) 22%, transparent 36%, rgba(5,3,6,.35) 52%, rgba(5,3,6,.92) 74%, #050306 100%); }
  .ae-title__w { letter-spacing: .08em; margin-right: -.08em; }
  .ae-hero__in { padding-bottom: 4.2rem; }
  .ae-oath p { font-size: .98rem; }
  .ae-cta { flex-direction: column; align-items: stretch; width: 100%; max-width: 340px; }
  .ae-cta .ae-btn { justify-content: center; }
  .ae-scroll { display: none; }
}

/* ───── el triángulo ───── */
.ae-legio { background: radial-gradient(70% 50% at 50% 0%, rgba(143,29,44,.22), transparent 70%), #050306; }
.ae-legio::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--cyan) 30%, var(--cyan) 70%, transparent); opacity: .35; }
.ae-trio { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.2rem, 3vw, 3rem); align-items: start; }
.ae-trio__lines { position: absolute; left: 0; right: 0; top: -3.2rem; height: 3rem; width: 100%; overflow: visible; pointer-events: none; }
.ae-trio__lines path { fill: none; stroke: var(--cyan); stroke-width: 1; vector-effect: non-scaling-stroke; opacity: .45; stroke-dasharray: 3 5; }
.ae-card--marco { margin-top: -2.4rem; }
.ae-card__btn { display: flex; flex-direction: column; align-items: center; text-align: center; width: 100%; background: none; border: 0; padding: 0; color: inherit; }
.ae-card__arch { display: block; width: 100%; aspect-ratio: 4 / 5; border-radius: 999px 999px 4px 4px; overflow: hidden; border: 1px solid var(--gold-leaf); box-shadow: 0 0 0 5px #050306, 0 0 0 6px rgba(143,29,44,.9), 0 40px 70px -30px rgba(143,29,44,.55), 0 30px 50px -20px #000; background: #0d0a0e; }
.ae-card__arch img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 8%; transition: transform 1.2s var(--ease-out); }
.ae-card__btn:hover .ae-card__arch img, .ae-card__btn:focus-visible .ae-card__arch img { transform: scale(1.05); }
.ae-card--marco .ae-card__arch { box-shadow: 0 0 0 5px #050306, 0 0 0 6px var(--gold-hi), 0 0 0 10px #050306, 0 0 0 11px rgba(143,29,44,.9), 0 50px 80px -30px rgba(143,29,44,.7), 0 30px 50px -20px #000; }
.ae-card__fac { margin-top: 1.5rem; font-family: var(--f-roman); font-size: .74rem; letter-spacing: .22em; text-transform: uppercase; color: var(--crimson-ink); }
.ae-card__name { margin-top: .45rem; font-family: var(--f-roman); font-weight: 600; font-size: clamp(1.4rem, 1rem + 1.2vw, 2.1rem); letter-spacing: .04em; line-height: 1.1; color: var(--ink); }
.ae-card__btn:hover .ae-card__name { color: var(--gold-hi); }
.ae-card__role { margin-top: .35rem; font-family: var(--f-sc); letter-spacing: .06em; font-size: .9rem; color: var(--ink-3); }
.ae-card__q { margin-top: 1rem; font-family: var(--f-display); font-size: clamp(1.1rem, 1rem + .4vw, 1.32rem); line-height: 1.3; color: var(--gold-hi); max-width: 28ch; }
.ae-card__line { margin-top: .8rem; font-size: .96rem; line-height: 1.55; color: var(--ink-2); max-width: 36ch; }
.ae-trio.is-pre .ae-card { opacity: 0; transform: translateY(40px); }
.ae-trio.is-in .ae-card { transition: opacity 1.2s var(--ease-out), transform 1.2s var(--ease-out); transition-delay: calc(var(--k) * 140ms); }
.ae-narr { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(1.4rem, 4vw, 3rem); align-items: center; max-width: 920px; margin: clamp(3.5rem, 8vw, 6rem) auto 0; padding: clamp(1.4rem, 3vw, 2.4rem); border: 1px solid rgba(214,178,106,.28); background: linear-gradient(120deg, rgba(143,29,44,.16), transparent 60%), #08050a; position: relative; }
.ae-narr::before { content: ""; position: absolute; left: -1px; top: -1px; width: 60px; height: 1px; background: var(--cyan); opacity: .7; }
.ae-narr__face { width: clamp(110px, 18vw, 170px); aspect-ratio: 4 / 5; border-radius: 50%; overflow: hidden; border: 1px solid var(--gold-hi); box-shadow: 0 0 0 4px #08050a, 0 0 0 5px rgba(143,29,44,.9); padding: 0; background: #0d0a0e; }
.ae-narr__face img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 10%; }
.ae-narr h3 { font-family: var(--f-roman); font-weight: 600; font-size: clamp(1.5rem, 1.1rem + 1.2vw, 2.1rem); letter-spacing: .04em; color: var(--ink); }
.ae-narr h3 small { display: block; font-family: var(--f-sc); font-weight: 400; letter-spacing: .06em; font-size: .9rem; color: var(--ink-3); margin-top: .35rem; }
.ae-narr .ae-kick { margin-bottom: .5rem; }
.ae-narr__epi { font-family: var(--f-display); font-size: clamp(1.15rem, 1rem + .6vw, 1.5rem); line-height: 1.3; color: var(--crimson-ink); margin: 1rem 0 .7rem; }
.ae-narr__q { font-style: italic; color: var(--ink-2); margin-bottom: 1.3rem; }
@media (max-width: 860px) {
  .ae-trio { grid-template-columns: 1fr; gap: 3.4rem; max-width: 420px; margin-inline: auto; }
  .ae-trio__lines { display: none; }
  .ae-card--marco { margin-top: 0; order: -1; }
  .ae-narr { grid-template-columns: 1fr; justify-items: center; text-align: center; }
}

/* ───── Roma contra Grecia ───── */
.ae-war { background: linear-gradient(180deg, #050306, #07060c 50%, #050306); }
.ae-duel { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: clamp(1rem, 3vw, 3rem); align-items: stretch; }
.ae-side { padding: clamp(1.4rem, 3vw, 2.6rem); border: 1px solid rgba(214,178,106,.22); display: flex; flex-direction: column; align-items: center; text-align: center; position: relative; }
.ae-side--roma { background: radial-gradient(90% 60% at 50% 0%, rgba(143,29,44,.32), transparent 70%), #0a0508; border-color: rgba(196,58,75,.45); }
.ae-side--hellas { background: radial-gradient(90% 60% at 50% 0%, rgba(95,212,230,.08), rgba(214,178,106,.06) 40%, transparent 70%), #07080b; }
.ae-side__cov { width: clamp(120px, 14vw, 170px); padding: 0; border: 0; background: none; box-shadow: 0 24px 40px -16px #000; }
.ae-side__cov img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; }
.ae-side__num { margin: 1.4rem 0 .2rem; font-family: var(--f-roman); font-size: .76rem; letter-spacing: .24em; text-transform: uppercase; color: var(--gold-leaf); }
.ae-side__t { font-family: var(--f-roman); font-weight: 700; font-size: clamp(1.8rem, 1.2rem + 2vw, 3rem); letter-spacing: .08em; text-transform: uppercase; color: var(--ink); }
.ae-side__w { font-family: var(--f-sc); letter-spacing: .06em; font-size: .92rem; color: var(--ink-3); margin: .4rem 0 0; }
.ae-side__tag { font-family: var(--f-display); font-size: clamp(1.3rem, 1rem + 1vw, 1.8rem); margin: 1rem 0; }
.ae-side--roma .ae-side__tag { color: var(--crimson-ink); }
.ae-side--hellas .ae-side__tag { color: var(--gold-hi); }
.ae-side__poem { font-style: italic; font-weight: 300; line-height: 1.6; color: #e9dfc8; margin: 0 0 1.2rem; }
.ae-side__txt { color: var(--ink-2); font-size: .98rem; max-width: 46ch; }
.ae-side__motto { margin: auto 0 0; padding-top: 1.2rem; border-top: 1px solid rgba(214,178,106,.2); font-family: var(--f-roman); font-weight: 600; letter-spacing: .06em; font-size: .95rem; text-transform: uppercase; color: var(--gold-hi); width: 100%; }
.ae-vs { align-self: center; position: relative; width: clamp(64px, 7vw, 96px); aspect-ratio: 1; display: grid; place-items: center; }
.ae-vs svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.ae-vs polygon { fill: none; stroke: var(--cyan); stroke-width: 1.2; opacity: .7; }
.ae-vs polygon + polygon { stroke: var(--gold-leaf); opacity: .9; }
.ae-vs span { font-family: var(--f-roman); font-weight: 700; letter-spacing: .1em; color: var(--gold-hi); font-size: 1.05rem; }
.ae-layers { max-width: 1000px; margin: clamp(3rem, 7vw, 5rem) auto 0; }
.ae-layers__intro { text-align: center; color: var(--ink-2); max-width: 64ch; margin: 0 auto 1.8rem; }
.ae-layers ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid rgba(196,58,75,.5); border-bottom: 1px solid rgba(196,58,75,.5); }
.ae-layers li { padding: 1.3rem 1.1rem; display: grid; gap: .3rem; align-content: start; }
.ae-layers li + li { border-left: 1px solid rgba(214,178,106,.18); }
.ae-layers .n { font-family: var(--f-roman); color: var(--crimson-ink); letter-spacing: .14em; font-size: .85rem; }
.ae-layers b { font-family: var(--f-roman); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-hi); font-size: 1.1rem; }
.ae-layers li span:last-child { color: var(--ink-2); font-size: .95rem; line-height: 1.5; }
.ae-conflict { max-width: 1000px; margin: clamp(3rem, 7vw, 5rem) auto 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1.6rem 3rem; text-align: center; }
.ae-conflict figure { margin: 0; }
.ae-conflict blockquote { margin: 0; font-family: var(--f-display); font-size: clamp(1.25rem, 1rem + .9vw, 1.75rem); line-height: 1.3; color: var(--ink); }
.ae-conflict figcaption { margin-top: .7rem; font-family: var(--f-roman); letter-spacing: .24em; text-transform: uppercase; font-size: .8rem; color: var(--crimson-ink); }
.ae-conflict__q { grid-column: 1 / -1; margin: 1.4rem auto 0; max-width: 30ch; font-family: var(--f-roman); font-weight: 600; letter-spacing: .04em; font-size: clamp(1.3rem, 1rem + 1.4vw, 2.2rem); line-height: 1.3; color: var(--gold-hi); }
.ae-conflict__nexus { grid-column: 1 / -1; margin: 0 auto; max-width: 60ch; color: var(--ink-3); font-style: italic; }
@media (max-width: 860px) {
  .ae-duel { grid-template-columns: 1fr; }
  .ae-vs { justify-self: center; margin: -.4rem 0; }
  .ae-layers ol { grid-template-columns: 1fr 1fr; }
  .ae-layers li:nth-child(3) { border-left: 0; }
  .ae-layers li:nth-child(n+3) { border-top: 1px solid rgba(214,178,106,.18); }
  .ae-conflict { grid-template-columns: 1fr; }
}
@media (max-width: 420px) { .ae-layers ol { grid-template-columns: 1fr; } .ae-layers li + li { border-left: 0; border-top: 1px solid rgba(214,178,106,.18); } }

/* ───── galería ───── */
.ae-gal { padding-bottom: clamp(3rem, 6vw, 5rem); }
.ae-gal__note { color: var(--ink-3); font-style: italic; max-width: 40ch; margin: 0; }
.ae-strip { display: flex; gap: clamp(10px, 1.4vw, 18px); overflow-x: auto; scroll-snap-type: x mandatory; padding: 6px max(var(--gutter), calc((100vw - 1280px) / 2 + var(--gutter))) 26px; scrollbar-width: thin; scrollbar-color: var(--crimson) transparent; scroll-padding-inline: var(--gutter); }
.ae-strip:focus-visible { outline: 2px solid var(--gold-hi); outline-offset: -2px; }
.ae-ph { flex: none; margin: 0; width: clamp(180px, 22vw, 290px); aspect-ratio: 9 / 16; scroll-snap-align: start; border: 1px solid rgba(214,178,106,.28); background: #0d0a0e; }
.ae-ph:nth-child(3n+2) { margin-top: 28px; }
.ae-ph img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 760px) { .ae-ph { width: 62vw; } .ae-ph:nth-child(3n+2) { margin-top: 0; } }

/* ───── síguela ───── */
.ae-follow { background: radial-gradient(60% 70% at 15% 30%, rgba(143,29,44,.25), transparent 70%), #050306; border-top: 1px solid rgba(214,178,106,.14); }
.ae-follow__in { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(2.4rem, 6vw, 6rem); align-items: center; }
.ae-follow__q { margin: 1.4rem 0 0; }
.ae-follow__q p { font-family: var(--f-display); font-size: clamp(1.25rem, 1rem + .9vw, 1.7rem); line-height: 1.35; color: var(--ink); margin: 0; }
.ae-follow__q cite { display: block; margin-top: .8rem; font-style: normal; font-family: var(--f-sc); letter-spacing: .08em; color: var(--gold-leaf); }
.ae-net { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.8rem; }
.ae-net a { display: inline-flex; align-items: center; gap: .6rem; min-height: 50px; padding: .6rem 1.3rem; border: 1px solid rgba(196,58,75,.7); color: var(--ink); text-decoration: none; font-family: var(--f-roman); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; font-size: .85rem; background: rgba(143,29,44,.14); transition: background-color .3s, border-color .3s, color .3s; }
.ae-net a:hover { background: var(--crimson); border-color: var(--gold-leaf); color: #fff; }
.ae-net .icon { width: 1.2em; height: 1.2em; }
.ae-libri { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(214,178,106,.3); }
.ae-libri li { border-bottom: 1px solid rgba(214,178,106,.16); }
.ae-libri a { display: grid; grid-template-columns: 5.4rem minmax(0, 1fr) auto; align-items: baseline; gap: .8rem; padding: .95rem .4rem; text-decoration: none; color: var(--ink); transition: background-color .3s; }
.ae-libri a:hover { background: linear-gradient(90deg, rgba(143,29,44,.3), transparent); }
.ae-libri span { font-family: var(--f-roman); letter-spacing: .14em; font-size: .78rem; color: var(--crimson-ink); }
.ae-libri b { font-family: var(--f-roman); font-weight: 600; letter-spacing: .04em; font-size: 1.08rem; }
.ae-libri em { font-style: normal; font-family: var(--f-sc); letter-spacing: .05em; font-size: .82rem; color: var(--ink-3); white-space: nowrap; }
.ae-libri li:first-child em { color: var(--gold-hi); }
@media (max-width: 860px) { .ae-follow__in { grid-template-columns: 1fr; } }
@media (max-width: 420px) { .ae-libri a { grid-template-columns: 4.6rem minmax(0, 1fr); } .ae-libri em { grid-column: 2; } }

/* ───── la noche cae sobre Roma ───── */
.nightfall { position: relative; isolation: isolate; overflow: hidden; text-align: center; padding: clamp(8rem, 18vw, 14rem) 0 clamp(6rem, 12vw, 9rem);
  background: linear-gradient(180deg, #050306 0%, #2a0d16 14%, #6b2a24 27%, #3a1834 42%, #1b1236 58%, #0b0818 76%, #030207 100%); }
.nightfall::before { content: ""; position: absolute; left: 50%; top: 22%; width: 80vmax; height: 80vmax; transform: translateX(-50%); border-radius: 50%; z-index: -1; background: radial-gradient(closest-side, rgba(240,180,110,.18), rgba(143,29,44,.08) 45%, transparent 70%); }
.nightfall::after { content: ""; position: absolute; left: 0; right: 0; top: 14%; height: 1px; z-index: -1; background: linear-gradient(90deg, transparent, rgba(95,212,230,.4), transparent); }
.nightfall__stars { position: absolute; inset: 35% 0 0; width: 100%; height: 65%; z-index: -1; }
.nightfall__bridge { font-family: var(--f-display); font-size: clamp(1.4rem, 1rem + 1.6vw, 2.4rem); line-height: 1.3; color: #f6e6c8; margin: 0 auto 3rem; max-width: 30ch; text-shadow: 0 2px 20px rgba(0,0,0,.6); }
.nightfall__mark { width: 64px; margin: 0 auto 1.2rem; filter: drop-shadow(0 4px 18px rgba(214,178,106,.4)); }
.nightfall__title { font-family: var(--f-display); font-size: clamp(3.6rem, 1.4rem + 8vw, 8.5rem); line-height: .9; color: var(--gold-hi); text-shadow: 0 2px 0 #6b531f, 0 20px 60px rgba(0,0,0,.8); }
.nightfall__sub { font-family: var(--f-sc); letter-spacing: .14em; color: var(--gold-leaf); font-size: clamp(.95rem, .85rem + .4vw, 1.25rem); margin: 1rem 0 .4rem; }
.nightfall__by { color: var(--ink-3); font-style: italic; margin: 0; }

@media (prefers-reduced-motion: reduce) {
  .ae-hero__img img, .ae-title__w, .ae-world, .ae-hero__low, .ae-hero .ae-kick, .ae-scroll span { animation: none; }
  .ae-trio.is-pre .ae-card { opacity: 1; transform: none; }
}
@media (max-width: 560px) {
  .ae-world { flex-direction: column; gap: .2rem; letter-spacing: .2em; font-size: .74rem; }
  .ae-world::before, .ae-world::after { display: none; }
  .ae-world span { display: none; }
  .ae-hero .ae-kick { letter-spacing: .24em; font-size: .72rem; }
  .ae-motto { font-size: 1.02rem; }
  .ae-oath { margin-top: .7rem; }
  .ae-oath p { font-size: .92rem; line-height: 1.5; }
  .ae-cta { margin-top: 1.2rem; gap: .6rem; }
  .ae-btn { min-height: 48px; font-size: .84rem; }
}
.ae-side__cov img { height: auto; }
.ae-gal { padding-top: clamp(2rem, 5vw, 4rem); }
/* Casio: la imagen ya viene recortada sin la franja de DNI (casio-v2), no hace falta ampliar */


/* ═════ Fase 2: hero con los tres protagonistas ═════ */
.ae-hero { display: block; min-height: 0; background: #050306; }
.ae-hero::before { display: none; }
.ae-stage { position: relative; height: calc(100svh - 67px); min-height: 520px; max-height: 1100px; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; }
.ae-stage .ae-hero__img { position: absolute; inset: 0; z-index: -2; }
.ae-stage .ae-hero__img img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 12%; transform-origin: 50% 30%; animation: aeZoom2 24s var(--ease-out) both; }
@keyframes aeZoom2 { from { transform: scale(1.08); filter: brightness(.5) saturate(.85); } 35% { filter: none; } to { transform: scale(1); } }
.ae-stage::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background:
  linear-gradient(180deg, rgba(5,3,6,.55) 0%, rgba(5,3,6,0) 14%, rgba(5,3,6,0) 52%, rgba(5,3,6,.7) 72%, rgba(5,3,6,.94) 88%, #050306 100%); }
.ae-stage__title { text-align: center; padding: 0 var(--gutter) clamp(1.6rem, 4vh, 2.8rem); display: flex; flex-direction: column; align-items: center; }
.ae-hello { margin: 0 0 .2rem; font-family: var(--f-roman); font-weight: 600; text-transform: uppercase; letter-spacing: .2em; margin-right: -.2em; font-size: clamp(1.15rem, .8rem + 1.6vw, 2.2rem); color: #fff4dc; text-shadow: 0 2px 4px rgba(0,0,0,.9), 0 0 30px rgba(0,0,0,.8); animation: aeFade 1.4s var(--ease-out) .2s both; }
.ae-hello::before, .ae-hello::after { content: ""; display: inline-block; vertical-align: middle; width: clamp(18px, 4vw, 64px); height: 1px; background: linear-gradient(90deg, transparent, #c43a4b); margin: 0 .7em; }
.ae-hello::after { transform: scaleX(-1); }
.ae-stage .ae-title__w { font-size: clamp(3.2rem, 1rem + 9vw, 9.5rem); }
.ae-stage .ae-world { margin-top: .6rem; }
.ae-genre { display: flex; gap: .5rem; margin: .9rem 0 0; animation: aeFade 1.4s var(--ease-out) 1.2s both; }
.ae-genre span, .ae-tag { font-family: var(--f-roman); font-weight: 600; font-size: .74rem; letter-spacing: .18em; text-transform: uppercase; color: #fff4ea; padding: .3em .8em; border: 1px solid rgba(196,58,75,.9); background: rgba(143,29,44,.55); }
.ae-tag { display: inline-block; margin-top: .7rem; }
.ae-stage__who { position: absolute; top: clamp(76px, 9vh, 110px); left: 0; right: 0; display: none; }
.ae-hero__low { margin: 0 auto; padding: clamp(1rem, 2vw, 1.6rem) var(--gutter) clamp(3.5rem, 7vw, 5.5rem); text-align: center; align-items: center; animation: none; }
@media (max-aspect-ratio: 4/5) {
  .ae-stage { height: auto; aspect-ratio: 1080 / 1935; max-height: none; min-height: 0; justify-content: flex-start; }
  .ae-stage .ae-hero__img img { object-position: 50% 0; }
  .ae-stage::after { background: linear-gradient(180deg, rgba(5,3,6,.7) 0%, rgba(5,3,6,.35) 18%, rgba(5,3,6,0) 34%, rgba(5,3,6,0) 70%, rgba(5,3,6,.8) 90%, #050306 100%); }
  .ae-stage__title { padding-top: clamp(1.4rem, 6vw, 2.4rem); }
}
@media (max-width: 560px) {
  .ae-hello { letter-spacing: .14em; margin-right: -.14em; font-size: 1.05rem; }
  .ae-hello::before, .ae-hello::after { width: 14px; margin: 0 .45em; }
  .ae-stage .ae-title__w { font-size: clamp(3rem, 16.5vw, 4.4rem); }
  .ae-stage .ae-world { font-size: .66rem; }
  .ae-hero__low { padding-top: .4rem; margin-top: -1.2rem; position: relative; }
}
@media (prefers-reduced-motion: reduce) { .ae-stage .ae-hero__img img, .ae-hello, .ae-genre { animation: none; } }

/* ═════ Fondos de Horizonte de Hombres (fondo-fichas) ═════ */
.ae-legio { background: linear-gradient(180deg, #050306 0%, rgba(5,3,6,.7) 12%, rgba(5,3,6,.72) 88%, #050306 100%), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 30% / cover no-repeat, #050306; }
.ae-narr { background: linear-gradient(120deg, rgba(60,10,20,.72), rgba(8,5,10,.86) 60%), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 60% / cover no-repeat; }
.sheet__book--hdh { background: linear-gradient(180deg, rgba(8,5,10,.84), rgba(8,5,10,.9)), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 40% / cover no-repeat, #0b090e; }
.nightfall__genre { display: inline-block; margin: .3rem 0 .8rem; font-family: var(--f-sc); letter-spacing: .12em; font-size: .9rem; color: #e6dcf5; border: 1px solid rgba(155,130,224,.5); padding: .25em 1em; }
@media (max-width: 560px) { .ae-hello { font-size: .98rem; letter-spacing: .12em; } .ae-hello::before, .ae-hello::after { display: none; } }
@media (max-width: 560px) { .ae-world span.w { display: block; } }

/* ═════════ Fase 2b (correcciones de Jessica): calidez, óvalos, Magna Roma · Hellas ═════════ */
.ae { --cyan: #d6b26a; background: radial-gradient(120% 60% at 50% 0%, #2a130e 0%, #160a09 45%, #0c0606 100%); }
.ae::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: var(--paper-grain); opacity: .9; z-index: 0; }
.ae > * { position: relative; z-index: 1; }
.ae-world::before, .ae-world::after { background: linear-gradient(90deg, transparent, var(--gold-leaf)); }
.ae-legio::before { background: linear-gradient(90deg, transparent, var(--gold-leaf) 30%, var(--gold-leaf) 70%, transparent); }
.ae-narr::before { background: var(--gold-leaf); }

/* hero: Magna Roma de fondo + la imagen de la autora en un óvalo */
.ae-hero { display: block; min-height: calc(100svh - 67px); position: relative; isolation: isolate; overflow: hidden; background: #120806; }
.ae-hero::before { display: block; content: ""; position: absolute; inset: 0; z-index: -1; background:
  radial-gradient(55% 70% at 72% 50%, rgba(18,8,6,0) 0%, rgba(18,8,6,.35) 60%, rgba(18,8,6,.7) 100%),
  linear-gradient(90deg, rgba(18,8,6,.88) 0%, rgba(18,8,6,.62) 38%, rgba(18,8,6,.15) 62%, rgba(18,8,6,.35) 100%),
  linear-gradient(180deg, rgba(18,8,6,.35) 0%, transparent 25%, transparent 70%, rgba(18,8,6,.95) 100%); }
.ae-hero__bg { position: absolute; inset: 0; z-index: -2; }
.ae-hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%; filter: saturate(.9) sepia(.15); animation: aeZoom 30s var(--ease-out) both; }
.ae-hero__grid { min-height: calc(100svh - 67px); display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(1.5rem, 4vw, 4rem); align-items: center; padding-block: clamp(2rem, 5vh, 4rem); }
.ae-hero__txt { display: flex; flex-direction: column; align-items: flex-start; text-align: left; }
.ae-hero__txt .ae-hello { margin: 0 0 .3rem; text-align: left; }
.ae-hero__txt .ae-hello::before { display: none; }
.ae-hero__txt .ae-title__w { font-size: clamp(3.2rem, 1rem + 7.4vw, 8.4rem); letter-spacing: .1em; margin-right: 0; }
.ae-hero__txt .ae-world { justify-content: flex-start; }
.ae-hero__txt .ae-world::before { display: none; }
.ae-hero__txt .ae-motto { margin-top: 1.6rem; }
.ae-hero__txt .ae-oath { margin-left: 0; }
.ae-hero__txt .ae-cta { justify-content: flex-start; }
.ae-oval { margin: 0; position: relative; justify-self: center; width: min(100%, 470px, 62svh); display: flex; flex-direction: column; align-items: center; animation: aeFade 1.6s var(--ease-out) .5s both; }
.ae-oval__frame { display: block; width: 100%; aspect-ratio: 22 / 25; border-radius: 50%; overflow: hidden; position: relative;
  border: 2px solid #f0d695;
  box-shadow: 0 0 0 6px #3a0c14, 0 0 0 8px #c43a4b, 0 0 0 11px #2a0a10, 0 0 0 13px #d6b26a, 0 30px 80px -10px rgba(0,0,0,.85), 0 0 120px rgba(214,150,80,.25); }
.ae-oval__frame img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; }
.ae-oval__frame::after { content: ""; position: absolute; inset: 0; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(255,240,200,.35), inset 0 -30px 60px -20px rgba(40,10,5,.55); }
.ae-oval__laurel { width: 46%; margin-top: -22%; color: var(--gold-hi); filter: drop-shadow(0 2px 6px rgba(0,0,0,.8)); position: relative; z-index: 2; transform: translateY(18%); }
.ae-oval figcaption { margin-top: -.6rem; text-align: center; position: relative; z-index: 2; }
.ae-oval figcaption b { display: block; font-family: var(--f-roman); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-hi); font-size: clamp(1rem, .9rem + .4vw, 1.3rem); text-shadow: 0 2px 8px rgba(0,0,0,.9); }
.ae-oval figcaption span { font-family: var(--f-sc); letter-spacing: .08em; color: #f2e6cc; font-size: .95rem; text-shadow: 0 1px 6px rgba(0,0,0,.95); }
@media (max-width: 860px) {
  .ae-hero__grid { grid-template-columns: 1fr; padding-block: 1.6rem 3rem; min-height: 0; }
  .ae-hero::before { background: linear-gradient(180deg, rgba(18,8,6,.55) 0%, rgba(18,8,6,.25) 30%, rgba(18,8,6,.55) 60%, rgba(18,8,6,.95) 100%); }
  .ae-hero__txt { align-items: center; text-align: center; display: contents; }
  .ae-hero__txt > * { text-align: center; }
  .ae-hero__txt .ae-hello { order: 1; text-align: center; justify-self: center; }
  .ae-hero__txt .ae-title { order: 2; justify-self: center; }
  .ae-hero__txt .ae-world { order: 3; justify-content: center; justify-self: center; }
  .ae-hero__txt .ae-genre { order: 4; justify-self: center; }
  .ae-oval { order: 5; width: min(86%, 360px); margin: 1.6rem auto .4rem; }
  .ae-hero__txt .ae-motto { order: 6; }
  .ae-hero__txt .ae-oath { order: 7; justify-self: center; }
  .ae-hero__txt .ae-cta { order: 8; justify-self: center; justify-content: center; }
  .ae-hero__txt .ae-hello { margin-bottom: .2rem; }
}

/* El triángulo: óvalos */
.ae-legio { background: linear-gradient(180deg, rgba(22,10,9,.9) 0%, rgba(22,10,9,.55) 14%, rgba(22,10,9,.6) 86%, rgba(14,7,6,1) 100%), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 30% / cover no-repeat, #160a09; }
.ae-card__arch.ae-ovalimg { border-radius: 50%; aspect-ratio: 4 / 5; border: 2px solid #f0d695; box-shadow: 0 0 0 5px #2a0a10, 0 0 0 7px #c43a4b, 0 0 0 10px #1a0808, 0 0 0 11px #d6b26a, 0 40px 70px -30px rgba(143,29,44,.6), 0 30px 50px -20px #000; }
.ae-card--marco .ae-card__arch.ae-ovalimg { box-shadow: 0 0 0 5px #2a0a10, 0 0 0 7px #f0d695, 0 0 0 11px #2a0a10, 0 0 0 12px #c43a4b, 0 0 0 15px #1a0808, 0 0 0 16px #d6b26a, 0 50px 80px -30px rgba(143,29,44,.7); }
.ae-card__arch.ae-ovalimg img { object-position: 50% 10%; }
.ae-trio__lines path { stroke: var(--gold-leaf); }
.ae-trio { padding-top: 1rem; }
.ae-narr { background: linear-gradient(120deg, rgba(70,14,22,.78), rgba(22,10,9,.85) 60%), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 60% / cover no-repeat; }

/* Dos formas de entender el tiempo */
.ae-war { background: linear-gradient(180deg, #0e0706 0%, #140a08 50%, #0e0706 100%); }
.ae-vs polygon { stroke: var(--gold-leaf); }
.ae-vs__t svg { width: 26px; height: 26px; fill: none; stroke: var(--gold-hi); stroke-width: 1.5; stroke-linecap: round; position: static; }
.ae-side--roma { background: linear-gradient(180deg, rgba(40,10,14,.82), rgba(20,8,8,.92)), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 70% / cover no-repeat; border-color: rgba(196,58,75,.55); }
.ae-side--hellas { background: linear-gradient(180deg, rgba(248,243,232,.88), rgba(244,238,224,.94)), url("../../assets/hdh/hellas-desk.jpg") 50% 40% / cover no-repeat; border-color: #b9a06a; color: #14283c; }
.ae-side--hellas .ae-side__num { color: #6e5310; }
.ae-side--hellas .ae-side__t { color: #0f2a44; }
.ae-side--hellas .ae-side__w { color: #2c4a66; }
.ae-side--hellas .ae-side__tag { color: #1b5a86; }
.ae-side--hellas .ae-side__poem { color: #1f3550; }
.ae-side--hellas .ae-side__txt { color: #2a3c50; }
.ae-side--hellas .ae-side__motto { color: #6e5310; border-top-color: rgba(110,83,16,.35); }
.ae-side--hellas .ae-tag { background: #1b5a86; border-color: #0f3a5c; }
.ae-side--hellas .ae-side__cov { box-shadow: 0 24px 40px -16px rgba(15,42,68,.55); }
.ae-conflict__nexus { color: #c9b89a; }

/* Galería y síguela, cálidos */
.ae-gal { background: linear-gradient(180deg, rgba(14,7,6,.9), rgba(14,7,6,.75) 40%, rgba(14,7,6,.95)), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 40% / cover no-repeat; }
.ae-follow { background: linear-gradient(90deg, rgba(40,10,14,.9), rgba(20,8,8,.82) 55%, rgba(14,7,6,.9)), url("../../assets/hdh/lectura-desk.jpg") 50% 50% / cover no-repeat; }
.nightfall { background: linear-gradient(180deg, #0e0706 0%, #2a0d16 14%, #6b2a24 27%, #3a1834 42%, #1b1236 58%, #0b0818 76%, #030207 100%); }
.nightfall::after { background: linear-gradient(90deg, transparent, rgba(214,178,106,.4), transparent); }

/* Fichas de HdH: óvalo y fondo de cada civilización */
.hdh-oval { margin: 0 auto; width: min(100%, 380px); aspect-ratio: 4 / 5; border-radius: 50%; overflow: hidden; border: 2px solid #f0d695; box-shadow: 0 0 0 5px #2a0a10, 0 0 0 7px #c43a4b, 0 0 0 10px #1a0808, 0 0 0 11px #d6b26a, 0 30px 60px -20px #000; }
.hdh-oval img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 12%; }
.sheet__book--hdh.is-hellas { --ink: #14283c; --ink-2: #263a50; --ink-3: #3d5168; --gold-leaf: #6e5310; --gold-hi: #1b5a86; --gold-lo: #b9a06a; --line: rgba(110,83,16,.35); --line-soft: rgba(110,83,16,.22);
  background: linear-gradient(180deg, rgba(248,243,232,.9), rgba(244,238,224,.95)), url("../../assets/hdh/hellas-desk.jpg") 50% 40% / cover no-repeat, #f4eee0; color: var(--ink); }
.sheet__book--hdh.is-hellas .sheet__text { color: var(--ink-2); }
.sheet__book--hdh.is-hellas .hdh-oval { border-color: #c9a85a; box-shadow: 0 0 0 5px #f4eee0, 0 0 0 7px #1b5a86, 0 0 0 10px #f4eee0, 0 0 0 11px #b28a2e, 0 30px 60px -20px rgba(15,42,68,.5); }
.sheet__book--hdh.is-hellas .ae-tag { background: #1b5a86; border-color: #0f3a5c; }
@media (max-width: 760px) { .hdh-oval { width: min(78%, 280px); } }
@media (prefers-reduced-motion: reduce) { .ae-hero__bg img, .ae-oval { animation: none; } }
.ae-hero__txt .ae-hello { white-space: nowrap; font-size: clamp(1rem, .7rem + 1.1vw, 1.75rem); letter-spacing: .16em; }
.ae-hero__txt .ae-hello::after { display: none; }
.ae-hero__txt .ae-title__w { font-size: clamp(3rem, 1rem + 5.4vw, 6.6rem); }
.ae-hero__txt .ae-world span.w { display: inline; }
.ae-hero__txt .ae-world { display: block; }
.ae-hero__txt .ae-world::after { display: none; }
.ae-oval__laurel { width: 30%; margin-top: -11%; transform: none; }
.ae-oval figcaption { margin-top: .3rem; }
.ae-hero__bg img { object-position: 50% 25%; }
.ae-hero::before { background:
  linear-gradient(90deg, rgba(18,8,6,.9) 0%, rgba(18,8,6,.65) 40%, rgba(18,8,6,.25) 62%, rgba(18,8,6,.45) 100%),
  linear-gradient(180deg, rgba(18,8,6,.3) 0%, transparent 25%, rgba(18,8,6,.55) 62%, rgba(18,8,6,.97) 100%); }
.ae-side--roma { background: linear-gradient(180deg, rgba(40,10,14,.82), rgba(20,8,8,.92)), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 15% / cover no-repeat; }
.ae-gal { background: linear-gradient(180deg, rgba(14,7,6,.9), rgba(14,7,6,.75) 40%, rgba(14,7,6,.95)), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 10% / cover no-repeat; }
@media (max-width: 860px) {
  .ae-hero__txt .ae-hello { white-space: normal; font-size: 1.05rem; letter-spacing: .12em; }
  .ae-hero__txt .ae-title__w { font-size: clamp(3rem, 16vw, 4.6rem); letter-spacing: .08em; margin-right: -.08em; }
  .ae-hero::before { background: linear-gradient(180deg, rgba(18,8,6,.65) 0%, rgba(18,8,6,.4) 30%, rgba(18,8,6,.6) 55%, rgba(18,8,6,.97) 85%); }
  .ae-hero__bg img { object-position: 50% 0; }
}
.sheet__book--hdh.is-hellas .sheet__close { color: #f4eee0; background: #14283c; }
.sheet__book--hdh.is-hellas { background: linear-gradient(180deg, rgba(248,243,232,.84), rgba(244,238,224,.92)), url("../../assets/hdh/hellas-desk.jpg") 50% 40% / cover no-repeat, #f4eee0; }
.ae-side--hellas { background: linear-gradient(180deg, rgba(248,243,232,.8), rgba(244,238,224,.92) 55%), url("../../assets/hdh/hellas-desk.jpg") 50% 30% / cover no-repeat; }


/* ═════════ m65: hero a lo ancho, negro y dorado, fondos romanos ═════════ */
.ae { background: #070507; }
.ae::before { opacity: .6; }
/* hero */
.ae-wide { background: #050308; min-height: 0; display: block; }
.ae-wide::before { display: none; }
.ae-wide__stage { position: relative; height: min(calc(100svh - 67px), 56vw); min-height: 460px; overflow: hidden; isolation: isolate; }
.ae-wide__img { position: absolute; inset: 0; z-index: -2; }
.ae-wide__img img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 22%; animation: aeZoom2 24s var(--ease-out) both; }
.ae-wide__stage::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(180deg, rgba(5,3,8,.6) 0%, rgba(5,3,8,.25) 18%, rgba(5,3,8,0) 32%, rgba(5,3,8,0) 70%, rgba(5,3,8,.85) 92%, #050308 100%); }
.ae-wide__top { position: absolute; left: 0; right: 0; top: 0; padding: clamp(1rem, 3vh, 2rem) var(--gutter) 0; display: flex; flex-direction: column; align-items: center; text-align: center; }
.ae-wide__top .ae-hello { margin: 0; font-size: clamp(1rem, .7rem + 1vw, 1.6rem); letter-spacing: .2em; }
.ae-wide__top .ae-hello::before, .ae-wide__top .ae-hello::after { background: linear-gradient(90deg, transparent, var(--gold-leaf)); }
.ae-wide__top .ae-title__w { font-size: clamp(3rem, 1rem + 5.2vw, 6.4rem); line-height: 1; }
.ae-wide__top .ae-world { margin-top: .35rem; font-size: clamp(.68rem, .6rem + .25vw, .86rem); }
.ae-wide__top .ae-world span.w { display: inline; }
.ae-wide__top .ae-genre { margin-top: .5rem; }
.ae-wide__names { position: absolute; left: 0; right: 0; bottom: clamp(1.2rem, 4vh, 2.4rem); margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); width: min(100%, 1000px); margin-inline: auto; text-align: center; font-family: var(--f-roman); font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: var(--gold-hi); font-size: clamp(.8rem, .6rem + .6vw, 1.15rem); text-shadow: 0 2px 10px #000; }
.ae-wide__low { text-align: center; display: flex; flex-direction: column; align-items: center; padding-block: clamp(1.4rem, 3vw, 2.4rem) clamp(3.5rem, 7vw, 5.5rem); }
.ae-wide__low .ae-motto { margin: 0; }
@media (max-aspect-ratio: 4/5) {
  .ae-wide__stage { height: auto; aspect-ratio: 1080 / 1935; min-height: 0; max-height: none; }
  .ae-wide__img img { object-position: 50% 0; }
  .ae-wide__stage::after { background: linear-gradient(180deg, rgba(5,3,8,.55) 0%, rgba(5,3,8,.2) 25%, rgba(5,3,8,0) 40%, rgba(5,3,8,0) 80%, #050308 100%); }
  .ae-wide__top { padding-top: 1.4rem; }
  .ae-wide__names { bottom: .8rem; letter-spacing: .16em; font-size: .78rem; }
}
@media (max-width: 560px) {
  .ae-wide__top .ae-hello { font-size: 1rem; letter-spacing: .12em; }
  .ae-wide__top .ae-hello::before, .ae-wide__top .ae-hello::after { display: none; }
  .ae-wide__top .ae-title__w { font-size: clamp(3rem, 16vw, 4.4rem); letter-spacing: .08em; margin-right: -.08em; }
  .ae-wide__top .ae-world span.w { display: block; }
  .ae-wide__top .ae-world span[aria-hidden] { display: none; }
  .ae-wide__low { padding-top: .6rem; }
}
@media (prefers-reduced-motion: reduce) { .ae-wide__img img { animation: none; } }

/* botones y etiquetas: negro y dorado */
.ae-btn { color: #120c04; background: linear-gradient(100deg, #b08f4f, var(--gold-leaf) 45%, var(--gold-hi)); border: 1px solid var(--gold-hi); box-shadow: inset 0 0 0 3px rgba(255,240,200,.2), 0 10px 26px -12px rgba(214,178,106,.45); }
.ae-btn:hover { color: #000; }
.ae-btn--ghost { background: rgba(5,3,8,.72); color: var(--gold-hi); border-color: var(--gold-leaf); box-shadow: none; }
.ae-btn--ghost:hover { background: var(--gold-leaf); color: #120c04; }
.ae-genre span, .ae-tag, .hdh-genre .ae-tag, .sheet .ae-tag, .ae-side--hellas .ae-tag, .sheet__book--hdh.is-hellas .ae-tag, .novel--hellas .ae-tag { background: rgba(5,3,8,.82) !important; border: 1px solid var(--gold-leaf) !important; color: #f0d695 !important; }
.ae-net a { border-color: var(--gold-leaf); background: rgba(5,3,8,.6); }
.ae-net a:hover { background: var(--gold-leaf); border-color: var(--gold-hi); color: #120c04; }
.ae-h2 i, .ae-sub i { color: var(--gold-leaf); }
.ae-card__fac, .ae-libri span, .ae-conflict figcaption, .ae-layers .n { color: var(--gold-leaf); }
.ae-narr__epi { color: var(--gold-hi); }
.ae-side--roma .ae-side__tag { color: var(--gold-hi); }
.ae-layers ol { border-color: rgba(214,178,106,.4); }
.ae-libri a:hover { background: linear-gradient(90deg, rgba(214,178,106,.16), transparent); }
.ae-side--roma { border-color: rgba(214,178,106,.4); }

/* fondos romanos por sección */
.ae-legio { background: linear-gradient(180deg, #050308 0%, rgba(8,6,8,.66) 14%, rgba(8,6,8,.7) 86%, #070507 100%), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 30% / cover no-repeat, #070507; }
.ae-narr { background: linear-gradient(110deg, rgba(10,7,8,.9) 0%, rgba(10,7,8,.82) 55%, rgba(20,40,60,.55) 100%), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 60% / cover no-repeat; border-color: rgba(214,178,106,.4); grid-template-columns: auto minmax(0, 1fr); }
.ae-war { background: linear-gradient(180deg, #070507 0%, rgba(7,5,7,.86) 12%, rgba(7,5,7,.9) 88%, #070507 100%), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 20% / cover no-repeat, #070507; }
.ae-side--roma { background: linear-gradient(180deg, rgba(10,7,8,.78), rgba(10,7,8,.92)), url("../../assets/hdh/lectura-desk.jpg") 50% 50% / cover no-repeat; }
.ae-gal { background: linear-gradient(180deg, rgba(7,5,7,.9), rgba(7,5,7,.7) 40%, rgba(7,5,7,.95)), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 10% / cover no-repeat; }
.ae-follow { background: linear-gradient(90deg, rgba(7,5,7,.92), rgba(7,5,7,.8) 55%, rgba(7,5,7,.9)), url("../../assets/hdh/lectura-desk.jpg") 50% 50% / cover no-repeat; }
.nightfall { background: linear-gradient(180deg, #070507 0%, #2a1a10 14%, #5a3a1c 27%, #3a1834 42%, #1b1236 58%, #0b0818 76%, #030207 100%); }
@media (max-aspect-ratio: 4/5) {
  .ae-war, .ae-gal { background-image: linear-gradient(180deg, rgba(7,5,7,.9), rgba(7,5,7,.84)), url("../../assets/hdh/roma-limpia-mob.jpg"); background-size: cover; background-position: 50% 20%; }
}

/* Flavio, el Nexo con Lapso */
.ae-narr { position: relative; }
.ae-narr__face { box-shadow: 0 0 0 4px #0a0708, 0 0 0 5px var(--gold-leaf), 0 0 0 8px #0a0708, 0 0 0 9px #4f8fbf; }
.ae-narr__nexus { margin: .9rem 0 .6rem; padding-left: .9rem; border-left: 2px solid #4f8fbf; color: #e8e0cc; font-size: 1.02rem; }
.ae-narr__acts { display: flex; flex-wrap: wrap; gap: .6rem; }
.ae-narr__bridge { grid-column: 1 / -1; display: flex; align-items: center; gap: .8rem; margin-top: .4rem; font-family: var(--f-roman); font-size: .78rem; letter-spacing: .2em; text-transform: uppercase; }
.ae-narr__bridge i { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--gold-leaf)); }
.ae-narr__bridge i:last-child { background: linear-gradient(90deg, #4f8fbf, transparent); }
.ae-narr__bridge b { font-weight: 600; color: var(--gold-hi); }
.ae-narr__bridge b:last-of-type { color: #9cc9ea; }
.ae-narr__bridge svg { width: 20px; height: 20px; fill: none; stroke: var(--gold-hi); stroke-width: 1.5; stroke-linecap: round; }
.ae-nexo-tag { display: inline-block; margin: 0 0 .6rem; font-family: "Cinzel", var(--f-sc); font-weight: 600; font-size: .78rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-hi); border: 1px solid var(--gold-leaf); padding: .3em .9em; background: linear-gradient(90deg, rgba(214,178,106,.12), rgba(79,143,191,.18)); }
.sheet__book--hdh.is-hellas .ae-nexo-tag { color: #6e5310; }
.ae-nexo-txt { border-left: 2px solid #4f8fbf; padding-left: .9rem; font-style: italic; color: var(--ink-2); margin: .8rem 0 0; }
@media (max-width: 860px) { .ae-narr { grid-template-columns: 1fr; } .ae-narr__acts { justify-content: center; } .ae-narr__nexus { text-align: left; } }
.ae-legio { background: linear-gradient(180deg, #050308 0%, rgba(8,6,8,.76) 14%, rgba(8,6,8,.8) 86%, #070507 100%), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 30% / cover no-repeat, #070507; }
.ae-narr { background: linear-gradient(110deg, rgba(10,7,8,.92) 0%, rgba(10,7,8,.86) 55%, rgba(20,40,60,.7) 100%), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 60% / cover no-repeat; }

/* ═════ m66: Flavio y Ariadna, el nexo ═════ */
.ae-narr { display: block; text-align: center; max-width: 1080px; padding: clamp(1.6rem, 4vw, 3rem); background: linear-gradient(90deg, rgba(10,7,8,.9) 0%, rgba(10,7,8,.82) 45%, rgba(10,14,22,.82) 55%, rgba(12,26,40,.88) 100%), url("../../assets/hdh/roma-limpia-desk.jpg") 0 50% / 60% auto no-repeat, url("../../assets/hdh/hellas-desk.jpg") 100% 50% / 60% auto no-repeat, #0a0708; }
.ae-narr__kick { margin-bottom: 1.4rem; }
.ae-narr__pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(1rem, 3vw, 2.4rem); align-items: center; }
.ae-narr__side { display: flex; flex-direction: column; align-items: center; }
.ae-narr__side h3 { margin-top: 1rem; font-family: var(--f-roman); font-weight: 600; font-size: clamp(1.3rem, 1rem + .8vw, 1.8rem); color: var(--ink); }
.ae-narr__side h3 small { display: block; font-family: var(--f-sc); font-weight: 400; letter-spacing: .06em; font-size: .86rem; color: var(--ink-3); margin-top: .3rem; }
.ae-narr__side--hellas h3 small { color: #a9c9e2; }
.ae-narr__face { width: clamp(120px, 15vw, 170px); }
.ae-narr__side--roma .ae-narr__face { box-shadow: 0 0 0 4px #0a0708, 0 0 0 5px var(--gold-leaf), 0 0 0 8px #0a0708, 0 0 0 9px #8f1d2c; }
.ae-narr__side--hellas .ae-narr__face { border-color: #f4eee0; box-shadow: 0 0 0 4px #0c1a28, 0 0 0 5px #c9a85a, 0 0 0 8px #0c1a28, 0 0 0 9px #4f8fbf; }
.ae-narr__q { font-size: .95rem; margin: .6rem 0 0; max-width: 30ch; }
.ae-narr__mid { display: flex; flex-direction: column; align-items: center; gap: .8rem; position: relative; }
.ae-narr__mid::before { content: ""; position: absolute; left: -12%; right: -12%; top: 22px; height: 1px; background: linear-gradient(90deg, var(--gold-leaf), #4f8fbf); opacity: .7; }
.ae-narr__glass { width: 44px; height: 44px; padding: 9px; fill: none; stroke: var(--gold-hi); stroke-width: 1.4; stroke-linecap: round; border: 1px solid var(--gold-leaf); border-radius: 50%; background: #0a0708; position: relative; }
.ae-narr__mid .ae-narr__nexus { border: 0; padding: 0; margin: 0; font-family: var(--f-display); font-size: clamp(1.1rem, 1rem + .5vw, 1.4rem); line-height: 1.35; color: var(--ink); }
.ae-narr__acts { justify-content: center; margin-top: 1.8rem; }
@media (max-width: 860px) {
  .ae-narr { background: linear-gradient(180deg, rgba(10,7,8,.9) 0%, rgba(10,7,8,.84) 45%, rgba(12,26,40,.88) 100%), url("../../assets/hdh/roma-limpia-mob.jpg") 50% 0 / 100% 50% no-repeat, url("../../assets/hdh/hellas-mob.jpg") 50% 100% / 100% 50% no-repeat, #0a0708; }
  .ae-narr__pair { grid-template-columns: 1fr; }
  .ae-narr__mid::before { display: none; }
}

/* El triángulo: bustos de la portada */
.ae-card__arch.ae-ovalimg img { object-position: 50% 25%; }
.hdh-oval--casio img, .hdh-oval--marco img, .hdh-oval--adriano img { object-position: 50% 25%; }
.ae-narr { isolation: isolate; overflow: hidden; background: linear-gradient(90deg, rgba(10,7,8,.86) 0%, rgba(10,7,8,.84) 50%, rgba(10,7,8,.72) 100%), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 40% / cover no-repeat, #0a0708; }
.ae-narr::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 55%; z-index: -1; pointer-events: none; background: linear-gradient(90deg, rgba(10,16,26,.2), rgba(10,22,36,.55)), url("../../assets/hdh/hellas-desk.jpg") 50% 40% / cover no-repeat; -webkit-mask-image: linear-gradient(90deg, transparent, #000 55%); mask-image: linear-gradient(90deg, transparent, #000 55%); opacity: .55; }
.ae-narr > * { position: relative; }
@media (max-width: 860px) {
  .ae-narr { background: linear-gradient(180deg, rgba(10,7,8,.86), rgba(10,7,8,.8)), url("../../assets/hdh/roma-limpia-mob.jpg") 50% 0 / cover no-repeat, #0a0708; }
  .ae-narr::after { top: auto; left: 0; width: auto; height: 50%; -webkit-mask-image: linear-gradient(180deg, transparent, #000 50%); mask-image: linear-gradient(180deg, transparent, #000 50%); background-image: linear-gradient(180deg, rgba(10,16,26,.2), rgba(10,22,36,.6)), url("../../assets/hdh/hellas-mob.jpg"); }
}
.ae-narr { background: linear-gradient(90deg, rgba(10,7,8,.92) 0%, rgba(10,7,8,.9) 50%, rgba(10,7,8,.8) 100%), url("../../assets/hdh/roma-limpia-desk.jpg") 50% 40% / cover no-repeat, #0a0708; } .ae-narr::after { opacity: .45; }
@media (max-width: 860px) { .ae-narr { background: linear-gradient(180deg, rgba(10,7,8,.9), rgba(10,7,8,.86)), url("../../assets/hdh/roma-limpia-mob.jpg") 50% 0 / cover no-repeat, #0a0708; } }
.ae-narr__mid .ae-narr__nexus { text-align: center; }

/* ═════ m68: Hellas también en negro y dorado (azul egeo solo en detalles) ═════ */
.ae-side--hellas { background: linear-gradient(180deg, rgba(8,9,12,.84), rgba(8,9,12,.93) 55%), url("../../assets/hdh/hellas-desk.jpg") 50% 30% / cover no-repeat, #08090c; border-color: rgba(214,178,106,.4); color: var(--ink); }
.ae-side--roma { border-color: rgba(214,178,106,.4); }
.ae-side--hellas .ae-side__num { color: var(--gold-leaf); }
.ae-side--hellas .ae-side__t { color: var(--ink); }
.ae-side--hellas .ae-side__w { color: #a9c9e2; }
.ae-side--hellas .ae-side__tag { color: var(--gold-hi); }
.ae-side--hellas .ae-side__poem { color: #e9dfc8; }
.ae-side--hellas .ae-side__txt { color: var(--ink-2); }
.ae-side--hellas .ae-side__motto { color: var(--gold-hi); border-top-color: rgba(214,178,106,.2); }
.ae-side--hellas .ae-side__cov { box-shadow: 0 24px 40px -16px #000, 0 0 0 1px rgba(79,143,191,.6); }
.ae-side--hellas::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: linear-gradient(90deg, transparent, #4f8fbf, transparent); }
.sheet__book--hdh.is-hellas { --ink: #efe5d0; --ink-2: #d2c6ab; --ink-3: #a99c82; --gold-leaf: #d6b26a; --gold-hi: #f0d695; --gold-lo: #7d6334; --line: rgba(214,178,106,.28); --line-soft: rgba(214,178,106,.14);
  background: linear-gradient(180deg, rgba(8,9,12,.86), rgba(8,9,12,.92)), url("../../assets/hdh/hellas-desk.jpg") 50% 40% / cover no-repeat, #08090c; color: var(--ink); }
.sheet__book--hdh.is-hellas .sheet__text { color: #e3d8c0; }
.sheet__book--hdh.is-hellas .hdh-oval { border-color: #f0d695; box-shadow: 0 0 0 5px #08090c, 0 0 0 7px #4f8fbf, 0 0 0 10px #08090c, 0 0 0 11px #d6b26a, 0 30px 60px -20px #000; }
.sheet__book--hdh.is-hellas .sheet__close { color: var(--gold-hi); background: rgba(0,0,0,.75); }
.sheet__book--hdh.is-hellas .ae-nexo-tag { color: var(--gold-hi); }
.ae-side--roma { background: linear-gradient(180deg, rgba(8,7,8,.84), rgba(8,7,8,.93) 55%), url("../../assets/hdh/lectura-desk.jpg") 50% 50% / cover no-repeat, #080708; }

/* ═════ m132 + m153: ficha completa de Horizonte de Hombres (bloques de la web vieja de Jessica) ═════ */
.sheet__book--hdh { --acc: #c43a4b; --cz: "Cinzel", "Spectral SC", serif; }
.sheet__book--hdh.is-hellas { --acc: #4f8fbf; }
.ficha { display: block; }
.ficha__top { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(28px, 4.5vw, 64px); align-items: center; }
.ficha__face { width: min(100%, 340px); }
.ficha__eyebrow { font-family: var(--cz); font-weight: 600; font-size: .78rem; letter-spacing: .26em; text-transform: uppercase; color: var(--gold-leaf); margin: 0 0 .5rem; }
.ficha h2 { overflow-wrap: anywhere; }
.ficha__plates { display: flex; flex-wrap: wrap; gap: 1px; margin: 1.2rem 0 .8rem; background: var(--line); border: 1px solid var(--line); }
.ficha__plates > div { flex: 1 1 150px; background: rgba(8, 6, 10, .82); padding: .7rem .9rem .75rem; min-width: 0; }
.ficha__plates dt { font-family: var(--cz); font-size: .66rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-leaf); margin-bottom: .25rem; }
.ficha__plates dd { margin: 0; color: var(--ink); font-size: .98rem; line-height: 1.3; overflow-wrap: anywhere; }
.ficha__nota { font-size: .88rem; font-style: italic; color: var(--ink-3); margin: 0 0 .8rem; }
.ficha__badges { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.4rem; }
.ficha__banner { display: flex; align-items: center; gap: .7rem; margin: 0; }
.ficha__banner img { width: 54px; height: 54px; object-fit: contain; filter: drop-shadow(0 4px 8px rgba(0,0,0,.7)); }
.ficha__banner figcaption { font-family: var(--cz); font-size: .7rem; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-3); max-width: 24ch; }
.ficha__tags { margin: 0; }

.ficha__sec { margin-top: clamp(2.6rem, 5vw, 4rem); }
.ficha__h { display: flex; align-items: center; gap: 1rem; margin: 0 0 1.4rem; font-family: var(--cz); font-weight: 600; font-size: clamp(1rem, .9rem + .4vw, 1.25rem); letter-spacing: .2em; text-transform: uppercase; color: var(--gold-hi); }
.ficha__h::before { content: ""; width: 10px; height: 10px; flex: none; transform: rotate(45deg); border: 1px solid var(--gold-leaf); background: var(--acc); }
.ficha__h::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, var(--line), transparent); }
.ficha__just { color: #e3d8c0; }
.ficha__just p, .ficha__ptxt, .ficha__rel p { margin: 0 0 .9em; }
.ficha__just p:last-child { margin-bottom: 0; }
.ficha__col { max-width: 72ch; }

.ficha__who-in { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.ficha__quote { padding: 1.4rem 1.4rem 1.2rem; border-top: 1px solid var(--gold-leaf); border-bottom: 1px solid var(--gold-leaf); background: linear-gradient(180deg, rgba(214,178,106,.07), transparent); }
.ficha__quote blockquote { margin: 0; font-family: var(--f-display); font-size: clamp(1.25rem, 1rem + .8vw, 1.6rem); line-height: 1.3; color: var(--gold-hi); }
.ficha__quote blockquote::before { content: "“"; display: block; font-size: 2.6em; line-height: .6; height: .42em; color: var(--acc); }
.ficha__quote-by { margin: .9rem 0 0; font-family: var(--cz); font-size: .7rem; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-leaf); }
.ficha__quote .ae-nexo-txt { margin-top: 1rem; font-size: .95rem; }

.ficha__intro { text-align: center; font-style: italic; color: var(--ink-2); margin: -.4rem 0 1.4rem; }
.ficha__people { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.2rem; }
.ficha__person { flex: 0 1 calc((100% - 2.4rem) / 3); min-width: 0; text-align: center; padding: 1.5rem 1.2rem 1.3rem; border: 1px solid var(--line); border-top: 2px solid var(--acc); background: rgba(8, 6, 10, .72); }
.ficha__round { display: grid; place-items: center; width: 116px; height: 116px; margin: 0 auto .9rem; border-radius: 50%; overflow: hidden; border: 2px solid var(--gold-leaf); box-shadow: 0 0 0 4px rgba(8,6,10,.9), 0 0 0 5px var(--acc), 0 14px 26px -12px #000; background: #0b090e; }
.ficha__round img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }
.ficha__round-txt { font-family: var(--cz); font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-leaf); padding: .6rem; }
.ficha__person h4, .ficha__rel h4 { margin: 0 0 .3rem; font-family: var(--f-display); font-weight: 400; font-size: 1.22rem; line-height: 1.2; color: var(--gold-hi); }
.ficha__role { margin: 0 0 .7rem; font-family: var(--cz); font-size: .66rem; letter-spacing: .17em; text-transform: uppercase; color: var(--gold-leaf); line-height: 1.5; }
.ficha__ptxt { font-size: .95rem; line-height: 1.55; color: var(--ink-2); margin: 0; }

.ficha__traits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: 1.6rem; background: var(--line); border: 1px solid var(--line); }
.ficha__trait { padding: 1.4rem 1.2rem 1.3rem; text-align: center; background: linear-gradient(150deg, rgba(70,50,25,.22), rgba(8,6,10,.9)); }
.ficha__trait img, .ficha__glyph { display: block; width: 46px; height: 46px; object-fit: contain; margin: 0 auto .7rem; }
.ficha__glyph { width: 46px; height: 24px; color: var(--acc); }
.ficha__trait h4 { margin: 0 0 .45rem; font-family: var(--cz); font-weight: 600; font-size: .9rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-hi); }
.ficha__trait p { margin: 0; font-size: .95rem; line-height: 1.5; color: var(--ink-2); }

.ficha__rels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.ficha__rel { min-width: 0; padding: 1.2rem 1.25rem 1.1rem; border: 1px solid var(--line); border-left: 2px solid var(--acc); background: rgba(14, 10, 8, .7); text-align: left; }
.ficha__rel p:last-child { margin: 0; font-size: .95rem; line-height: 1.55; color: var(--ink-2); }

.ficha__story { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: clamp(16px, 3vw, 32px); align-items: start; padding: clamp(1.2rem, 3vw, 2rem); border: 1px solid var(--line); background: linear-gradient(135deg, rgba(85,58,26,.18), rgba(8,6,10,.6)); }
.ficha__story-ic { width: 64px; height: 64px; object-fit: contain; }
.ficha__story h4 { margin: 0 0 .8rem; font-family: var(--f-display); font-weight: 400; font-size: clamp(1.3rem, 1.1rem + .6vw, 1.7rem); color: var(--gold-hi); }
.ficha__symbol { margin: 2rem auto 0; max-width: 62ch; text-align: center; }
.ficha__symbol img { width: 150px; height: auto; margin: 0 auto 1rem; filter: drop-shadow(0 10px 14px rgba(0,0,0,.8)) drop-shadow(0 0 12px rgba(214,178,106,.18)); }
.ficha__symbol figcaption { font-family: var(--f-display); font-style: italic; font-size: clamp(1.05rem, 1rem + .3vw, 1.25rem); line-height: 1.45; color: var(--ink); }
.ficha__place { grid-template-columns: 200px minmax(0, 1fr); }
.ficha__place figure { margin: 0; text-align: center; }
.ficha__place img { width: 180px; height: auto; margin: 0 auto .6rem; border-radius: 50%; }
.ficha__place figcaption { font-family: var(--cz); font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-3); }
.ficha__place h4 { font-family: var(--cz); font-size: .85rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-leaf); }
.ficha__foot { margin-top: clamp(2.4rem, 5vw, 3.4rem); padding-top: 1.2rem; border-top: 1px solid var(--line-soft); text-align: center; font-family: var(--cz); font-size: .72rem; letter-spacing: .26em; color: var(--gold-lo); }
.sheet__book--hdh.is-hellas .ficha__foot { color: var(--gold-leaf); }

@media (max-width: 1000px) {
  .ficha__rels { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ficha__person { flex-basis: calc((100% - 1.2rem) / 2); }
}
@media (max-width: 760px) {
  .ficha__top { grid-template-columns: 1fr; text-align: center; }
  .ficha__face { width: min(70%, 260px); }
  .ficha .filet--left { margin-inline: auto; }
  .ficha__plates { text-align: left; }
  .ficha__plates > div { flex-basis: 40%; }
  .ficha__plates dt { letter-spacing: .12em; overflow-wrap: anywhere; }
  .ficha__badges { justify-content: center; }
  .ficha__who-in { grid-template-columns: 1fr; }
  .ficha__traits, .ficha__rels { grid-template-columns: 1fr; }
  .ficha__person { flex-basis: 100%; }
  .ficha__story, .ficha__place { grid-template-columns: 1fr; }
  .ficha__story-ic { margin: 0 auto; }
}
/* m269: la galería con sus imágenes (casi todas cuadradas) */
.ae-ph { aspect-ratio: 1 / 1; width: clamp(220px, 26vw, 340px); }
@media (max-width: 760px) { .ae-ph { width: 74vw; } }
/* m327/m332 (Jessica, sí en t11-5): la entrada de Trece Tronos con Noctia, el río y la barca de Caronte, el Muro y Luzaria */
.nightfall { background: linear-gradient(180deg, #070507 0%, rgba(7,5,7,.55) 12%, rgba(5,4,12,.15) 32%, rgba(5,4,12,.25) 70%, #030207 100%), url("../../assets/sky/desk-night.jpg") center 62% / cover no-repeat, #030207 !important; }
@media (orientation: portrait) { .nightfall { background: linear-gradient(180deg, #070507 0%, rgba(7,5,7,.5) 12%, rgba(5,4,12,.12) 34%, rgba(5,4,12,.3) 72%, #030207 100%), url("../../assets/sky/mob-night.jpg") center 60% / cover no-repeat, #030207 !important; } }
.nightfall::before { opacity: .35; }
.nightfall__in { text-shadow: 0 2px 18px rgba(0,0,0,.85), 0 0 2px rgba(0,0,0,.6); }
/* t14-1: «Próximo capítulo: …» bajo los botones (solo si hay uno programado) */
.ae-prox { margin: 1rem 0 0; font-family: var(--f-roman); font-size: .85rem; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-hi); text-shadow: 0 1px 8px rgba(0,0,0,.8); }