
:root{

--bg:#070707;
--panel:#111111;
--gold:#b08d57;
--text:#f3efe8;
--muted:#9a9a9a;
--line:rgba(255,255,255,.08);

}

*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{

background:var(--bg);
font-family:'Inter',sans-serif;
color:var(--text);

}

.editorial-section{

padding:120px 0;
overflow:hidden;

}

.editorial-grid{

width:min(92%,1280px);
margin:auto;

display:grid;
grid-template-columns:1fr 1fr;
gap:5rem;
align-items:center;

}

.editorial-label{

font-size:.75rem;
letter-spacing:.3em;
text-transform:uppercase;
color:var(--gold);

}

.editorial-content h2{

font-family:'Oswald',sans-serif;
font-size:clamp(3rem,6vw,6rem);
line-height:.92;
text-transform:uppercase;

margin:1.5rem 0;

}

.editorial-content p{

max-width:620px;
line-height:1.8;
color:var(--muted);

}

.editorial-actions{

display:flex;
gap:1rem;
margin-top:2rem;

}

.primary-btn,
.secondary-btn{

padding:1rem 1.4rem;
border:1px solid var(--line);

background:none;
color:white;

text-decoration:none;
text-transform:uppercase;
letter-spacing:.12em;

cursor:pointer;
transition:.35s ease;

}

.primary-btn{

background:var(--gold);
color:#111;

}

.primary-btn:hover,
.secondary-btn:hover{

transform:translateY(-3px);

}

.cover-frame{

overflow:hidden;
border:1px solid var(--line);

box-shadow:
0 30px 90px rgba(0,0,0,.55);

}

.cover-frame img{

width:100%;
display:block;
transition:1s ease;

}

.cover-frame:hover img{

transform:scale(1.03);

}

.topics-wrapper{

width:min(92%,1280px);
margin:6rem auto 0;

display:flex;
flex-wrap:wrap;
gap:1rem;

}

.topic{

padding:.9rem 1.1rem;
border:1px solid var(--line);

font-size:.8rem;
letter-spacing:.08em;
text-transform:uppercase;

transition:.3s ease;

}

.topic:hover{

border-color:var(--gold);
color:white;

}

.magazine-modal{

position:fixed;
inset:0;

display:flex;
align-items:center;
justify-content:center;

opacity:0;
visibility:hidden;

transition:.4s ease;

z-index:9999;

}

.magazine-modal.active{

opacity:1;
visibility:visible;

}

.modal-backdrop{

position:absolute;
inset:0;

background:rgba(0,0,0,.82);
backdrop-filter:blur(14px);

}

.magazine-viewer{

position:relative;

width:min(96%,1400px);
height:92vh;

background:#111;

border:1px solid var(--line);

z-index:2;

display:flex;
flex-direction:column;

transform:scale(.96);
transition:.4s ease;

}

.magazine-modal.active .magazine-viewer{

transform:scale(1);

}

.close-modal{

position:absolute;
top:1rem;
right:1rem;

width:48px;
height:48px;

border:none;
background:none;

color:white;
font-size:1.4rem;

cursor:pointer;

}

.viewer-topbar{

padding:1.4rem 2rem;
border-bottom:1px solid var(--line);

}

.page-indicator{

font-size:.85rem;
letter-spacing:.1em;
text-transform:uppercase;
color:#d0d0d0;

}

.progress-line{

width:100%;
height:2px;

margin-top:1rem;

background:rgba(255,255,255,.08);

}

.progress-line span{

display:block;
width:100%;
height:100%;

background:var(--gold);

}

.pdf-frame{

flex:1;

}

.pdf-frame iframe{

width:100%;
height:100%;

background:#0a0a0a;

}

.reveal{

opacity:0;
transform:translateY(40px);
filter:blur(8px);

transition:
opacity .9s ease,
transform .9s ease,
filter .9s ease;

}

.reveal.active{

opacity:1;
transform:none;
filter:none;

}

@media(max-width:980px){

.editorial-grid{

grid-template-columns:1fr;

}

.editorial-content h2{

font-size:3.4rem;

}

.editorial-actions{

flex-direction:column;

}

}
