/*
Theme Name: Gemwag
Theme URI: https://gemwag.com
Description: Gemwag child theme for Blocksy — handmade crystal collars for dogs & cats. Visual direction: "Natural Organic" (StyleKit): warm cream ground, earth tones, botanical motifs, irregular organic radii and slow transitions. Carries brand tokens, schema single-source and compliance output. Do not edit parent theme.
Author: Gemwag
Author URI: https://gemwag.com
Template: blocksy
Version: 0.3.0
License: GPL-2.0-or-later
Text Domain: gemwag
*/

/* -------------------------------------------------------------------------
   Self-hosted type (latin subset, variable) — matches the Natural Organic
   reference exactly: Kalnia for display, Commissioner for body/UI.
   Both files are variable instances, so one @font-face covers every weight.
   No third-party request — the US storefront stays free of a Google Fonts hop.
   ------------------------------------------------------------------------- */
@font-face {
  font-family: 'Kalnia';
  src: url('assets/fonts/kalnia-latin-var.woff2') format('woff2');
  font-style: normal; font-weight: 100 700; font-stretch: 100%; font-display: swap;
}
@font-face {
  font-family: 'Commissioner';
  src: url('assets/fonts/commissioner-latin-var.woff2') format('woff2');
  font-style: normal; font-weight: 100 900; font-display: swap;
}

/* -------------------------------------------------------------------------
   Natural Organic design tokens — source: stylekit.top/styles/natural-organic
   Five earth colors. No pure black, no cold blue/purple, no neon.
   Legacy aliases (--gw-ink / --gw-paper / --gw-champagne ...) are kept so
   non-home templates keep rendering after the palette switch.
   ------------------------------------------------------------------------- */
:root {
  --gw-earth: #5c4033;   /* Deep Earth · primary / headings / buttons */
  --gw-cream: #faf6f1;   /* Warm Cream · page background              */
  --gw-sage:  #8b9d77;   /* Sage Green · accent 1                     */
  --gw-tan:   #d4a373;   /* Warm Tan · accent 2                       */
  --gw-linen: #e9e0d4;   /* Linen · surfaces                          */

  /* Derived tones */
  --gw-bark:  #3f3129;   /* deeper earth for long-form copy           */
  --gw-moss:  #5f7350;   /* deep sage · Verdant Tint hover            */
  --gw-clay:  #b07b5b;   /* terracotta                                */

  /* Organic radii: asymmetric, never a perfect circle or square */
  --gw-blob-a: 46% 54% 60% 40% / 54% 44% 56% 46%;
  --gw-blob-b: 62% 38% 44% 56% / 42% 60% 40% 58%;
  --gw-r-lg: 40px 32px 44px 34px / 34px 42px 32px 44px;
  --gw-r-md: 28px 22px 30px 24px / 24px 30px 22px 28px;
  --gw-r-sm: 18px 24px 16px 22px / 22px 16px 24px 18px;
  --gw-r-pill: 20px 30px 18px 28px / 28px 18px 30px 20px;

  /* Legacy aliases */
  --gw-ink:       #3f3129;
  --gw-paper:     #faf6f1;
  --gw-champagne: #d4a373;
  --gw-mist:      #e9e0d4;
  --gw-quiet:     #7a6a5b;

  /* Reference typography (measured on stylekit natural-organic):
     Kalnia 500 display, -0.02em tracking; Commissioner 400 body. */
  --gw-font-display: 'Kalnia', 'Iowan Old Style', Georgia, serif;
  --gw-font-body:    'Commissioner', 'Segoe UI', system-ui, sans-serif;
  --gw-ease: cubic-bezier(.42, 0, .25, 1);
}

/* Base typography: soft-serif display + humanist sans body */
body {
  font-family: var(--gw-font-body);
  color: var(--gw-bark);
  background: var(--gw-cream);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, .gw-serif {
  font-family: var(--gw-font-display);
  font-weight: 500;
  letter-spacing: -.02em;
  line-height: 1.25;
  color: var(--gw-earth);
}
a { color: var(--gw-earth); }

/* Announcement bar — earth gradient, slow and warm instead of ink black */
.gw-bar {
  background: linear-gradient(100deg, #5c4033 0%, #7a5b46 58%, #8b9d77 100%);
  color: var(--gw-cream);
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-align: center;
  padding: 10px 16px;
}
.gw-bar a { color: #f0ddc2; text-decoration: none; border-bottom: 1px solid rgba(240,221,194,.55); }
.gw-bar strong { color: #f0ddc2; font-weight: 600; }

/* Eyebrow / kicker */
.gw-eyebrow { font-size: 11px; letter-spacing: .28em; text-transform: uppercase; color: var(--gw-moss); font-weight: 600; }

/* Product card refinements */
.woocommerce ul.products li.product .price { color: var(--gw-earth); font-weight: 600; }
.woocommerce ul.products li.product .price del { color: var(--gw-quiet); font-weight: 400; }

/* Front page: the H1 lives in page content — hide Blocksy's duplicated page title. */
.home .hero-section .page-title,
.home .hero-section .entry-title { display: none; }

/* Journal cards */
.gw-journal li { list-style: none; margin-bottom: 14px; }
.gw-journal a { color: var(--gw-earth); text-decoration: none; border-bottom: 1px solid var(--gw-linen); }
.gw-journal a:hover { border-color: var(--gw-sage); color: var(--gw-moss); }

/* Symbolic-meaning disclaimer (auto-output, editors must not remove) */
.gw-disclaimer { font-size: 12px; color: var(--gw-quiet); border-top: 1px solid var(--gw-linen); padding-top: 12px; margin-top: 28px; }

/* ---------- Footer (custom, replaces Blocksy default) ---------- */
.gw-footer {
  background: var(--gw-linen);
  color: var(--gw-bark);
  padding: 62px 0 0;
  font-size: 12.5px;
  border-radius: 56px 44px 0 0 / 40px 56px 0 0;
  margin-top: 24px;
}
.gw-fwrap { max-width: 1240px; margin: 0 auto; padding: 0 46px; }
.gw-fgrid { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 40px; padding-bottom: 44px; }
.gw-fbrand .gw-fwordmark { font-family: var(--gw-font-display); font-size: 34px; color: var(--gw-earth); letter-spacing: .01em; }
/* Approved brand logo — footer sits on Linen (light), so use the main dark lockup. */
.gw-fbrand .gw-flogo { display: block; margin-bottom: 6px; }
.gw-fbrand .gw-flogo img { display: block; width: 190px; max-width: 100%; height: auto; }
/* Blocksy renders the site title next to the custom logo — keep the logo only. */
.site-branding .site-title-container { display: none; }
/* Blocksy hard-sets the header logo to height:50px; lift it to a readable lockup. */
.ct-header .site-branding a.site-logo-container img.default-logo { height: 66px; width: auto; }
@media (max-width: 640px) {
	.ct-header .site-branding a.site-logo-container img.default-logo { height: 52px; }
}
.gw-fbrand p { font-size: 12px; line-height: 1.9; max-width: 250px; margin: 10px 0 0; }
.gw-fbrand .gw-fmail a { color: var(--gw-moss); text-decoration: none; border-bottom: 1px solid rgba(95,115,80,.4); }
.gw-footer h4 { font-family: var(--gw-font-body); font-size: 10px; letter-spacing: .18em; text-transform: uppercase; color: var(--gw-moss); margin: 0 0 15px; font-weight: 700; }
.gw-footer ul { list-style: none; margin: 0; padding: 0; }
.gw-footer li { margin: 8px 0; font-size: 12.5px; }
.gw-footer a { color: var(--gw-bark); text-decoration: none; transition: color .55s var(--gw-ease); }
.gw-footer a:hover { color: var(--gw-moss); }
.gw-fbot { border-top: 1px solid rgba(92,64,51,.14); padding: 20px 0 26px; display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; font-size: 11px; color: var(--gw-quiet); }
.gw-flegal { display: flex; gap: 16px; flex-wrap: wrap; }
.gw-flegal a { font-size: 11px; }

@media (max-width: 900px) {
  .gw-fwrap { padding: 0 24px; }
  .gw-fgrid { grid-template-columns: 1fr 1fr; gap: 26px; }
  .gw-footer { border-radius: 36px 30px 0 0 / 28px 36px 0 0; }
}
@media (max-width: 520px) {
  .gw-fgrid { grid-template-columns: 1fr; }
}

/* -------------------------------------------------------------------------
   Blocksy / WooCommerce defaults → Natural Organic palette.
   Blocksy prints its :root variables in an inline <style> emitted AFTER this
   stylesheet, so html:root + !important is required to win the cascade.
   ------------------------------------------------------------------------- */
html:root {
  --theme-palette-color-1: #5c4033 !important;   /* primary buttons / links */
  --theme-palette-color-2: #8b9d77 !important;   /* hover accent            */
  --theme-palette-color-3: #5c4033 !important;
  --theme-palette-color-4: #3f3129 !important;
  --theme-palette-color-5: #e9e0d4 !important;   /* borders / muted surface */
  --theme-palette-color-6: #f4eee5 !important;   /* soft surface            */
  --theme-palette-color-7: #faf6f1 !important;
  --theme-palette-color-8: #ffffff !important;
}

/* WooCommerce sale badge + loop buttons */
.woocommerce span.onsale, .woocommerce ul.products li.product .onsale {
  background: var(--gw-sage) !important; color: var(--gw-cream) !important;
  border: 0 !important; border-radius: var(--gw-r-sm) !important;
  min-height: 0 !important; min-width: 0 !important; line-height: 1.7 !important;
  padding: 5px 12px !important; font-size: 9px !important;
  letter-spacing: .12em; text-transform: uppercase; font-weight: 600;
}
.woocommerce ul.products li.product .button,
.woocommerce a.button, .woocommerce button.button,
.woocommerce #respond input#submit, .woocommerce input.button {
  background: var(--gw-earth) !important; color: var(--gw-cream) !important;
  border: 1px solid var(--gw-earth) !important;
  border-radius: var(--gw-r-pill) !important;
  font-family: var(--gw-font-body) !important;
  font-size: 11px !important; letter-spacing: .1em; text-transform: uppercase;
  transition: background-color .6s var(--gw-ease), transform .6s var(--gw-ease);
}
.woocommerce ul.products li.product .button:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover {
  background: #463026 !important; color: var(--gw-cream) !important;
  transform: translateY(2px);
}

/* Warm cream archive hero instead of the default blue-grey band */
.woocommerce-page .hero-section, .archive .hero-section,
.woocommerce-page .page-title-section, .page-title-section {
  background: var(--gw-linen) !important;
}