*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
:root { --black:#0a0a0a; --white:#f2ede6; --red:#b01a1a; --red-muted:#7a1212; --amber:#c8922a; --muted:#6b6155; --sapphire:#0F52BA; }
html { scroll-behavior:smooth; }
body { background:var(--black); color:var(--white); font-family:'Courier Prime','Courier New',Courier,monospace; overflow-x:hidden; font-size:1.05rem; line-height:1.9; }
body::after { content:''; position:fixed; inset:0; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.055'/%3E%3C/svg%3E"); pointer-events:none; z-index:1000; }
.topband { background:var(--black); border-bottom:1px solid rgba(176,26,26,0.35); padding:1.27rem clamp(2rem,8vw,7rem); display:flex; flex-direction:column; gap:0.5rem; }
.brand-slash { background:var(--red); padding:0.55em clamp(2rem,8vw,7rem); display:flex; align-items:center; line-height:1; overflow:hidden; gap:0.4em; }
.brand-slash--top { padding-top:1.26em; padding-bottom:1.26em; }
.brand-slash .b-beltza { color:var(--black); font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:clamp(3.27rem,7.4vw,5.93rem); letter-spacing:0.12em; margin-right:0.2em; }
.brand-slash .b-exp { background:var(--black); color:var(--red); font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:clamp(3.27rem,7.4vw,5.93rem); letter-spacing:0.12em; padding:0.1em 0.4em; }
.hero { min-height:100vh; display:flex; flex-direction:column; justify-content:space-between; padding:clamp(2rem,5vw,4rem) clamp(2rem,8vw,7rem); position:relative; overflow:hidden; border-bottom:1px solid rgba(176,26,26,0.4); background-image:url('https://live.staticflickr.com/65535/55205605695_a97483bcbd_h.jpg'); background-size:cover; background-position:center; background-repeat:no-repeat; }
.hero-eyebrow { font-size:clamp(1rem,2vw,1.4rem); letter-spacing:0.3em; text-transform:uppercase; color:var(--amber); }
.hero-subtitle { font-size:clamp(3.6rem,6.4vw,4.8rem); font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; letter-spacing:0.04em; line-height:0.95; }
.hero-subtitle span { color:var(--amber); }
.hero-sub { font-size:clamp(1.05rem,2vw,1.3rem); color:var(--amber); letter-spacing:0.1em; }
.band { background:var(--red); overflow:hidden; padding:0.55rem 0; cursor:pointer; }
.band-inner { display:flex; white-space:nowrap; animation:scroll-left 25s linear infinite; will-change:transform; }
.band-text { font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:clamp(1rem,2.5vw,1.6rem); letter-spacing:0.25em; color:var(--black); padding-right:4rem; }
@keyframes scroll-left { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.section-label { font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:1.3rem; letter-spacing:0.3em; color:var(--amber); padding:0 0 1rem 0; }
.mandamientos { padding:0 clamp(2rem,8vw,7rem) 2rem; }
.mandamiento { padding:clamp(2rem,5vw,4rem) 0; border-bottom:1px solid rgba(176,26,26,0.2); opacity:0; transform:translateY(18px); transition:opacity 0.55s ease, transform 0.55s ease; }
.mandamiento.visible { opacity:1; transform:none; }
.m-number { font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:clamp(3rem,8vw,7rem); color:var(--sapphire); line-height:1; margin-bottom:0.5rem; }
.m-title { font-family:'Playfair Display',Georgia,serif; font-size:clamp(2.25rem,6vw,5.25rem); line-height:1.05; letter-spacing:-0.01em; margin-bottom:1.5rem; }
.m-title .bold { color:var(--white); }
.m-title .strike { text-decoration:line-through; text-decoration-color:var(--white); color:var(--red); }
.m-text { font-size:1.05rem; line-height:1.9; margin-bottom:1rem; }
.m-quote { font-size:1.1rem; line-height:1.6; border-left:3px solid var(--red); padding-left:1.2rem; margin:1.5rem 0; color:var(--amber); }
.m-quote--white { font-size:1.1rem; line-height:1.6; font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; letter-spacing:0.15em; color:var(--red); margin:1rem 0; }
.m-cara { font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:1rem; letter-spacing:0.3em; color:var(--red); margin:1.5rem 0 0.5rem; }
.m-artistas { font-size:0.95rem; line-height:1.8; color:var(--muted); letter-spacing:0.05em; margin:1.5rem 0; border-left:2px solid var(--red-muted); padding-left:1rem; }
.m-eslogan { font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:clamp(1rem,2vw,1.4rem); letter-spacing:0.2em; color:var(--red); margin:1.5rem 0; }
.credo { padding:clamp(3rem,8vw,7rem) clamp(2rem,8vw,7rem); text-align:left; background-color:#f0e8d8; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E"); color:var(--black); border-bottom:1px solid rgba(176,26,26,0.2); }
.credo-header { display:block; margin-bottom:2.5rem; }
.credo-number { font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:clamp(3rem,8vw,7rem); color:var(--red); line-height:1; display:block; margin-bottom:0.3rem; }
.credo-title { font-family:'Playfair Display',Georgia,serif; font-size:clamp(3rem,8vw,7rem); line-height:1.0; letter-spacing:-0.01em; color:var(--black); display:block; }
.credo-label { font-size:1.2rem; letter-spacing:0.4em; text-transform:uppercase; color:var(--red-muted); margin-bottom:3rem; display:block; }
.credo-pi-line { font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:1.3rem; letter-spacing:0.2em; color:var(--amber); margin:2rem 0; }
.credo-cosmos-pi, .credo-cosmos { font-size:1.05rem; line-height:1.9; max-width:800px; margin:0 0 2rem; }
.credo-frontón { font-size:0.85rem; letter-spacing:0.2em; color:var(--amber); margin-bottom:2rem; }
.credo-divider { width:3rem; height:2px; background:var(--red); margin:2.5rem 0; }
.credo-text { font-family:'Playfair Display',Georgia,serif; font-size:clamp(1.8rem,4vw,3.5rem); line-height:1.2; letter-spacing:0.02em; margin-bottom:2rem; }
.credo-text span { color:var(--red); }
.credo-exp-muerte { font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:clamp(3rem,8vw,7rem); letter-spacing:0.08em; color:var(--red); margin:2rem 0; line-height:1; }
.credo-sign { margin:2rem 0 0.5rem; }
.credo-sign-name { display:block; font-family:'Playfair Display',Georgia,serif; font-size:2.2rem; letter-spacing:0.02em; color:var(--black); }
.credo-sign-sub { display:block; font-size:1.1rem; letter-spacing:0.2em; color:var(--muted); margin-top:0.3rem; }
.credo-coords { font-size:1.1rem; line-height:1.9; letter-spacing:0.15em; color:var(--muted); margin-bottom:1rem; }
.credo-occult { font-size:1.1rem; letter-spacing:0.2em; color:var(--muted); }
.credo-occult .eh { font-size:1em; letter-spacing:inherit; }
.credo-occult .origin { font-size:1.1rem; }
.credo-occult .eq { color:var(--amber); }
.pm { display:inline-flex; flex-direction:column; font-size:0.6em; line-height:1; vertical-align:middle; }
.idiomas { padding:clamp(3rem,6vw,5rem) clamp(2rem,8vw,7rem); background:var(--black); }
.idiomas-label { font-size:1.3rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--amber); margin-bottom:2rem; }
.idiomas-grid { display:flex; flex-wrap:wrap; gap:1rem; align-items:stretch; }
.idioma-card { flex:1 1 280px; max-width:340px; background:var(--black); border:1px solid var(--red); overflow:hidden; display:flex; flex-direction:column; }
.idioma-flag { font-size:0.82rem; letter-spacing:0.2em; color:var(--amber); background:var(--black); padding:0.5rem 0.6rem 0.2rem; display:block; }
.idioma-brand { display:flex; align-items:center; line-height:1; overflow:hidden; background:var(--red); padding:0.3em 0 0.6em 0; border-bottom:3px solid var(--black); }
.ib-b { font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:1.8rem; color:var(--black); letter-spacing:0.08em; padding:0.1em 0.3em; }
.ib-e { font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:1.8rem; color:var(--red); background:var(--black); letter-spacing:0.08em; padding:0.1em 0.4em; }
.idioma-sub { font-size:0.95rem; letter-spacing:0.08em; color:var(--amber); padding:0.6rem 0.8rem 0.3rem; display:block; font-style:italic; }
.idioma-body { font-size:0.9rem; line-height:1.7; color:var(--white); padding:0.3rem 0.8rem 1rem; flex:1; }
footer { background:var(--black); border-top:1px solid rgba(176,26,26,0.35); padding:1.5rem clamp(2rem,8vw,7rem); }
.mandamientos-layout { display:flex !important; align-items:flex-start; gap:0; width:100%; }
.mandamientos-col-texto { flex:2; min-width:800px; }
.mandamientos-col-fotos { flex:1; min-width:300px; position:sticky; top:0; max-height:100vh; overflow-y:scroll; scrollbar-width:none; padding:2rem 0 2rem 1.5rem; }
.mandamientos-col-fotos::-webkit-scrollbar { display:none; }
.sidebar-foto { width:100%; display:block; filter:contrast(1.05); }
.sidebar-figura { margin:0 0 2rem 0; border:1px solid #1e1e1e; }
.sidebar-pie { font-family:'Courier Prime',monospace; font-size:0.85rem; letter-spacing:0.12em; color:var(--muted); padding:0.5rem 0.7rem; border-top:1px solid #1e1e1e; background:#0d0d0d; }
.sidebar-pie a { color:var(--amber); text-decoration:none; }
.portadas-marquee { overflow:hidden; width:100%; background:var(--black); border-top:3px solid var(--red); border-bottom:3px solid var(--red); cursor:pointer; white-space:nowrap; }
.portadas-inner { display:inline-flex; animation:portadas-scroll 40s linear infinite; will-change:transform; }
.portadas-inner img { height:clamp(120px,20vw,240px); width:auto; flex-shrink:0; display:block; margin-right:0.5rem; filter:contrast(1.05); transition:filter 0.3s; }
@keyframes portadas-scroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.selector-movil { display:none; font-family:'Bebas Neue',Impact,'Arial Narrow',sans-serif; font-size:clamp(0.95rem,2vw,1.3rem); letter-spacing:0.15em; background:var(--black); color:var(--amber); border:1px solid #333; padding:0.1em 0.4em; cursor:pointer; outline:none; }
.selector-movil option { background:var(--black); color:var(--amber); }
@media (max-width:600px) {
  .topband table, .topband tr, .topband td { display:block; text-align:left !important; white-space:normal !important; }
  .topband td + td { padding-top:0.4rem; }
  footer table, footer tr, footer td { display:block; text-align:left !important; white-space:normal !important; }
  footer td + td { padding-top:0.4rem; }
  .brand-slash { flex-wrap:nowrap; padding:0.55em clamp(0.8rem,4vw,2rem); gap:0.2em; overflow:hidden; }
  .brand-slash .b-beltza, .brand-slash .b-exp { font-size:clamp(1.4rem,6vw,2.5rem); }
  .brand-slash--top { padding-top:0.6em; padding-bottom:0.6em; }
  .brand-slash img { height:clamp(1.8rem,7vw,3rem) !important; }
  .hero-subtitle { font-size:clamp(2.5rem,8vw,4rem); }
}
@media (max-width:800px) {
  .mandamientos-layout { flex-direction:column; }
  .mandamientos-col-texto { width:100%; min-width:0; }
  .mandamientos-col-fotos { display:none; padding:0; }
  .mandamientos-col-fotos.visible { display:block; }
  .mandamientos-col-texto.oculto { display:none; }
  .selector-movil { display:inline-block; }
  .m-number { float:none; margin-left:0; margin-bottom:0.3rem; }
}
