/*
Theme Name: Band of Wandering Thieves
Theme URI: https://bandofwanderingthieves.com
Author: Ian Venner
Description: Custom theme for The Band of Wandering Thieves, Celtic folk punk. Homepage teasers, News, About, Events and a WooCommerce shop covering merch, vinyl/CD and digital.
Version: 1.02
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: bowt
*/

/* =========================================================
   1. Fonts (self-hosted, no external requests)
   ========================================================= */

@font-face {
  font-family: "Celtic Hand";
  src: url("assets/fonts/celtichand.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Barlow";
  src: url("assets/fonts/barlow-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Barlow";
  src: url("assets/fonts/barlow-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Barlow";
  src: url("assets/fonts/barlow-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Barlow Condensed";
  src: url("assets/fonts/barlow-condensed-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Barlow Condensed";
  src: url("assets/fonts/barlow-condensed-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Barlow Condensed";
  src: url("assets/fonts/barlow-condensed-700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* =========================================================
   2. Tokens
   ========================================================= */

:root{
  --bg:#15110d;
  --panel:#211a13;
  --panel2:#291f16;
  --border:#3d3020;
  --gold:#c9a24a;
  --gold-bright:#e8cf8f;
  --cream:#ece3d2;
  --muted:#a99a80;
  --rust:#a6432f;
  --rust-dark:#8a3524;
  --max:1200px;
}

/* =========================================================
   3. Reset and base
   ========================================================= */

*, *::before, *::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--bg);
  color:var(--cream);
  font-family:"Barlow", system-ui, sans-serif;
  font-size:16px;
  line-height:1.6;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--gold-bright); text-decoration:none; }
a:hover, a:focus{ color:var(--rust); }
h1,h2,h3,h4{
  font-family:"Celtic Hand","Cinzel Decorative",serif;
  color:var(--gold-bright);
  line-height:1.25;
  margin:0 0 .5em;
}
h1{ font-size:clamp(32px,4vw,52px); }
h2{ font-size:clamp(24px,3vw,32px); }
h3{ font-size:20px; }
p{ margin:0 0 1em; color:var(--cream); }
ul{ margin:0; padding:0; list-style:none; }
button, input, textarea, select{ font-family:inherit; }

.bowt-wrap{ max-width:var(--max); margin:0 auto; padding:0 32px; }

.bowt-kicker{
  font-family:"Barlow Condensed", sans-serif;
  text-transform:uppercase;
  letter-spacing:.22em;
  font-weight:600;
  color:var(--gold);
  font-size:13px;
  margin-bottom:10px;
}

.bowt-card{ background:var(--panel); border:1px solid var(--border); }

/* Buttons */
.bowt-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 24px;
  border:2px solid var(--gold);
  color:var(--gold-bright);
  background:transparent;
  font-family:"Barlow Condensed", sans-serif;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:600;
  font-size:14px;
  cursor:pointer;
}
.bowt-btn:hover{ background:var(--gold); color:var(--bg); }
.bowt-btn-solid{ background:var(--rust); border-color:var(--rust); color:var(--cream); }
.bowt-btn-solid:hover{ background:var(--rust-dark); color:var(--cream); border-color:var(--rust-dark); }
.bowt-btn-off{ border-color:var(--border); color:var(--muted); cursor:default; pointer-events:none; }

.bowt-badge{
  display:inline-block;
  font-family:"Barlow Condensed", sans-serif;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:10.5px;
  font-weight:600;
  padding:4px 9px;
  border:1px solid var(--border);
  color:var(--muted);
}

/* =========================================================
   4. Site header / nav
   ========================================================= */

.bowt-site-header{
  border-bottom:1px solid var(--border);
  padding:22px 0;
}
.bowt-site-header .bowt-wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
}
.bowt-brand{
  display:flex;
  align-items:center;
  gap:12px;
  font-family:"Barlow Condensed", sans-serif;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-weight:700;
  font-size:15px;
  color:var(--gold-bright);
}
.bowt-brand img{ width:36px; height:36px; border-radius:50%; }
.bowt-nav ul{ display:flex; gap:30px; flex-wrap:wrap; align-items:center; }
.bowt-nav a{
  font-family:"Barlow Condensed", sans-serif;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:14px;
  font-weight:600;
  color:var(--cream);
}
.bowt-nav a:hover{ color:var(--gold-bright); }
.bowt-nav .current-menu-item > a{ color:var(--gold-bright); }

/* =========================================================
   5. Hero
   ========================================================= */

.bowt-hero{
  text-align:center;
  padding:80px 32px 96px;
  background:radial-gradient(ellipse at 50% 0%, #2a2015 0%, var(--bg) 70%);
  border-bottom:1px solid var(--border);
}
.bowt-hero img.bowt-crest{
  width:220px; height:220px; border-radius:50%;
  box-shadow:0 0 0 1px var(--border), 0 24px 48px rgba(0,0,0,.5);
  margin:0 auto 30px;
}
.bowt-hero h1{ max-width:820px; margin:0 auto 16px; }
.bowt-hero .bowt-tagline{ color:var(--muted); font-size:18px; max-width:560px; margin:0 auto 30px; }
.bowt-hero .bowt-actions{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* =========================================================
   6. Section scaffolding
   ========================================================= */

.bowt-section{ padding:64px 0; }
.bowt-section-alt{ background:var(--panel); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.bowt-section-head{
  display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  margin-bottom:28px; flex-wrap:wrap;
}
.bowt-section-head h2{ margin:0; }
.bowt-section-head a{
  font-family:"Barlow Condensed", sans-serif;
  text-transform:uppercase; letter-spacing:.12em; font-weight:600; font-size:14px;
  white-space:nowrap;
}

/* =========================================================
   7. Card grids (news / shop teasers)
   ========================================================= */

.bowt-grid{ display:grid; gap:24px; }
.bowt-grid-3{ grid-template-columns:repeat(3, minmax(0,1fr)); }
.bowt-grid-4{ grid-template-columns:repeat(4, minmax(0,1fr)); }

.bowt-news-card .bowt-thumb,
.bowt-shop-card .bowt-thumb{
  height:170px;
  background:linear-gradient(135deg,var(--border),var(--panel));
  border-bottom:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
}
.bowt-news-card .bowt-thumb img,
.bowt-shop-card .bowt-thumb img{ width:100%; height:100%; object-fit:cover; }
.bowt-news-card .bowt-body,
.bowt-shop-card .bowt-body{ padding:20px; }
.bowt-news-card .bowt-date{
  font-family:"Barlow Condensed", sans-serif; font-size:13px; letter-spacing:.1em;
  color:var(--gold); text-transform:uppercase; margin-bottom:8px;
}
.bowt-news-card h3{ font-size:19px; margin:0 0 10px; }
.bowt-news-card p{ font-size:14px; color:var(--muted); margin:0; }

.bowt-shop-card .bowt-name{ font-size:15px; color:var(--cream); margin-bottom:6px; }
.bowt-shop-card .bowt-price-row{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.bowt-shop-card .bowt-price{ font-family:"Barlow Condensed", sans-serif; font-weight:600; color:var(--gold-bright); }

/* =========================================================
   8. Events list
   ========================================================= */

.bowt-events-list{ display:flex; flex-direction:column; gap:1px; background:var(--border); border:1px solid var(--border); }
.bowt-events-list.bowt-past{ opacity:.6; }
.bowt-event-row{
  display:flex; align-items:center; gap:28px;
  background:var(--panel2); padding:22px 28px;
  flex-wrap:wrap;
}
.bowt-event-date{ width:74px; text-align:center; flex-shrink:0; }
.bowt-event-date .bowt-day{ font-family:"Celtic Hand","Cinzel Decorative",serif; font-size:28px; color:var(--gold-bright); line-height:1; }
.bowt-event-date .bowt-month{ font-family:"Barlow Condensed", sans-serif; text-transform:uppercase; font-size:12px; letter-spacing:.1em; color:var(--muted); }
.bowt-event-info{ flex-grow:1; min-width:200px; }
.bowt-event-info .bowt-venue{ font-size:18px; color:var(--cream); font-weight:600; }
.bowt-event-info .bowt-city{ font-size:14px; color:var(--muted); }

/* =========================================================
   9. About page blocks (used by registered patterns)
   ========================================================= */

.bowt-pullquote{
  text-align:center; padding:64px 32px; background:var(--panel);
  border-top:1px solid var(--border); border-bottom:1px solid var(--border);
}
.bowt-pullquote blockquote{
  font-family:"Celtic Hand","Cinzel Decorative",serif;
  font-size:26px; color:var(--gold-bright); max-width:760px; margin:0 auto 16px; line-height:1.5;
}
.bowt-members-grid{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:24px; }
.bowt-member{ text-align:center; }
.bowt-member img{ width:100%; aspect-ratio:1; object-fit:cover; border:1px solid var(--border); margin-bottom:14px; }
.bowt-member .bowt-member-name{ font-family:"Celtic Hand","Cinzel Decorative",serif; font-size:18px; color:var(--cream); }
.bowt-member .bowt-member-role{ font-family:"Barlow Condensed", sans-serif; text-transform:uppercase; letter-spacing:.1em; font-size:13px; color:var(--gold); }

.bowt-timeline{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:24px; position:relative; padding-top:8px; }
.bowt-timeline-item{ text-align:center; flex:1; min-width:120px; }
.bowt-timeline-item .bowt-dot{ width:14px; height:14px; border-radius:50%; background:var(--gold); margin:0 auto 14px; }
.bowt-timeline-item .bowt-year{ font-family:"Celtic Hand","Cinzel Decorative",serif; color:var(--gold-bright); font-size:16px; margin-bottom:4px; }
.bowt-timeline-item .bowt-label{ font-size:13px; color:var(--muted); }

/* =========================================================
   10. Footer
   ========================================================= */

.bowt-site-footer{ padding:48px 0; border-top:1px solid var(--border); }
.bowt-site-footer .bowt-wrap{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.bowt-site-footer .bowt-copy{ font-family:"Barlow Condensed", sans-serif; text-transform:uppercase; letter-spacing:.14em; font-size:13px; color:var(--muted); }
.bowt-site-footer .bowt-social ul{ display:flex; gap:24px; list-style:none; margin:0; padding:0; }
.bowt-site-footer .bowt-social a{ font-size:13px; color:var(--muted); }

/* =========================================================
   11. WooCommerce
   ========================================================= */

.woocommerce{ color:var(--cream); }
.woocommerce ul.products{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:24px; list-style:none; }
.woocommerce ul.products li.product{ background:var(--panel); border:1px solid var(--border); padding:0; }
.woocommerce ul.products li.product img{ border-bottom:1px solid var(--border); }
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:"Barlow", sans-serif; font-size:15px; color:var(--cream); padding:16px 16px 0; margin:0;
}
.woocommerce ul.products li.product .price{
  font-family:"Barlow Condensed", sans-serif; font-weight:600; color:var(--gold-bright); padding:6px 16px 16px; display:block;
}
.woocommerce ul.products li.product .button{
  margin:0 16px 16px; width:calc(100% - 32px);
}
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button{
  display:inline-flex; align-items:center; justify-content:center;
  border:2px solid var(--gold); background:transparent; color:var(--gold-bright);
  font-family:"Barlow Condensed", sans-serif; text-transform:uppercase; letter-spacing:.1em; font-weight:600;
  padding:11px 20px; border-radius:0;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover{
  background:var(--gold); color:var(--bg);
}
.woocommerce a.added_to_cart, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt{
  background:var(--rust); border-color:var(--rust); color:var(--cream);
}
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover{ background:var(--rust-dark); border-color:var(--rust-dark); }
.woocommerce div.product .woocommerce-tabs, .woocommerce table.shop_table, .woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea{
  background:var(--panel); border-color:var(--border); color:var(--cream);
}
.woocommerce table.shop_table th{ color:var(--gold-bright); border-bottom:1px solid var(--border); }
.woocommerce table.shop_table td{ border-bottom:1px solid var(--border); }
.bowt-fulfilment-badge{ margin:12px 16px 0; }

/* =========================================================
   12. Responsive
   ========================================================= */

@media (max-width: 960px){
  .bowt-grid-3, .bowt-grid-4, .bowt-members-grid, .woocommerce ul.products{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width: 600px){
  .bowt-grid-3, .bowt-grid-4, .bowt-members-grid, .woocommerce ul.products{ grid-template-columns:1fr; }
  .bowt-site-header .bowt-wrap{ flex-direction:column; align-items:flex-start; }
  .bowt-event-row{ gap:16px; }
}

/* =========================================================
   13. Entry content — default styling for whatever core blocks
   get used inside News posts, About and Event bodies.
   ========================================================= */

.bowt-entry-content{ font-size:17px; }
.bowt-entry-content > *{ max-width:760px; margin-left:auto; margin-right:auto; }
.bowt-entry-content > .alignwide{ max-width:1000px; }
.bowt-entry-content > .alignfull{ max-width:none; }
.bowt-entry-content h2,
.bowt-entry-content h3,
.bowt-entry-content h4{ margin-top:1.4em; }
.bowt-entry-content a{ text-decoration:underline; }
.bowt-entry-content ul,
.bowt-entry-content ol{ padding-left:1.4em; margin:0 0 1em; }
.bowt-entry-content ul{ list-style:disc; }
.bowt-entry-content ol{ list-style:decimal; }
.bowt-entry-content blockquote{
  border-left:3px solid var(--gold);
  padding-left:20px;
  margin:1.5em 0;
  color:var(--gold-bright);
  font-family:"Celtic Hand","Cinzel Decorative",serif;
  font-size:22px;
}
.bowt-entry-content figcaption{ color:var(--muted); font-size:14px; text-align:center; margin-top:8px; }
.bowt-entry-content .wp-block-button__link{
  display:inline-flex; align-items:center; padding:12px 24px;
  border:2px solid var(--gold); color:var(--gold-bright); background:transparent;
  font-family:"Barlow Condensed", sans-serif; text-transform:uppercase; letter-spacing:.12em; font-weight:600;
  border-radius:0; text-decoration:none;
}
.bowt-entry-content .wp-block-button__link:hover{ background:var(--gold); color:var(--bg); }
.bowt-page-links{ margin-top:2em; color:var(--muted); }
.bowt-page-links a{ margin-left:8px; }
