/*
Theme Name: Stronger by JCMB Child
Theme URI: https://strongerbn.com
Template: kadence
Version: 1.0.0
Description: Child theme for Stronger by JCMB & Fitness - bone/ink/brass palette, Archivo + Fraunces + JetBrains Mono typography, and all custom components.
Author: Stronger by JCMB & Fitness
Author URI: https://strongerbn.com
Text Domain: stronger-kadence-child
*/

/* ═══════════════════════════════════════════════
   DESIGN TOKENS
═══════════════════════════════════════════════ */
:root {
  --stronger-bone:     #EDE8DF;
  --stronger-bone-2:   #E4DED2;
  --stronger-ink:      #13110E;
  --stronger-char:     #1a1814;
  --stronger-char-2:   #232019;
  --stronger-stone:    #8c8578;
  --stronger-stone-d:  #5b564c;
  --stronger-line:     #d6cfc1;
  --stronger-line-dk:  #322e26;
  --stronger-brass:    #A8865A;
  --stronger-brass-l:  #C2A270;
}

/* ═══════════════════════════════════════════════
   GLOBAL OVERRIDES
═══════════════════════════════════════════════ */
body {
  background-color: var(--stronger-bone) !important;
  color: var(--stronger-ink) !important;
  -webkit-font-smoothing: antialiased;
}
::selection { background: var(--stronger-brass); color: #fff; }
::-webkit-scrollbar { width: 11px; }
::-webkit-scrollbar-track { background: var(--stronger-bone-2); }
::-webkit-scrollbar-thumb { background: var(--stronger-stone); border: 3px solid var(--stronger-bone-2); border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: var(--stronger-ink); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--stronger-brass); outline-offset: 3px; }

/* ═══════════════════════════════════════════════
   TYPOGRAPHY
═══════════════════════════════════════════════ */
h1, h2, h3, h4, h5, h6,
.wp-block-heading {
  font-family: 'Archivo', sans-serif !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  line-height: 1.0;
}
body, p, li, input, textarea, select {
  font-family: 'Hanken Grotesk', sans-serif !important;
}
.serif-accent {
  font-family: 'Fraunces', serif !important;
  font-style: italic;
  font-weight: 400;
  text-transform: none;
}
.mono-label, .eyebrow-label, .price-label {
  font-family: 'JetBrains Mono', monospace !important;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-size: 0.7rem;
}

/* ═══════════════════════════════════════════════
   KADENCE GLOBAL COLOUR OVERRIDES
   (matches Global Palette setup — see kadence-palette.json)
═══════════════════════════════════════════════ */
.has-palette-1-color  { color: var(--stronger-bone) !important; }
.has-palette-2-color  { color: var(--stronger-ink) !important; }
.has-palette-3-color  { color: var(--stronger-brass) !important; }
.has-palette-1-background-color { background-color: var(--stronger-bone) !important; }
.has-palette-2-background-color { background-color: var(--stronger-ink) !important; }
.has-palette-3-background-color { background-color: var(--stronger-brass) !important; }
.has-palette-6-background-color { background-color: var(--stronger-char) !important; }

/* ═══════════════════════════════════════════════
   BUTTONS
═══════════════════════════════════════════════ */
.wp-block-button__link,
.kb-btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  font-family: 'Archivo', sans-serif !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.14em !important;
  background-color: var(--stronger-ink) !important;
  color: var(--stronger-bone) !important;
  border: none !important;
  padding: 16px 30px !important;
  border-radius: 0 !important;
  transition: background 0.3s, transform 0.3s !important;
}
.wp-block-button__link:hover,
.kb-btn:hover,
.woocommerce a.button:hover {
  background-color: var(--stronger-brass) !important;
  color: var(--stronger-ink) !important;
  transform: translateY(-2px) !important;
}
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent !important;
  color: var(--stronger-ink) !important;
  border: 1px solid var(--stronger-ink) !important;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--stronger-ink) !important;
  color: var(--stronger-bone) !important;
}

/* ═══════════════════════════════════════════════
   HEADER (Kadence Sticky Header)
═══════════════════════════════════════════════ */
#masthead,
.site-header {
  background: rgba(26, 24, 20, 0.92) !important;
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--stronger-line-dk) !important;
}
#masthead nav a,
.site-header nav a {
  color: var(--stronger-bone) !important;
  font-family: 'Archivo', sans-serif !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.8rem;
  position: relative;
}
#masthead nav a::after {
  content: '';
  position: absolute;
  left: 0; bottom: -2px;
  height: 1.5px; width: 0;
  background: var(--stronger-brass-l);
  transition: width 0.3s;
}
#masthead nav a:hover { color: var(--stronger-brass-l) !important; }
#masthead nav a:hover::after { width: 100%; }

/* ═══════════════════════════════════════════════
   WOOCOMMERCE — Product Grid Cards
═══════════════════════════════════════════════ */
.woocommerce ul.products li.product {
  background: var(--stronger-bone);
  border: 1px solid var(--stronger-line);
  position: relative;
  transition: background 0.3s;
}
.woocommerce ul.products li.product::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  height: 2px; width: 0;
  background: var(--stronger-brass);
  transition: width 0.35s cubic-bezier(0.2, 0.7, 0.2, 1);
  z-index: 4;
}
.woocommerce ul.products li.product:hover::before { width: 100%; }
.woocommerce ul.products li.product:hover { background: #fff; }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: 'Hanken Grotesk', sans-serif !important;
  text-transform: none !important;
  font-weight: 700 !important;
}
.woocommerce ul.products li.product .price {
  font-family: 'JetBrains Mono', monospace !important;
  color: var(--stronger-ink) !important;
}

/* ═══════════════════════════════════════════════
   WOOCOMMERCE — Single Product
═══════════════════════════════════════════════ */
.woocommerce div.product .product_title {
  font-family: 'Archivo', sans-serif !important;
  text-transform: uppercase !important;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 1.6rem !important;
}
.woocommerce .woocommerce-tabs ul.tabs li a {
  font-family: 'Archivo', sans-serif !important;
  text-transform: uppercase;
}

/* ═══════════════════════════════════════════════
   STRONGER CUSTOM COMPONENTS
   (copy these CSS classes into Kadence Custom CSS
    for pages that use them)
═══════════════════════════════════════════════ */

/* Brand marquee */
.stronger-marquee { background: var(--stronger-ink); overflow: hidden; border-top: 1px solid var(--stronger-line-dk); border-bottom: 1px solid var(--stronger-line-dk); }
.stronger-marquee .track { display: flex; gap: 54px; padding: 18px 0; white-space: nowrap; animation: marquee-scroll 32s linear infinite; font-family: 'Archivo', sans-serif; font-weight: 700; text-transform: uppercase; font-size: 0.95rem; letter-spacing: 0.14em; color: var(--stronger-bone); }
.stronger-marquee .track:hover { animation-play-state: paused; }
.stronger-marquee .track span { opacity: 0.4; transition: 0.3s; }
.stronger-marquee .track span:hover { opacity: 1; color: var(--stronger-brass-l); }
@keyframes marquee-scroll { to { transform: translateX(-50%); } }

/* Section eyebrow label */
.stronger-eyebrow { font-family: 'JetBrains Mono', monospace; font-size: 0.7rem; letter-spacing: 0.32em; text-transform: uppercase; color: var(--stronger-brass); font-weight: 500; }

/* Brass accent card top line */
.stronger-card { position: relative; }
.stronger-card::before { content: ''; position: absolute; top: 0; left: 0; height: 2px; width: 0; background: var(--stronger-brass); transition: width 0.35s cubic-bezier(0.2, 0.7, 0.2, 1); }
.stronger-card:hover::before { width: 100%; }

/* Timeline */
.stronger-timeline { position: relative; padding-left: 40px; }
.stronger-timeline::before { content: ''; position: absolute; left: 7px; top: 6px; bottom: 6px; width: 2px; background: linear-gradient(var(--stronger-brass), var(--stronger-line)); }
.stronger-tl { position: relative; padding-bottom: 44px; }
.stronger-tl::before { content: ''; position: absolute; left: -40px; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--stronger-bone); border: 2px solid var(--stronger-brass); }

/* Scroll reveal */
.stronger-reveal { opacity: 0; transform: translateY(22px); transition: opacity 0.8s cubic-bezier(0.2, 0.7, 0.2, 1), transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1); }
.stronger-reveal.in { opacity: 1; transform: none; }

/* ═══════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════ */
.site-footer, #colophon {
  background: var(--stronger-char) !important;
  color: #a9a294 !important;
}
.site-footer a:hover { color: var(--stronger-brass-l) !important; }
.site-footer h4, .site-footer .widget-title {
  font-family: 'Archivo', sans-serif !important;
  text-transform: uppercase;
  font-size: 0.92rem;
  letter-spacing: 0.08em;
  color: var(--stronger-bone) !important;
}

/* ═══════════════════════════════════════════════
   FORMS
═══════════════════════════════════════════════ */
input[type="text"], input[type="email"], input[type="tel"],
textarea, select {
  background: var(--stronger-bone-2) !important;
  border: 1px solid var(--stronger-line) !important;
  color: var(--stronger-ink) !important;
  border-radius: 0 !important;
  padding: 13px 14px !important;
  font-family: 'Hanken Grotesk', sans-serif !important;
  transition: border-color 0.2s !important;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--stronger-brass) !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: 0.001s !important; }
  .stronger-reveal { opacity: 1 !important; transform: none !important; }
}

/* ===== STAGING FIXES ===== */
.home .entry-hero-layout-standard,
body.home .entry-hero-layout-standard {
  display: none !important;
  height: 0 !important;
  overflow: hidden !important;
}
body.home #primary {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
body.home .site-main {
  padding-top: 0 !important;
}
body.home .hero {
  min-height: 92vh !important;
}
body.home .content-container,
body.home .content-bg {
  padding-top: 0 !important;
}

/* Target Kadence sticky header offset */
body.home .content-bg,
body.home div#wrapper,
body.home div#wrapper > main {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Push hero to cover the gap */
body.home .hero {
  margin-top: -120px !important;
  padding-top: 120px !important;
  min-height: 100vh !important;
}