/* A restrained presentation based on the real PC entrance screen. */
body { background: #10100f; }
.masthead { height: 78px; border-color: #32312d; }
.brand { color: #dedbd2; font-size: 16px; }
.brand-character { display: inline-block; width: 34px; height: 34px; object-fit: contain; vertical-align: middle; image-rendering: pixelated; margin-right: 8px; }
.brand span, .brand i { color: #b9a88b; }
#navigation { padding: 12px 0 14px; }
body[data-current-screen="inicio"] #navigation { visibility: hidden; }
.screen { border-color: #555248; box-shadow: none; }
.scene-entrance { background-image: url('assets/cpc-entrada.png'); background-size: contain; background-color: #090909; opacity: 1; }
.scene-abbey { background-image: url('assets/cpc-abadia.png'); opacity: 1; }
.scene-title { background-image: url('assets/cpc-portada.png'); opacity: 1; }
.scene-dim { filter: none; }
.hero-copy { padding: 27px 5%; width: 100%; text-align: center; text-shadow: 0 2px 6px #000, 0 2px 16px #000; pointer-events: none; background: linear-gradient(rgba(0,0,0,.76),transparent); }
.hero-copy .eyebrow { font-size: 9px; color: #e3d7bf; margin: 0 0 7px; }
.hero-copy h1 { font-size: clamp(28px,3.4vw,45px); margin: 0 0 5px; line-height: 1.2; }
.hero-copy h1 em { color: #f0e0c5; }
.hero-copy > p:not(.eyebrow) { margin: 0 auto; max-width: none; color: #f0e9da; font-size: 12px; }
nav.floor-menu { position: absolute; z-index: 3; left: 50%; bottom: 26%; transform: translateX(-50%); width: min(610px,74%); display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 3px 17px; padding: 9px 14px; background: rgba(12,12,11,.48); border: 0; }
nav.floor-menu a { padding: 9px 3px; font-size: 11px; color: #fff; letter-spacing: .07em; text-transform: uppercase; text-align: center; text-shadow: 0 1px 3px #000, 0 1px 6px #000; }
nav.floor-menu a span { color: #d6c7ac; margin-left: 1px; font-size: 11px; }
nav.floor-menu a:hover, nav.floor-menu a:focus-visible { color: #f9da99; }
.screen-caption { color: #e3d7bf; text-shadow: 0 1px 4px #000; }
.scroll { background: rgba(8,8,12,.88); }
.scroll h2 { font-weight: 400; }
@media (max-width: 900px) {
  .masthead { height: 76px; }
  body[data-current-screen="inicio"] #navigation.open { visibility: visible; }
  nav.floor-menu { display: grid; width: min(550px,88%); }
}
@media (max-width: 600px) {
  .brand { white-space: nowrap; font-size: 10px; letter-spacing: .04em; }
  .brand-character { width: 24px; height: 24px; margin-right: 4px; }
  .header-controls { flex-shrink: 0; gap: 7px; }
  nav.language-switch { flex-wrap: nowrap; gap: 3px; }
  .language-switch a { padding: 8px 2px; }
  .menu-toggle { padding: 9px 8px; }
  .scene-entrance { background-size: auto 100%; background-position: center; }
  .hero-copy { padding: 36px 6%; }
  .hero-copy h1 { font-size: 29px; }
  .hero-copy > p:not(.eyebrow) { max-width: 300px; font-size: 12px; }
  nav.floor-menu { bottom: 21%; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 3px 12px; }
  nav.floor-menu a { font-size: 10px; padding: 11px 2px; }
}