/*
Theme Name: Красота Рыбинска
Theme URI: https://neohelp.ru
Author: Анатолий Михаленко
Description: Тёмная фотогалерея города Рыбинска и соседних мест. Фотографии подгоняются под экран сами, подписи с датой и временем берутся из EXIF. Разделы — записи типа «Галерея».
Version: 1.0.1
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: krasota
*/

:root{
  --bg:#121417; --bg2:#1A1D21; --line:#262A30; --line2:#2A2E34;
  --ink:#ECE8E0; --muted:#A9A397; --muted2:#8A8478;
  --gold:#E2B65A; --gold2:#F3CF83; --goldink:#16181B;
  --maxw:1320px;
  --serif:'Prata',Georgia,serif;
  --sans:'Golos Text',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.55}
img{max-width:100%;height:auto;display:block}
a{color:var(--gold);text-decoration:none}
a:hover{color:var(--gold2)}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.1;margin:0}
button{font:inherit}
.container{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Header */
.site-header{position:sticky;top:0;z-index:20;background:rgba(18,20,23,.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--line2)}
.site-header .bar{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;min-height:72px}
.brand{display:flex;align-items:center;gap:12px;color:var(--ink)}
.brand .crest{width:38px;height:38px;border-radius:50%;object-fit:cover;border:1px solid var(--gold);background:#2B3A4F;display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--gold)}
.brand .name{font-family:var(--serif);font-size:22px}
.nav{display:flex;flex-wrap:wrap;gap:4px;flex:1 1 auto}
.nav a{padding:12px 16px;border-radius:999px;color:var(--muted);font-weight:500}
.nav a:hover{color:var(--ink);background:#22262C}
.nav a.current{color:var(--ink);background:#22262C}
.nav-toggle{display:none;background:transparent;border:1px solid #3A3F47;color:var(--ink);height:44px;padding:0 14px;border-radius:999px}

/* Hero */
.hero{position:relative;height:min(640px,70vh);min-height:420px;background:#33465A;overflow:hidden}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero .shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(18,20,23,.95),rgba(18,20,23,0) 60%)}
.hero .inner{position:absolute;left:0;right:0;bottom:0;padding-bottom:52px}
.hero .tag{display:inline-block;padding:6px 12px;border-radius:999px;background:rgba(226,182,90,.16);color:var(--gold);font-size:14px;font-weight:600}
.hero h1{font-size:clamp(34px,6vw,64px);max-width:820px;margin:14px 0 10px}
.hero .where{display:flex;align-items:center;gap:8px;color:#C9C4BA;font-size:17px;margin:0}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.btn{height:52px;padding:0 24px;border-radius:999px;display:inline-flex;align-items:center;font-weight:600;border:1px solid transparent}
.btn-primary{background:var(--gold);color:var(--goldink)}
.btn-primary:hover{background:var(--gold2);color:var(--goldink)}
.btn-ghost{border-color:#5A6068;color:var(--ink);font-weight:500}
.btn-ghost:hover{color:var(--ink);border-color:var(--ink)}

/* Sections */
main{display:block}
.section{padding-top:72px}
.section .head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:26px}
.section h2{font-size:clamp(28px,4vw,40px)}
.section .sub{color:var(--muted);margin:6px 0 0}

/* Card grid */
.grid{display:grid;gap:24px}
.grid.cards{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.card{display:flex;flex-direction:column;gap:14px;background:var(--bg2);border:1px solid var(--line);border-radius:16px;overflow:hidden;color:var(--ink)}
.card .cover{aspect-ratio:4/3;background:#2B333B;object-fit:cover;width:100%}
.card .body{padding:0 20px 20px;display:flex;flex-direction:column;gap:6px}
.card .row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.card .t{font-size:20px;font-weight:600}
.card .count{color:var(--muted);font-size:14px;white-space:nowrap}
.card .hint{color:var(--muted);font-size:15px}

/* Collection tiles */
.tiles{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.tile{position:relative;height:340px;border-radius:16px;overflow:hidden;display:flex;align-items:flex-end;color:var(--ink);background:#1C2335}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tile .cap{position:relative;padding:24px;width:100%;display:flex;flex-direction:column;gap:6px;background:linear-gradient(to top,rgba(0,0,0,.78),rgba(0,0,0,0))}
.tile .cap .tt{font-family:var(--serif);font-size:28px}
.tile .cap .ss{color:#D8D2C6}

/* Map block */
.mapblock{display:flex;flex-wrap:wrap;gap:32px;align-items:stretch;background:var(--bg2);border:1px solid var(--line);border-radius:20px;padding:32px}
.mapblock .txt{flex:1 1 320px;display:flex;flex-direction:column;gap:16px;justify-content:center}
.mapblock .canvas{flex:2 1 480px;min-height:340px;border-radius:14px;background:#20262D;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;color:#6F7680;font-size:14px;text-align:center;padding:16px}

/* Breadcrumb */
.crumb{display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:15px;padding-top:28px}
.crumb .sep{opacity:.6}
.crumb .here{color:var(--ink)}

/* Gallery page header */
.gal-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px;margin:22px 0 24px}
.gal-head h1{font-size:clamp(34px,5vw,52px)}
.gal-head .sub{color:var(--muted);margin:10px 0 0}

/* Filters */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.chip{height:44px;padding:0 18px;border-radius:999px;border:1px solid #3A3F47;background:transparent;color:var(--ink);cursor:pointer}
.chip.on{background:var(--gold);color:var(--goldink);border-color:var(--gold);font-weight:600}

/* Photo grid */
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:28px 24px}
.photo{display:flex;flex-direction:column;gap:12px;color:var(--ink);text-align:left;background:none;border:0;padding:0;cursor:zoom-in}
.photo .pic{aspect-ratio:3/2;border-radius:12px;overflow:hidden;background:var(--bg2)}
.photo .pic img{width:100%;height:100%;object-fit:cover}
.photo .place{font-size:17px;font-weight:600}
.photo .addr{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:14px}
.photo .date{color:var(--muted2);font-size:13px}
.photo[hidden]{display:none}

/* Lightbox */
.lb{position:fixed;inset:0;z-index:60;background:#0C0D0F;display:none;flex-direction:column}
.lb.open{display:flex}
.lb-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:12px 24px;border-bottom:1px solid #1F2226}
.lb-top .count{color:var(--muted)}
.lb-close{height:44px;padding:0 16px;border-radius:999px;border:1px solid #3A3F47;background:transparent;color:var(--ink);cursor:pointer}
.lb-main{flex:1 1 auto;display:flex;flex-wrap:wrap;min-height:0}
.lb-stage{flex:999 1 640px;min-width:0;position:relative;display:flex;align-items:center;justify-content:center;padding:24px 76px;min-height:52vh}
.lb-stage img{max-width:100%;max-height:72vh;object-fit:contain;border-radius:4px}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:60px;height:60px;border-radius:50%;border:0;background:rgba(236,232,224,.12);color:#fff;font-size:26px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.lb-nav:hover{background:rgba(236,232,224,.22)}
.lb-prev{left:14px}.lb-next{right:14px}
.lb-side{flex:1 1 320px;padding:28px;border-left:1px solid #1F2226;background:#121417;display:flex;flex-direction:column;gap:16px}
.lb-side h2{font-size:28px}
.lb-side .meta{display:flex;flex-direction:column;gap:10px;color:var(--muted);font-size:16px}
.lb-thumbs{display:flex;gap:8px;padding:12px 24px;overflow-x:auto;border-top:1px solid #1F2226}
.lb-thumbs img{width:96px;height:64px;object-fit:cover;border-radius:6px;cursor:pointer;opacity:.55;flex:none}
.lb-thumbs img.on{opacity:1;box-shadow:0 0 0 3px var(--gold)}

/* Footer */
.site-footer{margin-top:96px;border-top:1px solid var(--line2)}
.site-footer .inner{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;padding:40px 0;color:var(--muted)}
.site-footer .fname{font-family:var(--serif);font-size:20px;color:var(--ink)}

/* Load more / pagination */
.more{display:flex;justify-content:center;padding-top:16px}
.pager{display:flex;gap:8px;justify-content:center;padding-top:24px}
.pager a,.pager span{padding:10px 16px;border-radius:999px;border:1px solid #3A3F47;color:var(--ink)}
.pager .current{background:var(--gold);color:var(--goldink);border-color:var(--gold)}

/* Simple content pages */
.page-body{padding-top:40px;max-width:760px}
.page-body h1{font-size:clamp(32px,5vw,48px);margin-bottom:18px}
.page-body p{color:#D2CCC0}

/* Responsive */
@media (max-width:760px){
  body{font-size:16px}
  .nav{display:none;width:100%;flex-direction:column}
  .nav.show{display:flex}
  .nav-toggle{display:inline-flex;align-items:center}
  .lb-stage{padding:16px 54px}
  .lb-side{border-left:0;border-top:1px solid #1F2226}
}