/*
Theme Name: MC Northern Bohemia
Theme URI: https://mcnb.cz
Author: MC Northern Bohemia
Description: Vlastní šablona pro prezentační web a deník vyjížděk motorkářského klubu MC Northern Bohemia.
Version: 1.0
Text Domain: mcnb
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root{
  --black:#000000;
  --near-black:#0a0a0a;
  --dark:#151515;
  --white:#ffffff;
  --off-white:#f5f5f2;
  --grey:#98978f;
  --grey-dim:#68675f;
  --line:rgba(255,255,255,0.12);
  --gold:#c9a05a;
}

*{box-sizing:border-box;margin:0;padding:0;}

html{scroll-behavior:smooth;}

body{
  background:var(--black);
  color:var(--off-white);
  font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  line-height:1.5;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,.brand{
  font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight:600;
  letter-spacing:-0.02em;
}

a{color:inherit;text-decoration:none;}

img{max-width:100%;display:block;}

.wrap{max-width:1120px;margin:0 auto;padding:0 32px;}

/* header */
header{
  position:fixed;top:0;left:0;right:0;z-index:50;
  background:linear-gradient(to bottom, rgba(0,0,0,0.55), transparent);
  transition:background .3s ease;
}
.nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 32px;
}
.brand-group{display:flex;align-items:center;gap:10px;}
.brand-group img{height:30px;width:auto;}
.brand{font-size:0.95rem;letter-spacing:-0.01em;}
.brand small{display:block;font-family:'Inter',sans-serif;font-weight:400;text-transform:none;font-size:0.7rem;color:var(--grey);letter-spacing:0;}

nav.links{display:flex;gap:36px;}
nav.links ul{display:flex;gap:36px;list-style:none;}
nav.links a{
  font-size:0.86rem;
  font-weight:500;
  color:var(--off-white);
  opacity:0.85;
}
nav.links a:hover{opacity:1;}

.menu-toggle{display:none;background:none;border:1px solid var(--line);color:var(--white);padding:8px 14px;border-radius:999px;font-size:.8rem;}

/* hero */
.hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:flex-end;
  padding:0 0 100px;
  overflow:hidden;
  background:
    linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.15) 45%, rgba(10,8,4,0.35) 100%),
    radial-gradient(ellipse at 60% 30%, rgba(90,60,20,0.25), transparent 60%),
    var(--hero-photo, none) center 40%/cover no-repeat,
    linear-gradient(160deg, #1a1712 0%, #050504 60%);
}
.hero-inner{position:relative;z-index:2;width:100%;}
.hero .eyebrow{
  display:block;font-size:0.82rem;font-weight:500;letter-spacing:0.02em;
  color:var(--gold);margin-bottom:18px;
}
.hero h1{
  font-size:clamp(2.6rem, 6vw, 4.6rem);
  line-height:1.02;
  margin-bottom:20px;
  max-width:820px;
}
.hero p.tag{
  color:var(--off-white);
  opacity:0.82;
  font-size:1.15rem;
  font-weight:300;
  max-width:480px;
  margin:0 0 34px;
  line-height:1.55;
}
.btn-row{display:flex;gap:14px;flex-wrap:wrap;}
.btn{
  display:inline-block;
  padding:14px 26px;
  font-size:0.88rem;
  font-weight:500;
  border-radius:999px;
  border:1px solid transparent;
  transition:opacity .2s ease, background .2s ease;
}
.btn.solid{background:var(--white);color:#111;}
.btn.solid:hover{opacity:0.85;}
.btn.outline{color:var(--white);border-color:rgba(255,255,255,0.4);}
.btn.outline:hover{border-color:var(--white);}

/* sections */
section{padding:140px 32px;}
section.tight{padding:100px 32px;}
.section-head{margin-bottom:56px;max-width:640px;}
.section-head .eyebrow{
  display:block;font-size:0.82rem;font-weight:500;color:var(--gold);margin-bottom:14px;
}
.section-head h2{font-size:clamp(1.9rem,3.4vw,2.7rem);line-height:1.1;}

/* statement / about */
.statement{
  text-align:center;max-width:820px;margin:0 auto;
}
.statement .eyebrow{
  display:block;font-size:0.82rem;font-weight:500;color:var(--gold);margin-bottom:22px;
  text-align:center;
}
.statement h2{
  font-size:clamp(1.8rem, 4vw, 3rem);
  line-height:1.25;
  font-weight:500;
  letter-spacing:-0.01em;
  color:var(--white);
}
.statement h2 span{color:var(--grey-dim);}

.about-copy{max-width:680px;margin:44px auto 0;text-align:center;}
.about-copy p{color:var(--grey);font-size:1.05rem;font-weight:300;line-height:1.7;margin-bottom:18px;}

.stat-row{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:40px;margin-top:80px;max-width:760px;margin-left:auto;margin-right:auto;
  border-top:1px solid var(--line);padding-top:40px;
}
.stat{text-align:center;}
.stat b{display:block;font-size:2.6rem;font-weight:600;letter-spacing:-0.02em;}
.stat span{font-size:0.8rem;color:var(--grey);font-weight:400;}

/* members - minimal */
.member-row{
  display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:80px;max-width:760px;margin-left:auto;margin-right:auto;
}
.member-card{border-top:1px solid var(--line);padding-top:22px;}
.member-card h4{font-size:1.15rem;margin-bottom:6px;color:var(--white);}
.member-card .role{color:var(--gold);font-size:0.78rem;font-weight:500;margin-bottom:12px;display:block;}
.member-card p{font-size:0.92rem;color:var(--grey);font-weight:300;line-height:1.6;}

/* blog list - editorial, no cards */
.post-list{max-width:820px;margin:0 auto;}
.post-row{
  display:grid;grid-template-columns:220px 1fr;gap:36px;
  padding:40px 0;border-top:1px solid var(--line);align-items:center;
}
.post-row:last-child{border-bottom:1px solid var(--line);}
.post-row .thumb{
  aspect-ratio:4/3;border-radius:14px;overflow:hidden;
  background:linear-gradient(135deg,#232320,#08080a);
  display:flex;align-items:center;justify-content:center;
  color:var(--grey-dim);font-size:0.72rem;font-weight:500;
}
.post-row .thumb img{width:100%;height:100%;object-fit:cover;}
.post-row .meta{font-size:0.78rem;color:var(--gold);font-weight:500;margin-bottom:10px;}
.post-row h3{font-size:1.35rem;font-weight:500;color:var(--white);margin-bottom:10px;letter-spacing:-0.01em;}
.post-row p{font-size:0.92rem;color:var(--grey);font-weight:300;line-height:1.6;margin-bottom:12px;}
.post-row .readmore{font-size:0.82rem;font-weight:500;color:var(--white);}

.view-all{display:inline-block;margin-top:48px;}
.view-all-wrap{text-align:center;}

/* gallery - big format */
.gallery-grid{
  display:grid;grid-template-columns:1.4fr 1fr;gap:16px;max-width:1120px;margin:0 auto;
}
.gallery-grid .ph{
  border-radius:16px;background:linear-gradient(135deg,#1c1c19,#08080a);
  display:flex;align-items:center;justify-content:center;color:var(--grey-dim);
  font-size:0.78rem;font-weight:500;min-height:260px;overflow:hidden;
}
.gallery-grid .ph img{width:100%;height:100%;object-fit:cover;}
.gallery-grid .ph.tall{grid-row:span 2;min-height:540px;}
.gallery-side{display:grid;gap:16px;}

/* contact */
.contact-box{text-align:center;max-width:600px;margin:0 auto;}
.contact-box h2{font-size:clamp(1.8rem,3.6vw,2.6rem);margin-bottom:16px;font-weight:500;}
.contact-box p{color:var(--grey);margin-bottom:32px;font-weight:300;font-size:1.05rem;}

/* footer */
footer{padding:60px 32px 40px;text-align:center;border-top:1px solid var(--line);}
footer .brand-group{justify-content:center;margin-bottom:18px;}
footer p{color:var(--grey-dim);font-size:0.8rem;}
footer .foot-links{margin-top:14px;display:flex;gap:24px;justify-content:center;}
footer .foot-links a{font-size:0.8rem;color:var(--grey);}
footer .foot-links a:hover{color:var(--white);}

/* single post page */
.post-hero{
  padding:180px 32px 70px;text-align:left;max-width:760px;margin:0 auto;
}
.post-hero .eyebrow{display:block;font-size:0.82rem;font-weight:500;color:var(--gold);margin-bottom:18px;}
.post-hero h1{font-size:clamp(2rem,4.4vw,3.1rem);line-height:1.12;margin-bottom:20px;font-weight:600;}
.post-hero .meta{color:var(--grey);font-size:0.92rem;font-weight:300;}
.post-body{max-width:700px;margin:0 auto;padding:0 32px 100px;}
.post-body p{margin-bottom:22px;font-size:1.08rem;font-weight:300;color:var(--off-white);line-height:1.75;}
.post-body .lead{font-size:1.25rem;color:var(--white);font-weight:400;}
.post-body img{border-radius:16px;margin:32px 0;}
.rating-box{
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:36px 0;margin:52px 0;
  display:grid;grid-template-columns:repeat(2,1fr);gap:18px 32px;
}
.rating-box .r{display:flex;justify-content:space-between;font-size:0.88rem;font-weight:500;}
.rating-box .r span:first-child{color:var(--grey);font-weight:400;}
.rating-box .stars{color:var(--gold);letter-spacing:2px;}
.rating-box .stars .off{color:var(--line);}
.pull{
  border-left:2px solid var(--gold);padding-left:24px;margin:44px 0;
  font-size:1.2rem;font-weight:300;color:var(--white);line-height:1.6;
}
.back-link{display:inline-block;margin-top:12px;font-size:0.86rem;font-weight:500;color:var(--grey);}
.back-link:hover{color:var(--white);}

/* empty state */
.empty-state{text-align:center;color:var(--grey);font-weight:300;padding:40px 0;}

@media (max-width:820px){
  .member-row{grid-template-columns:1fr;gap:32px;}
  .stat-row{grid-template-columns:repeat(3,1fr);gap:20px;}
  .post-row{grid-template-columns:1fr;}
  .gallery-grid{grid-template-columns:1fr;}
  .gallery-grid .ph.tall{grid-row:auto;min-height:260px;}
  nav.links{display:none;}
  .menu-toggle{display:inline-block;}
  section{padding:90px 24px;}
}