/*
Theme Name: Bohemios
Description: Afro-Latin Criollo entertainment theme for Bohemios Espectáculos y Eventos
Version: 2.0
Author: Jeff
*/

@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Nunito+Sans:wght@300;400;600;700;800&display=swap');

:root {
  --terracotta: #c45a3c;
  --terracotta-dark: #8b3a2a;
  --ochre: #d4a24e;
  --ochre-light: #e8c97a;
  --coffee: #2c1810;
  --coffee-light: #3d2518;
  --cream: #f5e6d0;
  --cream-dark: #d4c4a8;
  --charcoal: #1a1410;
  --amber: #e8912e;
  --wine: #6b2040;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior: smooth; }
body { font-family:'Nunito Sans',sans-serif; background:var(--charcoal); color:var(--cream); }

/* NAV */
.site-nav { position:fixed; top:0; width:100%; z-index:1000; padding:20px 40px; display:flex; justify-content:space-between; align-items:center; transition:all 0.3s; background:transparent; }
.site-nav.scrolled { background:rgba(44,24,16,0.95); backdrop-filter:blur(10px); padding:12px 40px; box-shadow:0 2px 20px rgba(0,0,0,0.4); }
.nav-logo { height:120px; transition:height 0.3s; border-radius:4px; }
.site-nav.scrolled .nav-logo { height:80px; }
.nav-links { display:flex; gap:30px; list-style:none; }
.nav-links a { color:var(--cream); text-decoration:none; font-size:0.85rem; letter-spacing:2px; text-transform:uppercase; font-weight:600; transition:color 0.3s; }
.nav-links a:hover { color:var(--ochre); }
.mobile-menu { display:none; background:none; border:none; color:var(--cream); font-size:1.5rem; cursor:pointer; }

/* HERO */
.hero { height:100vh; display:flex; align-items:center; justify-content:center; text-align:center; position:relative; overflow:hidden; }
.hero-bg { position:absolute; inset:0; background:linear-gradient(160deg, var(--coffee) 0%, var(--terracotta-dark) 40%, var(--wine) 70%, var(--charcoal) 100%); }
.hero-bg::before { content:''; position:absolute; inset:0; background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23d4a24e' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); }
.hero-bg::after { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at 20% 80%, rgba(196,90,60,0.3) 0%, transparent 50%), radial-gradient(ellipse at 80% 20%, rgba(212,162,78,0.2) 0%, transparent 50%); }
.hero-particles { position:absolute; inset:0; overflow:hidden; }
.hero-content { position:relative; z-index:2; max-width:850px; padding:0 20px; }
.hero-content h1 { font-family:'Libre Baskerville',serif; font-size:clamp(3rem,7vw,6rem); font-weight:700; color:var(--cream); margin-bottom:10px; text-shadow:0 4px 30px rgba(0,0,0,0.5); line-height:1.05; }
.hero-content h1 span { color:var(--ochre); font-style:italic; }
.hero-tagline { font-size:clamp(1rem,2vw,1.4rem); font-weight:300; letter-spacing:4px; text-transform:uppercase; margin-bottom:10px; color:var(--ochre-light); }
.hero-desc { font-size:clamp(0.95rem,1.5vw,1.15rem); font-weight:300; color:var(--cream-dark); margin-bottom:40px; max-width:600px; margin-left:auto; margin-right:auto; line-height:1.7; }
.hero-divider { display:flex; align-items:center; justify-content:center; gap:15px; margin:25px 0 30px; }
.hero-divider span { width:60px; height:1px; background:var(--ochre); }
.hero-divider i { color:var(--ochre); font-size:0.8rem; }
.hero-cta { display:inline-block; padding:16px 50px; background:var(--terracotta); color:var(--cream); text-decoration:none; text-transform:uppercase; letter-spacing:3px; font-size:0.85rem; font-weight:700; transition:all 0.4s; border-radius:4px; border:none; }
.hero-cta:hover { background:var(--ochre); color:var(--coffee); transform:translateY(-2px); box-shadow:0 8px 25px rgba(196,90,60,0.4); }

/* SECTIONS */
section { padding:100px 40px; }
.section-title { font-family:'Libre Baskerville',serif; font-size:clamp(2rem,4vw,3.2rem); color:var(--cream); text-align:center; margin-bottom:10px; }
.section-title span { color:var(--ochre); font-style:italic; }
.section-subtitle { text-align:center; font-weight:300; letter-spacing:2px; text-transform:uppercase; font-size:0.8rem; color:var(--ochre-light); margin-bottom:60px; }
.section-divider { display:flex; align-items:center; justify-content:center; gap:15px; margin:15px auto 40px; }
.section-divider span { width:40px; height:1px; background:var(--terracotta); }
.section-divider i { color:var(--terracotta); font-size:0.7rem; }

/* ABOUT */
.about { background:var(--coffee); position:relative; overflow:hidden; }
.about::before { content:''; position:absolute; top:-50px; right:-50px; width:300px; height:300px; border-radius:50%; background:radial-gradient(circle, rgba(196,90,60,0.1), transparent 70%); }
.about-grid { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }
.about-text p { line-height:1.9; font-weight:300; margin-bottom:20px; color:var(--cream-dark); font-size:0.95rem; }
.about-text strong { color:var(--ochre); font-weight:700; }
.about-highlight { background:var(--coffee-light); border-left:3px solid var(--terracotta); padding:20px 25px; border-radius:0 8px 8px 0; margin:25px 0; }
.about-highlight p { color:var(--cream) !important; font-style:italic; font-family:'Libre Baskerville',serif; margin:0 !important; }
.about-img { border-radius:12px; overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,0.5); position:relative; }
.about-img::after { content:''; position:absolute; inset:0; border:1px solid rgba(212,162,78,0.2); border-radius:12px; }
.about-img img { width:100%; display:block; }

/* SHOWS */
.shows { background:var(--charcoal); }
.shows-grid { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:25px; }
.show-card { background:var(--coffee); border-radius:12px; overflow:hidden; transition:transform 0.4s, box-shadow 0.4s; border:1px solid rgba(212,162,78,0.08); }
.show-card:hover { transform:translateY(-8px); box-shadow:0 15px 40px rgba(196,90,60,0.2); }
.show-card-img { height:180px; position:relative; overflow:hidden; }
.show-card-img::after { content:''; position:absolute; bottom:0; left:0; right:0; height:60%; background:linear-gradient(transparent, var(--coffee)); }
.show-card-body { padding:22px 25px 28px; }
.show-card-body h3 { font-family:'Libre Baskerville',serif; color:var(--ochre); font-size:1.25rem; margin-bottom:10px; }
.show-card-body p { font-weight:300; color:var(--cream-dark); line-height:1.7; font-size:0.88rem; }

/* GALLERY */
.gallery { background:var(--coffee); }
.gallery-grid { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.gallery-item { position:relative; overflow:hidden; border-radius:8px; height:280px; }
.gallery-item.tall { grid-row:span 2; height:568px; }
.gallery-item img { width:100%; height:100%; object-fit:cover; display:block; }
.gallery-overlay { position:absolute; inset:0; background:linear-gradient(transparent 50%,rgba(44,24,16,0.85)); opacity:0; transition:opacity 0.3s; display:flex; align-items:flex-end; padding:20px; }
.gallery-item:hover .gallery-overlay { opacity:1; }
.gallery-overlay p { color:#f5e6d0; font-size:0.85rem; font-weight:600; }

/* CONTACT */
.contact { text-align:center; background:var(--charcoal); position:relative; }
.contact-info { max-width:600px; margin:0 auto; }
.contact-info a { color:var(--ochre); text-decoration:none; font-size:1.15rem; display:block; margin:18px 0; transition:all 0.3s; font-weight:300; }
.contact-info a:hover { color:var(--cream); transform:translateX(5px); }
.contact-info a i { color:var(--terracotta); margin-right:10px; width:20px; }
.social-links { display:flex; justify-content:center; gap:20px; margin-top:45px; }
.social-links a { width:50px; height:50px; border:2px solid var(--terracotta); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--terracotta); text-decoration:none; font-size:1.1rem; transition:all 0.3s; }
.social-links a:hover { background:var(--terracotta); color:var(--cream); box-shadow:0 4px 15px rgba(196,90,60,0.4); }

/* FOOTER */
.site-footer { text-align:center; padding:35px 40px; border-top:1px solid rgba(196,90,60,0.15); font-size:0.8rem; color:rgba(245,230,208,0.4); background:var(--coffee); }

/* RESPONSIVE */
@media(max-width:768px) {
  .about-grid { grid-template-columns:1fr; }
  .site-nav { padding:15px 20px; }
  .nav-links { display:none; }
  .mobile-menu { display:block; }
  section { padding:60px 20px; }
  .shows-grid { grid-template-columns:1fr; }
}

/* ANIMATIONS */
@keyframes fadeUp { from { opacity:0; transform:translateY(30px); } to { opacity:1; transform:translateY(0); } }
.fade-up { animation: fadeUp 0.8s ease forwards; }
