@import url('https://fonts.googleapis.com/css2?family=Georama:wght@400;600;800&display=swap');
:root{
  --bg:#0b0b0b; --panel:#141414; --panel2:#1b1b1b; --text:#f2f2f2; --muted:#bdbdbd;
  --accent:#ffd400; --accentText:#111;
  --container:1440px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:'Georama',system-ui,Segoe UI,Roboto,Arial,sans-serif}
a{color:var(--accent);text-decoration:none}
.container{max-width:var(--container);margin:0 auto;padding:0 16px}
.header{background:#000; border-bottom:1px solid #222;}
.header .row{display:flex;align-items:center;gap:12px;padding:12px 0}
.logo{display:flex;align-items:center;gap:10px}
.logo img{width:70px;height:70px;border-radius:12px;object-fit:cover}
.brand{font-weight:800;letter-spacing:0.5px}
.search{flex:1;display:flex;gap:8px}
.search input{flex:1;padding:10px;border-radius:10px;border:1px solid #333;background:#0e0e0e;color:var(--text)}
.btn{background:var(--accent);color:var(--accentText);border:none;padding:10px 14px;border-radius:12px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.btn.secondary{background:#2a2a2a;color:#fff;border:1px solid #3a3a3a}
.banner{background:#111}
.banner .frame{max-width:var(--container);height:550px;margin:0 auto;position:relative;overflow:hidden;border-radius:14px}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .8s}
.slide.active{opacity:1}
.slide img{width:100%;height:100%;object-fit:cover}
.section-title{padding:18px 0 8px;margin:0 0 8px;border-bottom:1px solid #1f1f1f;color:var(--accent)}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{background:var(--panel);border:1px solid #222;border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.card img.cover{width:100%;height:220px;object-fit:cover}
.meta{padding:12px 12px 4px;color:var(--muted);font-size:14px}
.card h3{margin:0;padding:0 12px 8px}
.actions{display:flex;gap:8px;align-items:center;padding:8px 12px 16px}
.actions .share{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border-radius:10px;background:var(--panel2);border:1px solid #2a2a2a;cursor:pointer}
.actions .share img.icon{width:18px;height:18px}
.album-photos{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.album-photos img{width:100%;height:200px;object-fit:cover;border-radius:12px;border:1px solid #2a2a2a}
.footer{background:#000;border-top:1px solid #222;margin-top:24px}
.footer .row{padding:18px 0;font-size:14px;color:#bbb;display:flex;justify-content:center}
@media(max-width:1100px){.grid{grid-template-columns:repeat(3,1fr)}.album-photos{grid-template-columns:repeat(3,1fr)}}
@media(max-width:800px){.grid{grid-template-columns:repeat(2,1fr)}.album-photos{grid-template-columns:repeat(2,1fr)}.header .row{flex-wrap:wrap}}

/* Lightbox */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.9);display:none;align-items:center;justify-content:center;z-index:9999;padding:20px}
.lightbox img{max-width:95vw;max-height:90vh;border-radius:10px;border:2px solid #333}
.lightbox.show{display:flex}
.lightbox .close{position:absolute;top:16px;right:16px}
.photo-card{position:relative;background:var(--panel);border:1px solid #222;border-radius:12px;padding:10px}
.photo-card img{width:100%;height:200px;object-fit:cover;border-radius:8px;cursor:pointer}
.photo-actions{display:flex;gap:8px;padding-top:8px}
.photo-actions .share{display:inline-flex;align-items:center;gap:6px;padding:6px 8px;border-radius:8px;background:var(--panel2);border:1px solid #2a2a2a;cursor:pointer}
.photo-actions img.icon{width:18px;height:18px}