:root{
  --earth:#070907;
  --earth-2:#0f120f;
  --parchment:#f4efe4;
  --muted:rgba(244,239,228,.68);
  --soft:rgba(244,239,228,.16);
  --ochre:#d4a373;
  --ochre-soft:rgba(212,163,115,.3);
}

.archivo-body{
  min-height:100vh;
  background:
    radial-gradient(circle at 20% 10%, rgba(212,163,115,.08), transparent 28rem),
    radial-gradient(circle at 80% 30%, rgba(244,239,228,.04), transparent 30rem),
    var(--earth);
  color:var(--parchment);
  font-family:Manrope, system-ui, sans-serif;
}

.archivo-body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.18;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(to bottom, #000, transparent 85%);
}

.archivo-nav{
  position:fixed;
  z-index:50;
  top:0; left:0; right:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:1.15rem clamp(1.2rem, 5vw, 5rem);
  border-bottom:1px solid rgba(244,239,228,.07);
  background:rgba(7,9,7,.78);
  backdrop-filter:blur(18px);
}

.archivo-logo,
.archivo-footer-logo{
  font-family:"Cormorant Garamond", serif;
  font-style:italic;
  font-size:1.85rem;
  letter-spacing:-.03em;
  color:var(--parchment);
  text-decoration:none;
}
.archivo-logo span,
.archivo-footer-logo span{color:var(--ochre)}

.archivo-nav-links{
  display:flex;
  gap:2rem;
  align-items:center;
}
.archivo-nav-links a,
.archivo-lang,
.archivo-footer-links a,
.archive-meta,
.archive-button,
.admin-small{
  font-family:"Space Mono", monospace;
  text-transform:uppercase;
  letter-spacing:.22em;
  font-size:.66rem;
}
.archivo-nav-links a,
.archivo-footer-links a{
  color:rgba(244,239,228,.65);
  text-decoration:none;
  transition:.25s ease;
}
.archivo-nav-links a:hover,
.archivo-nav-links a.is-active,
.archivo-footer-links a:hover{color:var(--ochre)}
.archivo-lang{display:flex; gap:.75rem; color:rgba(244,239,228,.4)}

.archivo-main{
  width:min(1180px, calc(100% - 2rem));
  margin:0 auto;
  padding:9rem 0 5rem;
}

.archive-hero{
  min-height:42vh;
  display:grid;
  align-items:end;
  padding:3rem 0 4rem;
  border-bottom:1px solid rgba(244,239,228,.08);
  position:relative;
}
.archive-kicker{
  font-family:"Space Mono", monospace;
  text-transform:uppercase;
  letter-spacing:.42em;
  font-size:.7rem;
  color:var(--ochre);
  margin-bottom:2.2rem;
}
.archive-title{
  font-family:"Cormorant Garamond", serif;
  font-weight:400;
  line-height:.98;
  letter-spacing:-.045em;
  font-size:clamp(4rem, 12vw, 8.5rem);
  max-width:960px;
}
.archive-title em{font-style:italic; color:var(--ochre)}
.archive-lead{
  color:var(--muted);
  line-height:1.8;
  max-width:720px;
  margin-top:2rem;
  font-size:1rem;
}

.archive-filters{
  display:grid;
  grid-template-columns:1.5fr repeat(3, minmax(130px, .6fr)) auto;
  gap:.85rem;
  padding:2rem 0;
}
.archive-input,
.archive-select,
.admin-input,
.admin-textarea,
.admin-select{
  width:100%;
  border:1px solid rgba(244,239,228,.12);
  background:rgba(244,239,228,.035);
  color:var(--parchment);
  padding:.9rem 1rem;
  outline:none;
  font-family:Manrope, system-ui, sans-serif;
}
.archive-input:focus,
.archive-select:focus,
.admin-input:focus,
.admin-textarea:focus,
.admin-select:focus{border-color:var(--ochre)}
.archive-select option{background:#111; color:#fff}
.archive-button,
.admin-button{
  border:1px solid var(--ochre-soft);
  color:var(--ochre);
  background:transparent;
  padding:.9rem 1.1rem;
  cursor:pointer;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
  transition:.25s ease;
}
.archive-button:hover,
.admin-button:hover{border-color:var(--ochre); background:rgba(212,163,115,.06)}
.archive-button.danger{border-color:rgba(255,122,122,.35); color:#ff9a9a}
.archive-button.danger:hover{border-color:#ff9a9a}

.archive-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:1.15rem;
  margin-top:1rem;
}
.archive-card{
  display:flex;
  min-height:410px;
  flex-direction:column;
  border:1px solid rgba(244,239,228,.08);
  background:linear-gradient(180deg, rgba(244,239,228,.045), rgba(244,239,228,.018));
  text-decoration:none;
  color:var(--parchment);
  overflow:hidden;
  transition:.35s ease;
}
.archive-card:hover{transform:translateY(-4px); border-color:rgba(212,163,115,.42)}
.archive-card-img{
  height:185px;
  background:#111;
  overflow:hidden;
}
.archive-card-img img{width:100%; height:100%; object-fit:cover; opacity:.82; transition:.5s ease}
.archive-card:hover img{opacity:1; transform:scale(1.04)}
.archive-card-body{padding:1.25rem; display:flex; flex:1; flex-direction:column}
.archive-meta{color:var(--ochre); margin-bottom:.8rem; line-height:1.5}
.archive-card h2{
  font-family:"Cormorant Garamond", serif;
  font-size:2.05rem;
  line-height:1;
  font-weight:400;
  margin:0 0 .75rem;
}
.archive-card p{color:var(--muted); line-height:1.7; margin:0}
.archive-tags{display:flex; flex-wrap:wrap; gap:.45rem; margin-top:auto; padding-top:1.2rem}
.archive-tag{
  border:1px solid rgba(212,163,115,.18);
  color:rgba(244,239,228,.55);
  padding:.25rem .45rem;
  font-family:"Space Mono", monospace;
  font-size:.58rem;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.archive-detail{max-width:940px; margin:0 auto}
.archive-detail-image{margin:2rem 0; border:1px solid rgba(244,239,228,.08); max-height:560px; overflow:hidden}
.archive-detail-image img{width:100%; height:100%; object-fit:cover; display:block}
.archive-subtitle{font-family:"Cormorant Garamond", serif; font-style:italic; color:var(--ochre); font-size:clamp(1.8rem, 4vw, 3rem); line-height:1.05; margin-top:1rem}
.archive-content{color:rgba(244,239,228,.78); line-height:1.9; font-size:1.06rem; margin-top:2rem; white-space:pre-line}
.archive-empty{border:1px solid rgba(244,239,228,.08); padding:3rem; color:var(--muted); text-align:center}

.archivo-footer{
  width:min(1180px, calc(100% - 2rem));
  margin:0 auto;
  padding:3rem 0;
  border-top:1px solid rgba(244,239,228,.08);
  display:flex;
  justify-content:space-between;
  gap:2rem;
  color:rgba(244,239,228,.5);
}
.archivo-footer-links{display:flex; gap:1.5rem; align-items:center}

.admin-shell{max-width:980px; margin:0 auto; padding:8rem 1rem 4rem; color:var(--parchment)}
.admin-panel{border:1px solid rgba(244,239,228,.10); background:rgba(244,239,228,.035); padding:1.25rem; margin-top:1.25rem}
.admin-header{display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:1.5rem}
.admin-title{font-family:"Cormorant Garamond", serif; font-size:3rem; line-height:1; font-weight:400}
.admin-form{display:grid; gap:1rem}
.admin-row{display:grid; grid-template-columns:1fr 1fr; gap:1rem}
.admin-label{display:grid; gap:.45rem; color:rgba(244,239,228,.65); font-size:.85rem}
.admin-textarea{min-height:150px; resize:vertical}
.admin-table{width:100%; border-collapse:collapse; margin-top:1rem}
.admin-table th,.admin-table td{border-bottom:1px solid rgba(244,239,228,.08); padding:.85rem; text-align:left; vertical-align:top}
.admin-table th{color:var(--ochre); font-family:"Space Mono", monospace; font-size:.62rem; text-transform:uppercase; letter-spacing:.18em}
.admin-actions{display:flex; gap:.5rem; flex-wrap:wrap}
.admin-note{color:rgba(244,239,228,.55); line-height:1.6; font-size:.88rem}
.admin-error{border:1px solid rgba(255,122,122,.25); background:rgba(255,122,122,.08); padding:1rem; color:#ffb3b3}
.admin-success{border:1px solid rgba(126,216,155,.25); background:rgba(126,216,155,.08); padding:1rem; color:#baf0c7}

@media (max-width: 900px){
  .archivo-nav-links{display:none}
  .archivo-main{padding-top:7rem}
  .archive-filters{grid-template-columns:1fr}
  .archive-grid{grid-template-columns:1fr}
  .admin-row{grid-template-columns:1fr}
  .archivo-footer{flex-direction:column}
}