/* B1 힙합클럽 - B1 Hip-hop Club Theme */
/* Class prefix: b1- */

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

.b1-body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:#1a1508;
  color:#e0e0e0;
  line-height:1.7;
  overflow-x:hidden;
}

/* Hero — thumbnail above title, centered */
.b1-hero{
  position:relative;
  padding:5rem 1.5rem 3rem;
  background:linear-gradient(135deg,#1a1508 0%,#151207 50%,#1a1508 100%);
  overflow:hidden;
}
.b1-hero-overlay{
  position:absolute;inset:0;
  background:repeating-linear-gradient(90deg,transparent,transparent 60px,rgba(255,193,7,0.03) 60px,rgba(255,193,7,0.03) 61px);
}
.b1-hero-content{
  position:relative;z-index:2;
  max-width:760px;margin:0 auto;
  text-align:center;
}

/* Thumbnail image at top */
.b1-thumb{margin-bottom:2rem}
.b1-thumb img{
  width:100%;max-width:600px;height:auto;
  border-radius:16px;
  border:1px solid rgba(255,193,7,0.2);
  box-shadow:0 8px 32px rgba(0,0,0,0.4);
}

/* H1 = store name */
.b1-title{
  font-size:clamp(2rem,6vw,3.2rem);font-weight:900;color:#fff;
  line-height:1.25;margin-bottom:1rem;
  text-shadow:0 0 40px rgba(255,193,7,0.3);
}

/* Meta row: badge + region + updated */
.b1-meta-row{
  display:flex;align-items:center;justify-content:center;
  gap:0.8rem;flex-wrap:wrap;margin-bottom:1.5rem;
}
.b1-badge{
  display:inline-block;background:rgba(255,193,7,0.15);
  border:1px solid #ffc107;color:#ffc107;
  padding:0.3rem 1rem;border-radius:2rem;
  font-size:0.8rem;letter-spacing:0.12em;font-weight:600;
}
.b1-meta-sep{font-size:0.9rem;color:#9898ac}

/* CTA row: map + browse */
.b1-cta-row{
  display:flex;align-items:center;justify-content:center;
  gap:0.8rem;flex-wrap:wrap;margin-bottom:2rem;
}
.b1-map-btn,.b1-browse-btn{
  display:inline-block;padding:0.7rem 1.5rem;border-radius:50px;
  text-decoration:none;font-weight:700;font-size:0.95rem;transition:all 0.3s;
}
.b1-map-btn{
  background:#ffc107;color:#000;
  box-shadow:0 0 20px rgba(255,193,7,0.3);
}
.b1-map-btn:hover{box-shadow:0 0 40px rgba(255,193,7,0.5);transform:translateY(-2px)}
.b1-browse-btn{
  background:rgba(255,255,255,0.08);color:#e0e0e0;
  border:1px solid rgba(255,255,255,0.15);
}
.b1-browse-btn:hover{background:rgba(255,255,255,0.12);transform:translateY(-2px)}

/* Intro hook block */
.b1-intro-hook{
  max-width:600px;margin:0 auto;
  text-align:center;
}
.b1-intro-hook p{font-size:1.2rem;color:#d0d0e0;line-height:1.8;margin:0}
.b1-intro-sub{font-size:0.95rem!important;color:#9898ac!important;margin-top:0.5rem!important}

/* Sections — centered reading width */
.b1-section{padding:4rem 1.5rem}
.b1-section-dark{background:#151207}
.b1-container{max-width:760px;margin:0 auto}

.b1-heading{
  font-size:clamp(1.5rem,4vw,2.2rem);font-weight:800;color:#ffc107;
  margin-bottom:2rem;text-align:left;
}
.b1-heading-light{color:#ffc107}
.b1-heading-sub{
  display:block;font-size:0.85rem;color:#888;
  font-weight:400;margin-top:0.3rem;letter-spacing:0.05em;
}

/* AI Summary list */
.b1-summary-list{
  list-style:none;padding:0;
  border-left:3px solid #ffc107;padding-left:1.2rem;
}
.b1-summary-list li{
  padding:0.5rem 0;color:#c0c0d0;font-size:0.95rem;
  border-bottom:1px solid rgba(255,255,255,0.05);
}
.b1-summary-list li:last-child{border-bottom:none}

/* Intro body */
.b1-intro-body p{
  font-size:1.05rem;color:#c8c8d8;line-height:1.9;
  margin-bottom:1.2rem;
}

/* Story body paragraphs */
.b1-story-body p{
  font-size:1.02rem;color:#c0c0d0;line-height:1.85;
  margin-bottom:1.1rem;
}

/* Quick plan ordered list */
.b1-plan-list{
  list-style:none;padding:0;counter-reset:plan;
}
.b1-plan-list li{
  padding:1rem 1.2rem 1rem 3.5rem;
  position:relative;margin-bottom:0.8rem;
  background:rgba(255,193,7,0.05);
  border:1px solid #333;border-radius:12px;
  color:#c0c0d0;font-size:0.95rem;line-height:1.7;
  counter-increment:plan;
}
.b1-plan-list li::before{
  content:counter(plan);position:absolute;left:1.2rem;top:1rem;
  font-size:1.1rem;font-weight:800;color:#ffc107;opacity:0.7;
}

/* Conclusion body */
.b1-conclusion-body p{
  font-size:1.05rem;color:#c8c8d8;line-height:1.9;
  max-width:600px;
}

.b1-card-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}
.b1-card-grid-2{grid-template-columns:repeat(2,1fr)}
.b1-card{
  background:rgba(255,193,7,0.05);border:1px solid #333;
  border-radius:16px;padding:1.8rem;transition:all 0.3s;
}
.b1-card:hover{
  border-color:#ffc107;transform:translateY(-4px);
  box-shadow:0 8px 30px rgba(255,193,7,0.15);
}
.b1-card-glow{
  background:linear-gradient(145deg,#151207,rgba(255,193,7,0.08));
  border-color:rgba(255,193,7,0.2);
}
.b1-card-number{font-size:1.8rem;font-weight:900;color:#ffc107;opacity:0.6;margin-bottom:0.4rem}
.b1-card-title{font-size:1.15rem;font-weight:700;color:#fff;margin-bottom:0.7rem}
.b1-card-text{font-size:0.95rem;color:#b0b0c0;line-height:1.7}

.b1-list{list-style:none;padding:0}
.b1-list li{padding:0.6rem 0;border-bottom:1px solid #333;color:#c0c0d0;font-size:0.95rem}
.b1-list li:last-child{border-bottom:none}

.b1-faq-list{max-width:760px;margin:0 auto}
.b1-faq-item{border-bottom:1px solid #333}
.b1-faq-q{
  width:100%;background:none;border:none;text-align:left;
  padding:1.2rem 0;color:#fff;font-size:1.05rem;font-weight:600;
  cursor:pointer;display:flex;justify-content:space-between;
  align-items:center;font-family:inherit;
}
.b1-faq-q::after{content:'+';font-size:1.4rem;color:#ffc107;transition:transform 0.3s}
.b1-faq-q[aria-expanded="true"]::after{content:'-'}
.b1-faq-a{max-height:0;overflow:hidden;transition:max-height 0.4s ease}
.b1-faq-a p{padding:0 0 1.2rem;color:#a0a0b0;font-size:0.95rem;line-height:1.7}

/* Final CTA section — repeated CTAs */
.b1-final{text-align:center;padding:4rem 1.5rem;background:linear-gradient(180deg,#1a1508,#151207)}
.b1-final-text{font-size:1.3rem;color:#d0d0e0;margin-bottom:2rem;line-height:1.8;max-width:600px;margin-left:auto;margin-right:auto}
.b1-final-ctas{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap}
.b1-final-btn{
  display:inline-block;background:#ffc107;color:#000;
  padding:1rem 2.5rem;border-radius:50px;text-decoration:none;
  font-weight:700;font-size:1.05rem;
  box-shadow:0 0 30px rgba(255,193,7,0.4);transition:all 0.3s;
}
.b1-final-btn:hover{box-shadow:0 0 50px rgba(255,193,7,0.6);transform:translateY(-2px)}
.b1-final-map{
  display:inline-block;padding:1rem 2rem;border-radius:50px;
  text-decoration:none;font-weight:700;font-size:0.95rem;
  background:rgba(255,255,255,0.08);color:#e0e0e0;
  border:1px solid rgba(255,255,255,0.15);transition:all 0.3s;
}
.b1-final-map:hover{background:rgba(255,255,255,0.12);transform:translateY(-2px)}

.b1-footer{text-align:center;padding:2rem 1.5rem 6rem;color:#666;font-size:0.8rem;background:#1a1508}

.b1-sticky{
  position:fixed;bottom:0;left:0;right:0;z-index:999;
  padding:0.8rem 1rem;background:rgba(26,21,8,0.95);
  backdrop-filter:blur(10px);border-top:1px solid rgba(255,193,7,0.3);
}
.b1-sticky-btn{
  display:block;text-align:center;background:#ffc107;color:#000;
  padding:0.9rem;border-radius:12px;text-decoration:none;
  font-weight:700;font-size:1rem;max-width:500px;margin:0 auto;
}

@media(max-width:768px){
  .b1-card-grid,.b1-card-grid-2{grid-template-columns:1fr}
  .b1-section{padding:3rem 1rem}
  .b1-hero{padding:3rem 1rem 2rem}
  .b1-cta-row{flex-direction:column}
  .b1-map-btn,.b1-browse-btn{width:100%;text-align:center}
}
