:root{--fondo:#110f0d;--fondo2:#191714;--tarjeta:#1e1b18;--oro:#c8a96a;--oro2:#e3cf9f;--crema:#f4efe6;--muted:#9a9488;--linea:rgba(200,169,106,.18);--serif:"Cormorant Garamond","Playfair Display",Georgia,"Times New Roman",serif;--sans:"Inter","Helvetica Neue",Arial,system-ui,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--fondo);color:var(--crema);font:16px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}img{max-width:100%;display:block}
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem clamp(1rem,4vw,3rem);background:rgba(17,15,13,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--linea)}
.marca{display:flex;align-items:center;gap:.75rem}.marca strong{display:block;font:600 1.25rem/1.1 var(--serif);letter-spacing:.04em}.marca small{display:block;font-size:.7rem;letter-spacing:.25em;text-transform:uppercase;color:var(--oro)}
.monograma{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--oro);border-radius:50%;font:600 1.3rem var(--serif);color:var(--oro)}
#nav{display:flex;gap:1.2rem;flex-wrap:wrap;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase}#nav a{opacity:.75}#nav a:hover,#nav a.activo{opacity:1;color:var(--oro2)}
@media(max-width:720px){#nav{display:none}}
.hero{position:relative;min-height:min(42vh,420px);display:flex;align-items:flex-end;background:radial-gradient(1200px 420px at 70% -10%,rgba(200,169,106,.16),transparent 60%),linear-gradient(180deg,#1c1915 0%,var(--fondo) 100%);border-bottom:1px solid var(--linea)}
.hero-in{width:100%;max-width:1200px;margin:0 auto;padding:3.2rem clamp(1rem,4vw,3rem) 2.6rem}
.eyebrow{font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--oro2);margin:0 0 .6rem}
.hero h1{font:500 clamp(2.4rem,6vw,4.4rem)/1.05 var(--serif);margin:0 0 .8rem;max-width:16ch}
.hero p.lead{max-width:58ch;margin:0;color:rgba(244,239,230,.82)}
.wrap{max-width:1200px;margin:0 auto;padding:3.2rem clamp(1rem,4vw,3rem)}
.sec-t{display:flex;align-items:end;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--linea);padding-bottom:.8rem;margin-bottom:2rem}
.sec-t h2{font:500 clamp(1.7rem,3vw,2.3rem)/1.1 var(--serif);margin:0}.sec-t p{margin:0;color:var(--muted);font-size:.9rem}
.sec-t a{color:var(--oro2)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem}
@media(max-width:980px){.grid{grid-template-columns:1fr;max-width:420px;margin:0 auto}}
.card{background:var(--tarjeta);border:1px solid var(--linea);overflow:hidden;display:flex;flex-direction:column;transition:transform .35s,box-shadow .35s,border-color .35s}
.card:hover{transform:translateY(-5px);box-shadow:0 22px 50px -24px rgba(0,0,0,.8);border-color:rgba(200,169,106,.45)}
.retrato{position:relative;overflow:hidden;background:#161310}
.card .retrato{aspect-ratio:2/3}
.retrato img{width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform .8s}
.card:hover .retrato img{transform:scale(1.04)}
.retrato-inicial{display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,#2a241c,#141210 72%);min-height:100%}
.retrato-inicial .inicial{font:500 clamp(5rem,18vw,8rem)/1 var(--serif);color:var(--oro);border:1px solid rgba(200,169,106,.45);width:1.35em;height:1.35em;display:grid;place-items:center;border-radius:50%}
.card .cb{padding:1.25rem 1.35rem 1.4rem;display:flex;flex-direction:column;gap:.35rem;flex:1}
.tag{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--oro)}
.card h3{font:500 1.7rem/1.15 var(--serif);margin:0}
.card .ub{color:var(--muted);font-size:.9rem}
.card .resumen{margin:.35rem 0 0;color:rgba(244,239,230,.82);font-size:.95rem}
.card .pr{margin-top:auto;padding-top:.9rem;display:flex;justify-content:flex-end;border-top:1px solid var(--linea)}
.card .pr small{font:.72rem var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--oro)}
.vacio{border:1px dashed rgba(200,169,106,.35);background:var(--tarjeta);padding:2.2rem;text-align:center;color:var(--muted)}.vacio b{display:block;font:500 1.4rem var(--serif);color:var(--crema);margin-bottom:.3rem}.vacio a{color:var(--oro2);border-bottom:1px solid var(--oro)}
.migas{font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;color:var(--oro2);margin-bottom:1.4rem}.migas a{opacity:.85}.migas a:hover{opacity:1}
.ficha{display:grid;grid-template-columns:minmax(240px,.78fr) minmax(0,1.22fr);gap:clamp(1.5rem,4vw,3.2rem);align-items:start}
@media(max-width:800px){.ficha{grid-template-columns:1fr}}
.foto-grande{border:1px solid var(--linea);background:var(--tarjeta)}
.foto-grande.retrato{aspect-ratio:2/3;position:sticky;top:90px}
@media(max-width:800px){.foto-grande.retrato{position:static;max-height:70vh}}
.ficha .txt h1{font:500 clamp(2.4rem,6vw,4rem)/1.05 var(--serif);margin:0 0 .7rem}
.foto-nota{margin:0 0 1.4rem;color:var(--muted);font:italic 1.05rem/1.5 var(--serif)}
.campo{padding:1.05rem 0;border-top:1px solid var(--linea)}
.campo h2{font:600 .72rem/1.2 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--oro);margin:0 0 .4rem}
.campo p{margin:0;font-size:1.02rem}
.campo a{color:var(--oro2);border-bottom:1px solid rgba(200,169,106,.55)}
.campo a:hover{color:var(--crema)}
.otras{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.otras a{display:block;background:var(--tarjeta);border:1px solid var(--linea);overflow:hidden;transition:border-color .3s}
.otras a:hover{border-color:rgba(200,169,106,.5)}
.otras .retrato{aspect-ratio:3/4}
.otras p{margin:0;padding:.7rem .9rem 0;font:500 1.25rem var(--serif)}
.otras span{display:block;padding:.15rem .9rem .85rem;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--oro)}
.pie{background:#0c0b0a;color:rgba(244,239,230,.7);text-align:center;padding:2.2rem 1rem;font-size:.85rem;border-top:1px solid var(--linea)}
.pie p{margin:.2rem 0}.pie-ficcion{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--oro)}
.cargando{padding:4rem;text-align:center;color:var(--muted)}
