/* ARCHIVORAS — Hostinger Premium Edition
   Design tokens ported 1:1 from the approved prototype/Next.js edition. */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300;9..144,500;9..144,600;9..144,700;9..144,900&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

:root{
  --void:#0B0D10;
  --void-2:#12151A;
  --void-3:#181C22;
  --parchment:#E9E4D8;
  --parchment-dim:#A7A192;
  --seal:#9C2B1E;
  --seal-bright:#C9432D;
  --brass:#B0904F;
  --steel:#6C8098;
  --line: rgba(233,228,216,0.10);
  --line-strong: rgba(233,228,216,0.22);
  --font-serif: 'Fraunces', serif;
  --font-sans: 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--void); color:var(--parchment); font-family:var(--font-sans);
  overflow-x:hidden; -webkit-font-smoothing:antialiased;
  background-image:
    radial-gradient(circle at 50% -10%, rgba(156,43,30,0.10), transparent 55%),
    radial-gradient(ellipse at 100% 100%, rgba(108,128,152,0.08), transparent 60%);
}
::selection{background:var(--seal); color:var(--parchment);}
a{color:inherit; text-decoration:none;}
.serif{font-family:var(--font-serif);}
.mono{font-family:var(--font-mono);}
.wrap{max-width:1320px; margin:0 auto; padding:0 40px;}
@media(max-width:720px){.wrap{padding:0 20px;}}
img{max-width:100%; display:block;}

/* ===== NAV ===== */
header.site-header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(11,13,16,0.72); backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  border-bottom:1px solid var(--line);
}
nav.main-nav{
  display:flex; align-items:center; justify-content:space-between;
  height:72px; max-width:1320px; margin:0 auto; padding:0 40px;
}
.logo{display:flex; align-items:center; gap:10px; font-family:var(--font-serif); font-weight:600; font-size:19px;}
.logo svg{width:22px; height:22px;}
.navlinks{display:flex; gap:34px; font-size:13.5px; color:var(--parchment-dim);}
.navlinks a{position:relative; padding:4px 0; transition:color .25s;}
.navlinks a:hover{color:var(--parchment);}
.navright{display:flex; align-items:center; gap:18px;}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-size:13px; font-weight:500; padding:9px 20px; border-radius:3px; cursor:pointer;
  border:1px solid transparent; transition:all .2s;
}
.btn-seal{
  background:linear-gradient(180deg,#B23325,var(--seal)); color:#F3E9E4;
  border-color:rgba(255,255,255,0.08);
  box-shadow:0 1px 0 rgba(255,255,255,0.06) inset, 0 6px 18px -8px rgba(156,43,30,0.6);
}
.btn-seal:hover{transform:translateY(-1px);}
.btn-outline{border-color:var(--line-strong); color:var(--parchment); background:transparent;}
.btn-outline:hover{border-color:var(--brass); color:var(--brass);}
.btn-ghost{color:var(--parchment-dim); background:none;}
.btn-ghost:hover{color:var(--parchment);}
.btn-sm{font-size:12px; padding:7px 14px;}
@media(max-width:920px){.navlinks{display:none;}}

/* ===== HERO ===== */
.hero{position:relative; min-height:90vh; display:flex; flex-direction:column; justify-content:center; padding:150px 0 90px; overflow:hidden;}
.hero-eyebrow{display:flex; align-items:center; gap:10px; font-family:var(--font-mono); font-size:12px; letter-spacing:0.16em; color:var(--brass); text-transform:uppercase; margin-bottom:26px;}
.hero-eyebrow .dot{width:6px; height:6px; border-radius:50%; background:var(--seal-bright); box-shadow:0 0 0 3px rgba(201,67,45,0.18);}
.hero h1{font-family:var(--font-serif); font-weight:600; font-size:clamp(36px,6.4vw,86px); line-height:0.98; letter-spacing:-0.01em; max-width:920px;}
.hero h1 .italic-line{font-style:italic; font-weight:400; color:var(--parchment-dim); display:block;}
.hero-sub{max-width:520px; margin-top:30px; color:var(--parchment-dim); font-size:16px; line-height:1.65;}
.searchbar{margin-top:44px; max-width:640px;}
.searchbar form{display:flex; align-items:center; gap:12px; border:1px solid var(--line-strong); border-radius:6px; background:rgba(233,228,216,0.03); padding:14px 18px;}
.searchbar form:focus-within{border-color:var(--brass);}
.searchbar input{flex:1; background:none; border:none; outline:none; color:var(--parchment); font-size:14.5px; font-family:var(--font-sans);}
.searchbar input::placeholder{color:var(--parchment-dim);}
.search-tags{display:flex; gap:10px; margin-top:16px; flex-wrap:wrap;}
.search-tags span{font-size:11.5px; color:var(--parchment-dim); border:1px solid var(--line); border-radius:20px; padding:5px 12px; font-family:var(--font-mono);}
.seal-wrap{position:absolute; right:-60px; top:50%; transform:translateY(-50%); width:480px; opacity:.5; pointer-events:none;}
@media(max-width:1100px){.seal-wrap{display:none;}}
.seal-ring-outer{animation:spin 40s linear infinite; transform-origin:280px 280px;}
.seal-ring-mid{animation:spin 60s linear infinite reverse; transform-origin:280px 280px;}
@keyframes spin{to{transform:rotate(360deg);}}

/* ===== TICKER ===== */
.ticker-section{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--void-2); padding:16px 0; overflow:hidden;}
.ticker-inner{display:flex; align-items:center; max-width:1320px; margin:0 auto; padding:0 40px; overflow:hidden;}
.ticker-label{font-family:var(--font-mono); font-size:11px; letter-spacing:0.12em; color:var(--seal-bright); text-transform:uppercase; padding-right:40px; flex-shrink:0;}
.ticker-track{display:flex; gap:0; white-space:nowrap; animation:ticker 38s linear infinite;}
.ticker-track:hover{animation-play-state:paused;}
@keyframes ticker{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.ticker-item{display:flex; align-items:center; gap:10px; padding:0 32px; border-right:1px solid var(--line); font-family:var(--font-mono); font-size:12.5px; color:var(--parchment-dim);}
.ticker-item b{color:var(--parchment); font-weight:500;}
.ticker-item .id{color:var(--brass);}

/* ===== SECTIONS ===== */
section{position:relative;}
.section-head{display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:44px; flex-wrap:wrap; gap:16px;}
.section-head .eyebrow{font-family:var(--font-mono); font-size:11.5px; letter-spacing:0.14em; color:var(--brass); text-transform:uppercase; margin-bottom:10px; display:block;}
.section-head h2{font-family:var(--font-serif); font-weight:500; font-size:clamp(24px,3vw,36px);}
.view-all{font-size:13px; color:var(--parchment-dim); border-bottom:1px solid var(--line-strong); padding-bottom:2px;}
.view-all:hover{color:var(--brass); border-color:var(--brass);}

/* ===== FEATURED ===== */
.featured{padding:90px 0 40px;}
.featured-card{display:grid; grid-template-columns:1.15fr 1fr; border:1px solid var(--line); border-radius:8px; overflow:hidden; background:var(--void-2);}
@media(max-width:860px){.featured-card{grid-template-columns:1fr;}}
.featured-img{position:relative; min-height:380px; background-size:cover; background-position:center;}
.featured-img::after{content:"";position:absolute; inset:0; background:linear-gradient(0deg,rgba(11,13,16,0.55),transparent 45%);}
.featured-badge{position:absolute; top:20px; left:20px; z-index:2; display:flex; align-items:center; gap:8px; background:rgba(11,13,16,0.65); backdrop-filter:blur(6px); border:1px solid rgba(233,228,216,0.18); padding:7px 12px; border-radius:20px; font-size:11px; text-transform:uppercase; font-family:var(--font-mono); color:var(--parchment);}
.featured-badge .dot{width:6px; height:6px; border-radius:50%; background:var(--seal-bright);}
.featured-body{padding:44px; display:flex; flex-direction:column; justify-content:center;}
.featured-body .kicker{font-size:12px; color:var(--brass); font-family:var(--font-mono); text-transform:uppercase; margin-bottom:14px;}
.featured-body h3{font-family:var(--font-serif); font-weight:500; font-size:clamp(20px,2.6vw,30px); line-height:1.15; margin-bottom:16px;}
.featured-body p{color:var(--parchment-dim); font-size:15px; line-height:1.7; margin-bottom:28px;}
.featured-meta{display:flex; gap:28px; flex-wrap:wrap; border-top:1px solid var(--line); padding-top:22px;}
.meta-field label{display:block; font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--parchment-dim); font-family:var(--font-mono); margin-bottom:4px;}
.meta-field span{font-size:13.5px; font-family:var(--font-mono); color:var(--parchment);}

/* ===== ARCHIVE GRID (masonry via CSS columns) ===== */
.archive-section{padding:100px 0;}
.masonry{column-count:4; column-gap:20px;}
@media(max-width:920px){.masonry{column-count:2;}}
@media(max-width:560px){.masonry{column-count:1;}}
.card{break-inside:avoid; margin-bottom:20px; border-radius:6px; overflow:hidden; position:relative; border:1px solid var(--line); background:var(--void-2); display:block;}
.card img{width:100%; filter:grayscale(.2) contrast(1.05); transition:filter .4s, transform .5s;}
.card:hover img{filter:grayscale(0) contrast(1.1); transform:scale(1.03);}
.card-overlay{position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end; padding:16px; background:linear-gradient(0deg,rgba(11,13,16,0.92) 0%,rgba(11,13,16,0.35) 55%,transparent 100%); opacity:0; transition:opacity .3s;}
.card:hover .card-overlay{opacity:1;}
.card-title{font-family:var(--font-serif); font-size:15px; font-weight:500; margin-bottom:8px;}
.card-meta{display:flex; flex-wrap:wrap; gap:6px 12px; font-family:var(--font-mono); font-size:10.5px; color:var(--parchment-dim);}
.card-meta b{color:var(--brass);}

/* ===== TIMELINE ===== */
.timeline-section{padding:100px 0;}
.timeline-track{display:flex; overflow-x:auto; padding-bottom:20px;}
.tl-item{flex:0 0 280px; padding-right:28px; margin-right:28px; border-right:1px solid var(--line-strong); position:relative;}
.tl-item:last-child{border-right:none;}
.tl-year{font-family:var(--font-serif); font-size:15px; color:var(--brass); margin-bottom:14px; display:flex; align-items:center; gap:10px;}
.tl-year::before{content:""; width:9px; height:9px; border-radius:50%; background:var(--seal-bright); box-shadow:0 0 0 4px rgba(201,67,45,0.15);}
.tl-item h4{font-family:var(--font-serif); font-weight:500; font-size:16px; margin-bottom:8px;}
.tl-item p{font-size:13px; color:var(--parchment-dim); line-height:1.6;}

/* ===== STATS ===== */
.stats-section{padding:80px 0; border-top:1px solid var(--line);}
.stats-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:8px; overflow:hidden;}
@media(max-width:760px){.stats-grid{grid-template-columns:repeat(2,1fr);}}
.stat{background:var(--void); padding:36px 30px;}
.stat .num{font-family:var(--font-serif); font-size:clamp(26px,3.4vw,40px); font-weight:600;}
.stat .num span{color:var(--brass);}
.stat .lbl{margin-top:8px; font-size:12.5px; color:var(--parchment-dim);}

/* ===== FOOTER ===== */
footer.site-footer{border-top:1px solid var(--line); padding:60px 0 40px;}
.footer-top{display:grid; grid-template-columns:1.6fr repeat(3,1fr); gap:40px; margin-bottom:50px;}
@media(max-width:800px){.footer-top{grid-template-columns:1fr 1fr;}}
.footer-col h5{font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--parchment-dim); margin-bottom:16px; font-family:var(--font-mono);}
.footer-col a{display:block; font-size:13.5px; color:var(--parchment-dim); margin-bottom:10px;}
.footer-col a:hover{color:var(--parchment);}
.footer-bottom{display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; border-top:1px solid var(--line); padding-top:24px; font-size:12px; color:var(--parchment-dim); font-family:var(--font-mono);}

/* ===== GENERIC PAGE ===== */
.page-hero{padding:150px 0 60px;}
.page-hero .eyebrow{display:block; margin-bottom:12px; font-family:var(--font-mono); font-size:11.5px; letter-spacing:0.14em; color:var(--brass); text-transform:uppercase;}
.page-hero h1{font-family:var(--font-serif); font-size:clamp(30px,5vw,52px); font-weight:500; max-width:760px;}
.breadcrumb{display:flex; gap:8px; font-size:12.5px; color:var(--parchment-dim); margin-bottom:24px; flex-wrap:wrap;}
.breadcrumb a:hover{color:var(--brass);}

/* ===== DOSSIER PAGE ===== */
.dossier-cover{position:relative; width:100%; height:64vh; min-height:420px; background-size:cover; background-position:center;}
.dossier-cover::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg,var(--void) 0%, rgba(11,13,16,.15) 55%, rgba(11,13,16,.5) 100%);}
.dossier-cover-content{position:absolute; bottom:0; left:0; right:0; padding:40px; max-width:1320px; margin:0 auto;}
.dossier-grid{display:grid; grid-template-columns:1.7fr 1fr; gap:50px; max-width:1320px; margin:0 auto; padding:50px 40px 100px;}
@media(max-width:960px){.dossier-grid{grid-template-columns:1fr;}}
.dossier-article p{color:var(--parchment-dim); line-height:1.8; font-size:15.5px; margin-bottom:20px;}
.dossier-actions{display:flex; flex-wrap:wrap; gap:10px; margin:30px 0;}
.dossier-gallery{display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:12px; margin:30px 0;}
.dossier-gallery img{border-radius:6px; border:1px solid var(--line); aspect-ratio:1; object-fit:cover;}
.sidebar-card{border:1px solid var(--line); background:var(--void-2); border-radius:8px; padding:28px; margin-bottom:24px;}
.sidebar-card h3{font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:.1em; color:var(--brass); margin-bottom:18px;}
.sidebar-row{display:flex; justify-content:space-between; gap:12px; border-bottom:1px solid var(--line); padding:10px 0; font-size:13px;}
.sidebar-row dt{color:var(--parchment-dim);}
.sidebar-row dd{font-family:var(--font-mono); text-align:right;}
.share-row{display:flex; gap:10px; flex-wrap:wrap;}
.notice-box{border:1px solid var(--seal); background:rgba(156,43,30,.08); border-radius:8px; padding:20px; font-size:13px; line-height:1.7; color:var(--parchment-dim); margin-top:20px;}
.prevnext{display:flex; justify-content:space-between; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin:50px auto; max-width:1320px; padding:24px 40px;}
.prevnext a{font-size:13px; color:var(--parchment-dim); max-width:45%;}
.prevnext a:hover{color:var(--brass);}
.prevnext .label{display:block; font-family:var(--font-mono); font-size:10.5px; text-transform:uppercase; margin-bottom:6px; color:var(--brass);}

/* ===== FORMS ===== */
label{display:flex; flex-direction:column; gap:6px; font-size:12.5px; color:var(--parchment-dim); margin-bottom:16px;}
input[type=text], input[type=email], input[type=password], input[type=date], input[type=number], input[type=url], select, textarea{
  background:rgba(233,228,216,0.03); border:1px solid var(--line-strong); border-radius:4px; padding:11px 14px;
  color:var(--parchment); font-family:var(--font-sans); font-size:14px; outline:none;
}
input:focus, select:focus, textarea:focus{border-color:var(--brass);}
textarea{min-height:140px; resize:vertical;}
.badge{display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line-strong); border-radius:20px; padding:4px 12px; font-family:var(--font-mono); font-size:10.5px; text-transform:uppercase;}
.badge-brass{border-color:rgba(176,144,79,.4); color:var(--brass);}
.badge-seal{border-color:rgba(201,67,45,.4); color:var(--seal-bright);}
.badge-steel{border-color:rgba(108,128,152,.4); color:var(--steel);}
.alert-error{background:rgba(156,43,30,.1); border:1px solid var(--seal); border-radius:6px; padding:16px; margin-bottom:20px; font-size:13.5px;}
.alert-success{background:rgba(176,144,79,.1); border:1px solid var(--brass); border-radius:6px; padding:16px; margin-bottom:20px; font-size:13.5px;}
.empty-state{border:1px dashed var(--line-strong); border-radius:8px; padding:70px 30px; text-align:center; color:var(--parchment-dim);}

/* ===== INSTALL PAGE ===== */
.install-body{display:flex; align-items:center; justify-content:center; min-height:100vh;}
.install-card{width:100%; max-width:420px; border:1px solid var(--line); background:var(--void-2); border-radius:10px; padding:40px; margin:20px;}
.install-logo{font-family:var(--font-serif); font-weight:600; font-size:20px; margin-bottom:24px;}
.install-card h1{font-family:var(--font-serif); font-size:22px; margin-bottom:10px;}
.install-card .dim{color:var(--parchment-dim); font-size:13px; margin-bottom:20px;}
.install-card form{display:flex; flex-direction:column;}

/* ===== ADMIN ===== */
.admin-shell{display:flex; min-height:100vh;}
.admin-sidebar{width:250px; flex-shrink:0; border-right:1px solid var(--line); background:var(--void-2); padding:28px 18px;}
.admin-sidebar .logo{margin-bottom:36px; padding:0 10px;}
.admin-nav a{display:block; padding:10px 12px; border-radius:4px; font-size:13.5px; color:var(--parchment-dim); margin-bottom:2px;}
.admin-nav a:hover{background:rgba(233,228,216,.04); color:var(--parchment);}
.admin-nav a.active{background:rgba(233,228,216,.06); color:var(--parchment);}
.admin-main{flex:1; min-width:0;}
.admin-topbar{display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); padding:24px 32px;}
.admin-topbar h1{font-family:var(--font-serif); font-size:22px; font-weight:500;}
.admin-body{padding:32px;}
.data-table{width:100%; border-collapse:collapse; border:1px solid var(--line); border-radius:6px; overflow:hidden; font-size:13.5px;}
.data-table th{background:var(--void-2); text-align:left; padding:12px 16px; font-family:var(--font-mono); font-size:11px; text-transform:uppercase; color:var(--parchment-dim); border-bottom:1px solid var(--line);}
.data-table td{padding:14px 16px; border-bottom:1px solid var(--line);}
.data-table tr:last-child td{border-bottom:none;}
.data-table tr:hover td{background:rgba(233,228,216,.02);}
.stat-cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:16px; margin-bottom:32px;}
.stat-card{border:1px solid var(--line); background:var(--void-2); border-radius:8px; padding:22px;}
.stat-card .num{font-family:var(--font-serif); font-size:30px; font-weight:600;}
.stat-card .lbl{font-size:12.5px; color:var(--parchment-dim); margin-top:4px;}
.tabs{display:flex; gap:6px; border-bottom:1px solid var(--line); margin-bottom:28px;}
.tab-btn{padding:10px 20px; font-size:13px; color:var(--parchment-dim); border-bottom:2px solid transparent; cursor:pointer; background:none; border-top:none; border-left:none; border-right:none;}
.tab-btn.active{color:var(--parchment); border-bottom-color:var(--brass);}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:0 20px;}
@media(max-width:700px){.form-grid{grid-template-columns:1fr;}}
.form-section{border:1px solid var(--line); border-radius:8px; padding:24px; margin-bottom:20px; background:var(--void-2);}
.form-section h3{font-family:var(--font-mono); font-size:11px; text-transform:uppercase; color:var(--brass); margin-bottom:18px; letter-spacing:.08em;}
.pagination{display:flex; gap:6px; margin-top:24px;}
.pagination a, .pagination span{padding:8px 13px; border:1px solid var(--line-strong); border-radius:4px; font-size:13px; color:var(--parchment-dim);}
.pagination a:hover{border-color:var(--brass); color:var(--brass);}
.pagination .current{background:var(--brass); color:var(--void); border-color:var(--brass);}
.toolbar{display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:20px; flex-wrap:wrap;}
.toolbar form{display:flex; gap:10px; flex-wrap:wrap;}
