*{box-sizing:border-box}
:root{--gold:#e7b84c;--gold2:#ffda76;--text:#f5f1e8;--muted:#a9a7a0}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at 50% 0%,rgba(210,155,45,.18),transparent 32%),linear-gradient(180deg,#07080b,#030405);color:var(--text);font-family:Georgia,"Times New Roman",serif}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.16;background-image:radial-gradient(#fff .5px,transparent .5px);background-size:4px 4px}
.page{max-width:1120px;margin:auto;padding:22px 18px 50px}
.hero{position:relative;min-height:820px;overflow:hidden;border:1px solid rgba(231,184,76,.35);border-radius:28px;background:#08090c;box-shadow:0 25px 90px rgba(0,0,0,.7),0 0 70px rgba(231,184,76,.08)}
.hero-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;filter:saturate(.9) contrast(1.05);opacity:.82;animation:slowZoom 12s ease-in-out infinite alternate}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(4,5,7,.18) 35%,#050608 82%,#050608),linear-gradient(90deg,rgba(0,0,0,.65),transparent 60%)}
.hero-content{position:relative;z-index:2;min-height:820px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;text-align:center;padding:40px 25px 62px}
.kicker{color:var(--gold2);font:700 12px/1.2 Arial,sans-serif;letter-spacing:5px;margin-bottom:14px}
h1{margin:0;font-size:clamp(55px,9vw,100px);line-height:.86;letter-spacing:2px;text-shadow:0 8px 35px #000}
h1 span{color:var(--gold)}
.subtitle{max-width:720px;margin:25px auto 20px;color:#e7e3da;font:17px/1.75 Arial,sans-serif}
.cta{width:min(680px,100%);display:flex;justify-content:center;align-items:center;min-height:62px;padding:18px 28px;border-radius:13px;background:linear-gradient(135deg,#b97c18,#ffda70 48%,#c58a22);border:1px solid #ffe18a;color:#171208;text-decoration:none;font:900 20px Arial,sans-serif;letter-spacing:1.5px;box-shadow:0 8px 35px rgba(231,184,76,.4),inset 0 1px rgba(255,255,255,.5);animation:pulse 2.2s infinite;transition:.25s ease}
.cta:hover{transform:translateY(-4px);filter:brightness(1.08)}
.note{margin:12px 0 0;color:#888;font:11px/1.5 Arial,sans-serif}
.section{padding:72px 0 0}
.section-title{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:34px}
.section-title:before,.section-title:after{content:"";height:1px;width:120px;background:linear-gradient(90deg,transparent,var(--gold))}
.section-title:after{background:linear-gradient(90deg,var(--gold),transparent)}
.section-title h2{margin:0;color:var(--gold2);font-size:25px;letter-spacing:2px;text-align:center}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{min-height:215px;padding:28px 20px;text-align:center;border:1px solid rgba(231,184,76,.2);border-radius:18px;background:linear-gradient(145deg,rgba(22,23,29,.95),rgba(8,9,12,.95));transition:.25s ease}
.card:hover{transform:translateY(-8px);border-color:rgba(231,184,76,.65);box-shadow:0 18px 40px rgba(0,0,0,.35)}
.icon{font-size:42px;filter:drop-shadow(0 0 12px rgba(231,184,76,.4))}
.card h3{color:var(--gold);font-size:15px;letter-spacing:1px}
.card p{color:var(--muted);font:14px/1.7 Arial,sans-serif}
.bottom{margin-top:70px;padding:65px 20px;text-align:center;border-top:1px solid rgba(231,184,76,.25);border-bottom:1px solid rgba(231,184,76,.25);background:radial-gradient(circle,rgba(190,136,35,.13),transparent 65%)}
.bottom h2{font-size:clamp(30px,5vw,50px);margin:8px 0 14px}
.bottom p{max-width:650px;margin:0 auto 28px;color:#aaa;font:15px/1.7 Arial,sans-serif}
.bottom .cta{display:inline-flex;width:min(400px,100%)}
footer{padding:30px 0 0;text-align:center;color:#666;font:11px/1.6 Arial,sans-serif}
@keyframes pulse{0%,100%{box-shadow:0 8px 35px rgba(231,184,76,.35),0 0 0 0 rgba(231,184,76,.35)}50%{box-shadow:0 10px 45px rgba(231,184,76,.55),0 0 0 11px rgba(231,184,76,0)}}
@keyframes slowZoom{from{transform:scale(1)}to{transform:scale(1.035)}}
@media(max-width:850px){.cards{grid-template-columns:repeat(2,1fr)}.hero,.hero-content{min-height:730px}}
@media(max-width:560px){.page{padding:0 0 30px}.hero{border-radius:0 0 22px 22px}.hero-content{min-height:700px;padding:30px 16px 45px}h1{font-size:50px}.subtitle{font-size:14px}.cards{grid-template-columns:1fr}.section{padding:55px 16px 0}.section-title:before,.section-title:after{display:none}}

.reader-notification{
 position:fixed;top:18px;left:50%;z-index:9999;
 transform:translate(-50%,-150%);opacity:0;
 display:flex;align-items:center;gap:10px;
 max-width:calc(100% - 24px);padding:12px 18px;
 border:1px solid rgba(231,184,76,.42);border-radius:999px;
 background:rgba(9,10,13,.94);color:#e9e6de;
 box-shadow:0 12px 35px rgba(0,0,0,.55),0 0 25px rgba(231,184,76,.12);
 backdrop-filter:blur(12px);font:13px Arial,sans-serif;
 transition:transform .55s ease,opacity .55s ease;white-space:nowrap;
}
.reader-notification.show{transform:translate(-50%,0);opacity:1}
.reader-notification strong{color:#f0c65b}
.notif-dot{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:#6ee58a;box-shadow:0 0 12px #6ee58a}
@media(max-width:560px){.reader-notification{top:10px;white-space:normal;text-align:center;justify-content:center}}
