*{box-sizing:border-box}
:root{
  --bg: #f6f5f4;
  --text:#243b53;
  --accent:#111827;
  --soft:#e5e7eb;
}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Arial}
.wrap{max-width:1100px;margin:0 auto;padding:0 16px}
.topbar{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.7);backdrop-filter:blur(10px);border-bottom:1px solid #e5e7eb}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;padding:12px 16px}
.brand{font-weight:700}
.nav a{margin-left:14px;text-decoration:none;color:var(--text);opacity:.8}
.nav a:hover{opacity:1}

.hero{background:linear-gradient(180deg,#fafaf9 0%,#ffffff 100%);padding:68px 0 60px}
.hero-inner{text-align:center}
.title{font-size:40px;margin:0 0 8px}
.subtitle{margin:0 0 22px;opacity:.8}
.cta{display:inline-block;background:var(--accent);color:white;padding:10px 16px;border-radius:12px;text-decoration:none;box-shadow:0 6px 16px rgba(17,24,39,.15)}

.section{padding:28px 0 40px}
.section-title{margin:0 0 12px}

.grid{columns:1 180px;column-gap:12px}
.photo{break-inside:avoid;margin:0 0 12px;position:relative;overflow:hidden;border-radius:14px;background:#fff;box-shadow:0 8px 24px rgba(0,0,0,.06)}
.photo img{width:100%;height:auto;display:block;transform:scale(1.03);opacity:0;transition:transform .5s ease, opacity .5s ease}
.photo.show img{opacity:1;transform:scale(1)}
.photo:hover img{transform:scale(1.02)}

.footer{text-align:center;font-size:12px;opacity:.7;padding:30px}

.gate{position:fixed;inset:0;background:linear-gradient(135deg,#ffd9ea 0%,#fff 60%);display:flex;align-items:center;justify-content:center;z-index:100}
.gate-card{width:min(92vw,440px);background:#fff;padding:24px;border-radius:18px;box-shadow:0 20px 60px rgba(0,0,0,.12);text-align:center;border:1px solid #e5e7eb}
.gate h1{margin:0 0 6px}
.gate p{margin:0 0 12px}
.gate input{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #e6d6df}
.gate button{margin-top:10px;width:100%;padding:12px 14px;border-radius:12px;border:none;background:var(--accent);color:#fff;font-weight:600;cursor:pointer}
.gate .hint{opacity:.6;font-size:12px;margin-top:8px}
.shake{animation:shake .35s ease}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}

.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;z-index:90}
.lightbox.hidden{display:none}
.lightbox img{max-width:90vw;max-height:85vh;border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.lb-btn{position:fixed;background:rgba(255,255,255,.9);border:none;border-radius:50px;padding:10px 14px;cursor:pointer}
.lb-prev{left:16px} .lb-next{right:16px} .lb-close{top:16px;right:16px}

.places{padding-top:10px;padding-bottom:10px}
.chips{display:flex;gap:10px;flex-wrap:wrap}
.chip{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #e5e7eb;border-radius:999px;padding:8px 12px;box-shadow:0 6px 16px rgba(0,0,0,.05)}
.chip-emoji{font-size:16px}
.chip-text{font-size:14px;font-weight:600;color:#111827}

.audio-wrap{max-width:560px;margin:8px auto 0;background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:10px 12px;box-shadow:0 6px 16px rgba(0,0,0,.05)}
.song-title{font-size:14px;font-weight:600;color:#111827;margin:2px 0 8px;opacity:.9}
.audio-wrap audio{width:100%;display:block}