/* Austin Polka Band — Bierhall Poster theme
   Wright Music · v1 · June 2026
   Colors and type follow the APB brand style guide. */

:root{
  --blue:#7DC8E8;     /* Bavarian Blue */
  --red:#C8102E;      /* Texas Red */
  --gold:#D4A017;     /* Beer Gold */
  --seal-gold:#FFD700;
  --ink:#1A1A1A;      /* Ink Black */
  --cream:#FBF6EA;
  --white:#FFFFFF;
  --maxw:1080px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Lora',Georgia,serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.7;
  font-size:18px;
}
img{max-width:100%;display:block;}
a{color:var(--red);}

/* ---- The Bavarian Rauten (diamond) pattern ---- */
.rauten{
  background-color:var(--white);
  background-image:
    linear-gradient(45deg,var(--blue) 25%,transparent 25%,transparent 75%,var(--blue) 75%),
    linear-gradient(45deg,var(--blue) 25%,transparent 25%,transparent 75%,var(--blue) 75%);
  background-size:44px 44px;
  background-position:0 0,22px 22px;
}
.rauten-band{height:26px;}
.rauten-band.thick{height:40px;}

/* ---- Typography helpers ---- */
.display{
  font-family:'Rye',cursive;
  font-weight:400;
  line-height:1.02;
  letter-spacing:1px;
}
.kicker, .nav a, .btn, .eyebrow, .tier-name, .stat-num, .stat-label{
  font-family:'Oswald',sans-serif;
}
.script{font-family:'Kaushan Script',cursive;color:var(--red);font-weight:400;}

/* ---- Top nav ---- */
.topbar{
  background:var(--ink);
  border-bottom:4px solid var(--gold);
  position:sticky;top:0;z-index:20;
}
.nav{
  max-width:var(--maxw);margin:0 auto;
  display:flex;align-items:center;gap:18px;
  padding:10px 20px;
}
.nav .brand{
  display:flex;align-items:center;gap:10px;
  color:var(--white);text-decoration:none;margin-right:auto;
}
.nav .brand img{width:42px;height:42px;border-radius:50%;}
.nav .brand span{
  font-family:'Oswald',sans-serif;font-weight:700;
  text-transform:uppercase;letter-spacing:1px;font-size:16px;
}
.nav a.link{
  color:var(--white);text-decoration:none;text-transform:uppercase;
  font-weight:500;letter-spacing:1px;font-size:14px;
}
.nav a.link:hover{color:var(--seal-gold);}
.nav a.book{
  background:var(--red);color:var(--white);
  padding:8px 16px;border-radius:4px;font-weight:700;
}
.nav a.book:hover{background:#a50d25;color:var(--white);}

/* ---- Buttons ---- */
.btn{
  display:inline-block;text-decoration:none;cursor:pointer;
  text-transform:uppercase;letter-spacing:1.5px;font-weight:700;
  padding:15px 32px;border-radius:5px;border:3px solid transparent;font-size:16px;
}
.btn-red{background:var(--red);color:var(--white);}
.btn-red:hover{background:#a50d25;}
.btn-gold{background:var(--gold);color:var(--ink);}
.btn-gold:hover{background:#b88912;}
.btn-outline{background:transparent;color:var(--white);border-color:var(--white);}
.btn-outline:hover{background:var(--white);color:var(--ink);}

/* ---- Hero ---- */
.hero{position:relative;text-align:center;color:var(--white);padding:0;}
.hero-inner{
  position:relative;
  background:linear-gradient(rgba(26,26,26,.52),rgba(26,26,26,.66));
  padding:54px 20px 64px;
}
.hero .seal{
  width:170px;height:170px;border-radius:50%;
  border:5px solid var(--seal-gold);
  box-shadow:0 0 0 4px var(--red);
  margin:0 auto 22px;background:var(--white);
}
.hero h1{
  margin:0 0 6px;color:var(--white);
  font-size:clamp(38px,7vw,76px);
  text-shadow:3px 3px 0 var(--ink),-1px -1px 0 var(--ink);
}
.hero .willkommen{color:var(--seal-gold);font-size:clamp(22px,4vw,34px);margin-bottom:14px;}
.hero .tagline{
  display:inline-block;background:var(--gold);color:var(--ink);
  font-weight:700;text-transform:uppercase;letter-spacing:2px;
  padding:8px 20px;border-radius:4px;font-size:clamp(13px,2vw,17px);margin-bottom:26px;
}
.hero .hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* ---- Generic sections ---- */
section{padding:60px 20px;}
.wrap{max-width:var(--maxw);margin:0 auto;}
.section-head{text-align:center;margin-bottom:36px;}
.section-head .script{font-size:clamp(26px,4vw,40px);display:block;}
.section-head h2{
  font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;
  letter-spacing:2px;font-size:clamp(24px,3.5vw,34px);margin:2px 0 0;color:var(--ink);
}
.divider{width:90px;height:5px;background:var(--red);border:0;margin:14px auto 0;}

/* ---- Intro hook ---- */
.intro{background:var(--cream);text-align:center;}
.intro p{max-width:760px;margin:0 auto 16px;font-size:20px;}
.intro .lead{font-size:24px;}

/* ---- Scalable ensemble ---- */
.scale{background:var(--ink);color:var(--white);}
.scale .section-head h2{color:var(--white);}
.scale .tiers{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:10px;
}
.tier{
  background:#262626;border:2px solid var(--gold);border-radius:10px;
  padding:24px 22px;text-align:center;
}
.tier .badge{
  display:inline-block;background:var(--red);color:#fff;font-family:'Oswald',sans-serif;
  font-weight:700;border-radius:30px;padding:4px 16px;font-size:14px;letter-spacing:1px;margin-bottom:12px;
}
.tier-name{font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:20px;margin:0 0 8px;}
.tier p{margin:0;color:#e8e3d6;font-size:16px;line-height:1.55;}
.scale .note{text-align:center;margin-top:26px;color:#cfc8b8;font-style:italic;}

/* Seven-piece lineup */
.lineup{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:780px;margin:0 auto 26px;}
.inst{
  font-family:'Oswald',sans-serif;font-weight:500;text-transform:uppercase;letter-spacing:1px;
  font-size:15px;color:#fff;background:#262626;border:2px solid var(--gold);border-radius:30px;padding:9px 20px;
}
.inst-lead{background:var(--red);border-color:var(--red);font-weight:700;}
.lineup-copy{max-width:680px;margin:0 auto;text-align:center;color:#e8e3d6;font-size:19px;}

/* ---- Photo strip ---- */
.photos .grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;
}
.ph{
  position:relative;aspect-ratio:4/3;border-radius:8px;overflow:hidden;
  border:3px solid var(--gold);background:var(--blue);
  display:flex;align-items:center;justify-content:center;
}
.ph span{
  font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1px;
  color:var(--ink);font-size:13px;text-align:center;padding:10px;font-weight:500;opacity:.85;
}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}

/* ---- Videos ---- */
.videos{background:var(--cream);}
.video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px;}
.vid{margin:0;}
.vid video{width:100%;aspect-ratio:16/9;display:block;border-radius:8px;border:3px solid var(--gold);background:#000;}
.vid figcaption{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1px;font-size:14px;font-weight:500;color:var(--ink);text-align:center;margin-top:10px;}

/* ---- Credibility bar ---- */
.stats{background:var(--ink);color:#fff;}
.creds{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:30px;text-align:center;}
.cred-sub{display:block;font-family:'Lora',serif;font-size:15px;line-height:1.45;color:#e8e3d6;margin:0 0 8px;}
.cred-lead{display:block;font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:28px;line-height:1.1;color:var(--seal-gold);}

/* ---- Final CTA ---- */
.cta-final{text-align:center;color:#fff;position:relative;}
.cta-final .inner{background:linear-gradient(rgba(26,26,26,.82),rgba(26,26,26,.9));padding:56px 20px;}
.cta-final h2{color:#fff;font-family:'Rye',cursive;font-weight:400;font-size:clamp(30px,5vw,52px);margin:0 0 10px;}
.cta-final p{font-size:20px;max-width:620px;margin:0 auto 26px;}

/* ---- Footer ---- */
.foot{background:var(--ink);color:#cfc8b8;padding:40px 20px;text-align:center;}
.foot img{width:80px;height:80px;border-radius:50%;margin:0 auto 14px;border:3px solid var(--gold);}
.foot .gsuffa{font-family:'Kaushan Script',cursive;color:var(--seal-gold);font-size:22px;margin:6px 0 14px;}
.foot a{color:var(--blue);text-decoration:none;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1px;font-size:14px;margin:0 10px;}
.foot .fine{font-size:13px;color:#8a857a;margin-top:18px;font-family:'Oswald',sans-serif;letter-spacing:.5px;}

/* ---- Inner-page header (About / Shows / Book) ---- */
.page-head{text-align:center;position:relative;}
.page-head-inner{
  background:linear-gradient(rgba(26,26,26,.72),rgba(26,26,26,.82));
  padding:48px 20px 54px;color:var(--white);
}
.page-head h1{
  margin:4px 0 14px;color:var(--white);
  font-size:clamp(34px,6vw,64px);
  text-shadow:3px 3px 0 var(--ink),-1px -1px 0 var(--ink);
}
.willkommen-light{color:var(--seal-gold)!important;font-size:clamp(20px,3.5vw,30px);margin:0;}
.page-head .tagline{
  display:inline-block;background:var(--gold);color:var(--ink);
  font-weight:700;text-transform:uppercase;letter-spacing:2px;
  padding:8px 20px;border-radius:4px;font-size:clamp(12px,2vw,16px);
  font-family:'Oswald',sans-serif;
}

/* ---- Repertoire / markets (light sections reusing chips) ---- */
.repertoire{background:var(--cream);}
.markets{background:var(--cream);}
.inst.dark{color:var(--ink);background:#fff;border-color:var(--gold);}

/* ---- Grackle seal feature (About) ---- */
.seal-feature{background:var(--cream);}
.seal-wrap{display:flex;align-items:center;gap:40px;flex-wrap:wrap;justify-content:center;}
.big-seal{
  width:230px;height:230px;border-radius:50%;flex:0 0 auto;
  border:5px solid var(--seal-gold);box-shadow:0 0 0 4px var(--red);background:#fff;
}
.seal-copy{flex:1 1 320px;max-width:520px;}
.seal-copy .script{font-size:clamp(24px,4vw,36px);display:block;}
.seal-copy h2{
  font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;
  letter-spacing:2px;font-size:clamp(24px,3.5vw,32px);margin:2px 0 0;color:var(--ink);
}
.seal-copy p{font-size:19px;}
.divider-left{margin:14px 0 18px;}

/* ---- Shows / calendar ---- */
.shows{background:var(--cream);}
.cal-frame{
  border:4px solid var(--gold);border-radius:10px;background:#fff;
  padding:10px;max-width:860px;margin:0 auto;overflow:hidden;
}
.cal-frame iframe{display:block;border-radius:6px;}
.cal-placeholder{text-align:center;padding:48px 24px;}
.cal-placeholder .big{
  font-family:'Rye',cursive;font-size:clamp(26px,4vw,40px);color:var(--red);margin:0 0 14px;
}
.cal-placeholder p{max-width:560px;margin:0 auto 22px;}

/* ---- Booking ---- */
.book-cta{background:var(--cream);text-align:center;}
.btn-big{font-size:20px;padding:20px 44px;}
.contact-lines{margin-top:30px;}
.contact-lines p{font-size:20px;margin:8px 0;}
.contact-lines a{font-weight:700;}

@media (max-width:620px){
  body{font-size:17px;}
  .nav .link{display:none;}
  .nav .brand{margin-right:auto;}
  .seal-wrap{gap:24px;}
  .seal-copy{text-align:center;}
  .divider-left{margin-left:auto;margin-right:auto;}
}

/* ---- Booking form ---- */
.book-form-section{background:var(--cream);}
.form-intro{text-align:center;max-width:680px;margin:0 auto 40px;}
.form-intro .lead{font-size:23px;margin:0 0 12px;}
.book-form{max-width:720px;margin:0 auto;}
.book-form fieldset{
  border:3px solid var(--gold);border-radius:10px;background:#fff;
  padding:22px 24px 26px;margin:0 0 26px;
}
.book-form legend{
  font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;
  letter-spacing:2px;font-size:18px;color:var(--red);
  padding:0 12px;
}
.field{display:block;margin:0 0 16px;}
.field:last-child{margin-bottom:0;}
.field > span,.field-label{
  display:block;font-family:'Oswald',sans-serif;font-weight:500;
  text-transform:uppercase;letter-spacing:1px;font-size:14px;color:var(--ink);margin:0 0 6px;
}
.field input[type=text],
.field input[type=email],
.field input[type=tel],
.field input[type=date],
.field input[type=time],
.field textarea{
  width:100%;font-family:'Lora',serif;font-size:17px;color:var(--ink);
  padding:11px 13px;border:2px solid #d8cdb0;border-radius:6px;background:var(--cream);
}
.field input:focus,.field textarea:focus{
  outline:none;border-color:var(--red);background:#fff;
}
.field textarea{resize:vertical;line-height:1.5;}
.field-row{display:flex;gap:16px;flex-wrap:wrap;}
.field-row .field{flex:1 1 200px;}
.radio-row{display:flex;flex-wrap:wrap;gap:10px 22px;margin-bottom:14px;}
.radio{
  display:flex;align-items:center;gap:8px;
  font-family:'Lora',serif;font-size:17px;color:var(--ink);cursor:pointer;
}
.radio input{width:18px;height:18px;accent-color:var(--red);margin:0;}
.book-form > .btn{display:block;width:100%;text-align:center;border:none;}

@media (max-width:620px){
  .book-form fieldset{padding:18px 16px 20px;}
}

/* ====================================================================
   REVIEWS — homepage banner + Reviews page + star-rating form input
   Added June 2026. Bierhall-Poster theme, consistent with the rest.
   ==================================================================== */

/* ---- Homepage testimonial banner ---- */
.testimonials{background:var(--cream);text-align:center;}
.tcarousel{position:relative;max-width:760px;margin:0 auto;min-height:170px;}
.tslide{display:none;}
.tslide.is-active{display:block;animation:tfade .45s ease;}
@keyframes tfade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.tstars{color:var(--gold);font-size:26px;letter-spacing:4px;margin-bottom:14px;}
.tquote{
  font-family:'Lora',serif;font-style:italic;
  font-size:clamp(20px,2.6vw,27px);line-height:1.5;color:var(--ink);
  margin:0 auto 18px;max-width:680px;
}
.tname{
  font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;
  letter-spacing:1px;color:var(--red);font-size:16px;
}
.tloc{
  display:block;font-family:'Oswald',sans-serif;font-weight:500;
  text-transform:uppercase;letter-spacing:1px;font-size:13px;
  color:var(--ink);opacity:.65;margin-top:3px;
}
.tcontrols{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:26px;}
.tarrow{
  background:var(--ink);color:#fff;border:none;cursor:pointer;
  width:42px;height:42px;border-radius:50%;font-size:22px;line-height:1;
  font-family:'Oswald',sans-serif;display:flex;align-items:center;justify-content:center;
}
.tarrow:hover{background:var(--red);}
.tdots{display:flex;gap:9px;}
.tdot{
  width:12px;height:12px;border-radius:50%;padding:0;cursor:pointer;
  border:2px solid var(--gold);background:transparent;
}
.tdot.is-active{background:var(--gold);}
.treviews-cta{margin-top:34px;}

/* ---- Reviews page ---- */
.reviews-page{background:var(--cream);}
.rev-aggregate{text-align:center;margin:0 auto 40px;}
.rev-agg-stars{color:var(--gold);font-size:34px;letter-spacing:5px;line-height:1;}
.rev-agg-line{
  font-family:'Oswald',sans-serif;font-weight:500;text-transform:uppercase;
  letter-spacing:1.5px;font-size:16px;color:var(--ink);margin-top:10px;
}
.rev-list{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:20px;
}
.rev-card{
  background:#fff;border:3px solid var(--gold);border-radius:10px;
  padding:22px 24px;text-align:left;
}
.rev-card .rc-stars{color:var(--gold);font-size:18px;letter-spacing:2px;margin-bottom:10px;}
.rev-card .rc-text{
  font-family:'Lora',serif;font-style:italic;font-size:18px;line-height:1.55;margin:0 0 14px;
}
.rev-card .rc-name{
  font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;
  letter-spacing:1px;color:var(--red);font-size:15px;
}
.rev-card .rc-loc{
  font-family:'Oswald',sans-serif;font-weight:500;text-transform:uppercase;
  letter-spacing:1px;font-size:12px;color:var(--ink);opacity:.65;margin-top:2px;
}
.rev-empty{text-align:center;max-width:560px;margin:0 auto;padding:20px 0 10px;}
.rev-empty .big{
  font-family:'Rye',cursive;font-size:clamp(24px,4vw,38px);color:var(--red);margin:0 0 12px;
}

/* ---- Star-rating input (Leave a review form) ---- */
.star-pick{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;gap:6px;}
.star-pick input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;}
.star-pick label{
  font-size:38px;line-height:1;color:#d8cdb0;cursor:pointer;transition:color .12s ease;
}
.star-pick input:checked ~ label{color:var(--gold);}
.star-pick:hover label{color:#d8cdb0;}
.star-pick label:hover,
.star-pick label:hover ~ label{color:var(--gold);}
.star-pick input:focus-visible + label{outline:2px solid var(--red);outline-offset:2px;border-radius:3px;}
.review-note{
  font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:.5px;
  color:var(--ink);opacity:.7;text-align:center;margin:14px auto 0;max-width:520px;
}

/* Footer social icons (Facebook + Instagram) - added 2026-07-11 */
.foot-social{display:flex;justify-content:center;align-items:center;gap:22px;margin:16px 0 4px;}
.foot-social a{margin:0;display:inline-flex;}
.foot-social svg{width:26px;height:26px;fill:var(--blue);transition:fill .15s ease;}
.foot-social a:hover svg{fill:var(--seal-gold);}

/* Header nav social icons - added 2026-07-11 */
.nav-social{display:inline-flex;align-items:center;gap:12px;}
.nav-social a{display:inline-flex;margin:0;}
.nav-social svg{width:22px;height:22px;fill:var(--white);transition:fill .15s ease;}
.nav-social a:hover svg{fill:var(--seal-gold);}
