:root { --ink:#202433; --paper:#fffaf1; --turquoise:#2bcac5; --pink:#f6b6cb; --lilac:#c6eaf2; --apple:#afd94e; --sun:#ffd45b; --line:rgba(32,36,51,.16); }
* { box-sizing:border-box; } body { background:var(--paper); color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; line-height:1.5; margin:0; } a { color:inherit; }
.site-header { align-items:center; border-bottom:1px solid var(--line); display:flex; height:76px; justify-content:space-between; padding:0 clamp(1.1rem,5vw,5.8rem); }.brand { font-family:Georgia,serif; font-size:2rem; font-weight:700; letter-spacing:-.08em; text-decoration:none; }.brand span { color:#d85f8b; } nav { display:flex; gap:clamp(.9rem,2.8vw,2.4rem); margin-left:auto; margin-right:clamp(1rem,3vw,3rem); } nav a { font-family:Georgia,serif; font-size:1.05rem; font-weight:700; letter-spacing:-.035em; text-decoration:none; } nav a:first-child { font-size:0; } nav a:first-child::after { content:'főoldal'; font-size:1.05rem; }.header-sticker { background:var(--sun); border:2px solid var(--ink); border-radius:999px; font-size:.69rem; font-weight:800; padding:.48rem .75rem; transform:rotate(3deg); }
.article-hero { background:var(--turquoise); min-height:400px; padding:clamp(3rem,8vw,7rem) clamp(1.2rem,10vw,10rem); }.article-hero__copy { align-self:center; max-width:950px; }.eyebrow { font-size:.7rem; font-weight:900; letter-spacing:.13em; margin:0 0 1rem; text-transform:uppercase; }.article-hero h1,.article-body h2,.album-card h2 { font-family:Georgia,serif; font-weight:500; letter-spacing:-.065em; line-height:.93; }.article-hero h1 { font-size:clamp(3.8rem,8.2vw,8.5rem); margin:0; }.article-subtitle { font-family:Georgia,serif; font-size:clamp(1.1rem,2.1vw,1.5rem); margin:1.6rem 0 0; }
.draft-notice { align-items:center; background:var(--sun); border-bottom:2px solid var(--ink); display:flex; gap:1.5rem; justify-content:center; padding:1rem clamp(1.2rem,5vw,4rem); }.draft-notice b { font-size:.77rem; text-transform:uppercase; }.draft-notice p { font-size:.85rem; margin:0; max-width:650px; }
.article-layout { margin:auto; max-width:1020px; padding:clamp(4rem,9vw,8rem) clamp(1.2rem,4vw,4rem); }.article-meta { border-bottom:1px solid var(--line); display:flex; font-size:.72rem; font-weight:800; gap:1rem; justify-content:space-between; letter-spacing:.08em; margin-bottom:3.6rem; padding-bottom:.8rem; text-transform:uppercase; }.article-body { margin:auto; max-width:680px; }.article-body p { font-family:Georgia,serif; font-size:clamp(1.15rem,1.8vw,1.38rem); line-height:1.52; margin:0 0 2rem; }.article-body .lead { font-size:clamp(1.5rem,2.5vw,2rem); line-height:1.33; }.article-body h2 { font-size:clamp(2.7rem,5vw,4.5rem); margin:4rem 0 1.3rem; }.editor-note { background:var(--sun); border:2px solid var(--ink); box-shadow:5px 5px 0 var(--pink); margin:3rem -5rem; padding:1.05rem 1.3rem; transform:rotate(-1deg); }.editor-note span { font-size:.68rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }.editor-note p { font-family:Inter,ui-sans-serif,sans-serif; font-size:.93rem; line-height:1.35; margin:.3rem 0 0; }.photo-placeholder { align-items:center; background:var(--pink); border:2px solid var(--ink); display:flex; flex-direction:column; min-height:310px; justify-content:center; margin:3rem -2.5rem; padding:2rem; text-align:center; transform:rotate(1.5deg); }.photo-placeholder span { font-size:.7rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }.photo-placeholder b { font-family:Georgia,serif; font-size:clamp(1.6rem,3vw,2.5rem); font-weight:500; letter-spacing:-.05em; line-height:1; margin-top:1rem; }.album-card { background:var(--lilac); border:2px solid var(--ink); margin:5rem -2.5rem 0; padding:clamp(2rem,5vw,4rem); }.album-card h2 { font-size:clamp(2.4rem,5vw,4.2rem); margin:0 0 1rem; }.album-card p:not(.eyebrow) { font-size:1.12rem; max-width:520px; }.album-link { background:var(--ink); color:var(--paper); display:inline-flex; font-size:.76rem; font-weight:900; gap:.7rem; margin-top:.8rem; padding:.85rem 1rem; text-decoration:none; text-transform:uppercase; }.album-link span { font-size:1.15rem; line-height:.7; }.album-card small { display:block; font-size:.72rem; margin-top:1rem; } footer { align-items:center; background:var(--pink); display:flex; gap:1.2rem; justify-content:space-between; padding:2rem clamp(1.2rem,9vw,9rem); } footer .brand { font-size:1.8rem; } footer p,footer span { font-size:.8rem; font-weight:800; margin:0; }
@media (max-width:720px) { .site-header { height:65px; }.header-sticker { display:none; } nav { margin-right:0; }.draft-notice { align-items:flex-start; flex-direction:column; gap:.3rem; }.article-meta { align-items:flex-start; flex-direction:column; gap:.25rem; }.editor-note { margin:2rem 0; }.photo-placeholder,.album-card,.article-illustration { margin-left:0; margin-right:0; } footer { align-items:flex-start; flex-direction:column; } }

/* A három felvonás ritmusa és a fejléc tipográfiáját visszhangzó lábléc. */
.story-chapter { margin-top:5rem; }
.story-chapter h2 { margin:0 0 1.3rem; }
.chapter-label { color:#168f92; font-family:Inter,ui-sans-serif,sans-serif !important; font-size:.7rem !important; font-weight:900; letter-spacing:.13em; margin-bottom:.8rem !important; text-transform:uppercase; }
.chapter-guest { border-left:3px solid var(--pink); margin-left:-2rem; padding-left:2rem; }
.chapter-loud { border-top:2px solid var(--ink); padding-top:2rem; }
.editor-note--intro { margin-bottom:4.8rem; }
.editor-note--pink { background:var(--pink); box-shadow:5px 5px 0 var(--turquoise); transform:rotate(1deg); }
footer p, footer span { font-family:Georgia,serif; font-size:.92rem; font-weight:700; letter-spacing:-.02em; }
.article-photo { margin:2.8rem auto; max-width:480px; }.photo-open { background:transparent; border:0; cursor:zoom-in; display:block; padding:0; width:100%; }.photo-open img { border:2px solid var(--ink); display:block; height:auto; width:100%; }.article-photo figcaption { color:#505566; font-family:Georgia,serif; font-size:1.05rem; font-style:italic; line-height:1.35; margin:1rem 0 0; text-align:right; }.article-photo--portrait { max-width:330px; }
.article-illustration { margin:3.5rem auto 0; max-width:520px; }.article-illustration .photo-open img { border:2px solid var(--ink); box-shadow:9px 9px 0 var(--turquoise); display:block; height:auto; transform:rotate(1deg); width:100%; }.article-illustration figcaption { font-family:Georgia,serif; font-size:1.1rem; font-style:italic; margin:1rem 0 0; text-align:right; }
.photo-lightbox { background:transparent; border:0; max-height:92vh; max-width:min(1100px,92vw); padding:0; }.photo-lightbox::backdrop { background:rgba(18,22,39,.82); }.photo-lightbox img { display:block; height:auto; max-height:82vh; max-width:100%; width:auto; }.photo-lightbox p { background:var(--paper); font-family:Georgia,serif; font-size:1rem; font-style:italic; line-height:1.35; margin:0; padding:.7rem 3rem .8rem .9rem; }.photo-lightbox__close { align-items:center; background:var(--pink); border:2px solid var(--ink); cursor:pointer; display:flex; font-size:1.7rem; height:2.5rem; justify-content:center; line-height:1; padding:0; position:absolute; right:.55rem; top:.55rem; width:2.5rem; }
@media (max-width:720px) { .chapter-guest { margin-left:0; padding-left:1rem; }.article-photo,.article-illustration { margin-left:0; margin-right:0; max-width:none; }.article-photo--portrait { max-width:none; }.photo-lightbox { max-width:94vw; }.photo-lightbox p { font-size:.93rem; } }

nav a:first-child::after { background:var(--sun); border:1.5px solid var(--ink); content:'← főoldal'; display:inline-block; padding:.32rem .5rem; }