/*
Theme Name: PromoGosh Theme
Theme URI: https://promogosh.terryarthurconsulting.com
Description: Custom WooCommerce theme for PromoGosh promotional products. Built on Kadence.
Author: Terry Arthur Consulting
Author URI: https://terryarthurconsulting.com
Template: kadence
Version: 2.3.1
Text Domain: promogosh-theme
*/

/* ==========================================================================
   DESIGN TOKENS — v2.1.0 "Tactile Tech"
   Ivory + bone + deep navy ink, one ember accent.
   Typography: Fraunces (display) + Geist (body).
   ========================================================================== */
:root {
    --pg-ivory:   #FAF8F4;
    --pg-bone:    #F2EDE4;
    --pg-paper:   #FFFFFF;
    --pg-ink:     #0B1D2E;
    --pg-ink-2:   #1F2E3F;
    --pg-graphite:#4E5A66;
    --pg-muted:   #8A9199;
    --pg-sage:    #647D5F;
    --pg-ember:   #B4542A;
    --pg-ember-soft: rgba(180,84,42,0.08);
    --pg-line:    rgba(11,29,46,0.10);
    --pg-line-2:  rgba(11,29,46,0.18);
    --pg-shadow-fine: 0 1px 0 rgba(11,29,46,0.04);
    --pg-shadow:      0 2px 16px rgba(11,29,46,0.06);
    --pg-shadow-hover:0 12px 40px rgba(11,29,46,0.10);
    --pg-radius:    4px;
    --pg-radius-lg: 8px;
    --pg-transition: all 0.28s cubic-bezier(0.2, 0.8, 0.2, 1);

    /* Legacy alias bridge — anything still pointing at old tokens keeps working. */
    --pg-green:       var(--pg-ink);
    --pg-green-dark:  var(--pg-ink-2);
    --pg-green-light: var(--pg-ember);
    --pg-green-pale:  var(--pg-ember-soft);
    --pg-charcoal:    var(--pg-graphite);
    --pg-dark:        var(--pg-ink);
    --pg-gray:        var(--pg-muted);
    --pg-light:       var(--pg-bone);
    --pg-white:       var(--pg-paper);
    --pg-cream:       var(--pg-ivory);
    --pg-accent:      var(--pg-ember);
    --pg-accent-glow: rgba(180,84,42,0.14);
}

/* ==========================================================================
   GLOBAL
   ========================================================================== */
html, body { background: var(--pg-ivory) !important; }
body {
    font-family: 'Geist', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-feature-settings: "ss01", "cv11";
    color: var(--pg-ink);
    background: var(--pg-ivory);
    -webkit-font-smoothing: antialiased;
    line-height: 1.6;
    font-size: 16px;
}

/* ==========================================================================
   KADENCE FRAME KILL — remove the 100px picture-frame inset wrapping the page.
   Kadence wraps content in .content-container (max-width:1200px), .content-area
   (margin-top:80px), and article.entry (bg:white). All of that creates a
   "card on a background" effect that clashes with a full-bleed editorial
   design. Flatten everything so sections run edge-to-edge and the body
   color is ivory throughout.
   ========================================================================== */
.site,
.wp-site-blocks,
main.wrap,
.content-area,
.content-container.site-container,
.site-main,
.content-wrap,
.entry-content-wrap,
.entry-content,
.entry.single-entry,
article.entry {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
.content-area { margin-top: 0 !important; margin-bottom: 0 !important; }
.entry-content > * { margin-top: 0; margin-bottom: 0; }
article.entry.single-entry { padding: 0 !important; }
.home .entry-content .wp-block-heading { margin-left: clamp(20px, 4vw, 48px); }
h1, h2, h3, h4, h5, h6 {
    font-family: 'Fraunces', 'Playfair Display', Georgia, serif;
    font-weight: 500;
    color: var(--pg-ink);
    line-height: 1.1;
    letter-spacing: -0.02em;
    font-optical-sizing: auto;
}
h1 { font-size: clamp(2.8rem, 6vw, 5rem); font-weight: 400; }
h2 { font-size: clamp(2rem, 4vw, 3.2rem); font-weight: 400; }
h3 { font-size: clamp(1.4rem, 2.4vw, 1.9rem); font-weight: 500; }
h4 { font-size: 1.2rem; font-weight: 600; font-family: 'Geist', sans-serif; letter-spacing: -0.01em; }
p  { color: var(--pg-graphite); }
a  { color: var(--pg-ink); text-decoration: none; transition: var(--pg-transition); border-bottom: 1px solid transparent; }
a:hover { color: var(--pg-ember); border-bottom-color: var(--pg-ember); }
img { border-radius: 0; }
::selection { background: var(--pg-ink); color: var(--pg-ivory); }

.pg-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(20px, 4vw, 48px);
}
.pg-section {
    padding: clamp(48px, 7vw, 88px) 0;
    background: var(--pg-ivory);
}
.pg-section-alt { background: var(--pg-bone); }
.pg-section-title {
    max-width: 1280px;
    margin: 0 auto clamp(40px, 6vw, 72px);
    padding: 0 clamp(20px, 4vw, 48px);
}
.pg-section-title h2 { margin: 0 0 12px; }
.pg-section-title p  { color: var(--pg-graphite); font-size: 1.05rem; margin: 0; max-width: 48ch; }
.pg-section-title .pg-green-line {
    width: 48px; height: 1px; background: var(--pg-ink); margin: 24px 0 0;
}

/* Micro label — the "OUTFITTING" / "CATALOG" / "ORDER DETAIL" style caps. */
.pg-eyebrow {
    display: inline-block;
    font-family: 'Geist', sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--pg-ember);
    margin-bottom: 20px;
}

/* ==========================================================================
   KADENCE HEADER OVERRIDES — keep dark, use ink navy instead of green.
   ========================================================================== */
.site-header,
#masthead {
    background: var(--pg-ink) !important;
    border-bottom: none;
    box-shadow: var(--pg-shadow-fine);
}
.site-header .site-header-row-container-inner,
.site-header .site-header-upper-inner-wrap,
.site-header .site-header-main-section-left,
.site-header .site-header-main-section-center,
.site-header .site-header-main-section-right,
#masthead .site-header-row-container-inner {
    background: transparent !important;
}
.kadence-sticky-header.item-is-fixed,
.kadence-sticky-header.item-is-stuck {
    background: var(--pg-ink) !important;
    box-shadow: 0 1px 0 rgba(255,255,255,0.08) !important;
}
.kadence-sticky-header.item-is-fixed .site-main-header-inner-wrap,
.kadence-sticky-header.item-is-stuck .site-main-header-inner-wrap {
    display: flex !important;
    align-items: center !important;
}
.site-branding .site-title { display: none; }
.site-branding .custom-logo-link img,
.site-branding img.custom-logo {
    max-height: 54px !important;
    width: auto;
    filter: brightness(0) invert(1); /* logo rendered in ivory on navy */
}
#masthead .site-header-row-container-inner { min-height: 70px; }
.site-main-header-inner-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 70px !important;
    padding: 8px 0 !important;
}
.site-header-main-section-right {
    flex: 1 !important;
    justify-content: flex-end !important;
}
.header-navigation .header-menu-container > ul > li > a,
.header-navigation nav > ul > li > a,
#main-header .header-navigation a,
.primary-navigation .primary-menu-container > ul > li > a {
    color: rgba(250,248,244,0.82) !important;
    font-family: 'Geist', sans-serif !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    letter-spacing: 0.02em !important;
    padding: 8px 16px !important;
    border-radius: 0 !important;
    border-bottom: 1px solid transparent !important;
    background: transparent !important;
    transition: var(--pg-transition);
}
#main-header .header-navigation a:hover,
.header-navigation .header-menu-container > ul > li > a:hover,
.primary-navigation .primary-menu-container > ul > li > a:hover {
    color: var(--pg-ivory) !important;
    border-bottom-color: var(--pg-ember) !important;
    background: transparent !important;
}
/* Dropdown submenus */
#masthead .header-navigation ul ul a,
#masthead .header-navigation .sub-menu a,
#main-header .header-navigation ul.sub-menu li a,
#main-header .primary-navigation ul.sub-menu li a {
    background: var(--pg-ink-2) !important;
    color: rgba(250,248,244,0.8) !important;
    font-size: 13px !important;
    padding: 10px 18px !important;
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}
#masthead .header-navigation ul ul a:hover,
#main-header .header-navigation ul.sub-menu li a:hover,
#main-header .primary-navigation ul.sub-menu li a:hover {
    background: var(--pg-ink) !important;
    color: var(--pg-ember) !important;
}
/* Cart icon */
.header-cart-inner-wrap,
.header-cart-wrap .header-account-link,
.header-cart-wrap a {
    color: rgba(250,248,244,0.88) !important;
}
.header-cart-total { color: var(--pg-ember) !important; font-weight: 600 !important; }

/* ==========================================================================
   BUTTONS — primary, outline, ghost. All text-first, no gradients.
   ========================================================================== */
.pg-btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce .button.alt,
.woocommerce-page .button {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    font-family: 'Geist', sans-serif !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    letter-spacing: 0.02em !important;
    padding: 14px 28px !important;
    background: var(--pg-ink) !important;
    color: var(--pg-ivory) !important;
    border: 1px solid var(--pg-ink) !important;
    border-radius: var(--pg-radius) !important;
    text-decoration: none !important;
    transition: var(--pg-transition);
    cursor: pointer;
    box-shadow: none !important;
}
.pg-btn::after {
    content: "→";
    font-size: 16px;
    transition: transform 0.2s ease;
}
.pg-btn:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce .button.alt:hover {
    background: var(--pg-ember) !important;
    border-color: var(--pg-ember) !important;
    color: var(--pg-ivory) !important;
}
.pg-btn:hover::after { transform: translateX(3px); }

.pg-btn-outline,
.woocommerce a.button.alt-outline,
.wc-block-components-button--outlined {
    background: transparent !important;
    color: var(--pg-ink) !important;
    border: 1px solid var(--pg-line-2) !important;
}
.pg-btn-outline:hover {
    background: var(--pg-ink) !important;
    color: var(--pg-ivory) !important;
    border-color: var(--pg-ink) !important;
}

/* ==========================================================================
   HERO — editorial, ivory base, large Fraunces headline.
   ========================================================================== */
.pg-hero {
    position: relative;
    background:
        radial-gradient(1200px 500px at 100% 0%, rgba(180,84,42,0.05), transparent 60%),
        linear-gradient(180deg, var(--pg-ivory) 0%, var(--pg-ivory) 60%, var(--pg-bone) 100%);
    padding: clamp(40px, 5vw, 72px) 0 clamp(56px, 7vw, 88px);
    overflow: hidden;
    border-bottom: 1px solid var(--pg-line);
}
.pg-hero__rule {
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, var(--pg-line-2) 25%, var(--pg-line-2) 75%, transparent 100%);
}
.pg-hero-dots,
.pg-hero-accent { display: none; }
.pg-hero .pg-container {
    position: relative;
    z-index: 2;
    max-width: 1400px;
    padding-left: clamp(20px, 5vw, 72px);
    padding-right: clamp(20px, 5vw, 72px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(48px, 6vw, 96px);
    align-items: center;
}
@media (max-width: 960px) {
    .pg-hero .pg-container { grid-template-columns: 1fr; }
}
.pg-hero-content { max-width: 640px; position: relative; }

/* Hero showcase — 2x2 asymmetric product grid on the right. */
.pg-hero-showcase {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 16px;
    padding-left: clamp(0px, 2vw, 24px);
}
.pg-hero-showcase__item {
    position: relative;
    margin: 0;
    background: var(--pg-paper);
    border: 1px solid var(--pg-line);
    border-radius: 2px;
    overflow: hidden;
    box-shadow: 0 1px 0 rgba(255,255,255,0.7) inset, 0 20px 40px -24px rgba(11,29,46,0.18);
    transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.4s ease;
}
.pg-hero-showcase__item img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    background: var(--pg-bone);
    transition: transform 0.6s ease;
}
.pg-hero-showcase__item figcaption {
    position: absolute;
    inset: auto 0 0 0;
    padding: 10px 14px;
    font-family: 'Geist', sans-serif;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--pg-ivory);
    background: linear-gradient(transparent, rgba(11,29,46,0.85));
    opacity: 0;
    transition: opacity 0.3s ease;
}
.pg-hero-showcase__item:hover { transform: translateY(-4px); }
.pg-hero-showcase__item:hover img { transform: scale(1.06); }
.pg-hero-showcase__item:hover figcaption { opacity: 1; }
/* Asymmetric staggering — makes it feel curated not gridded. */
.pg-hero-showcase__item--1 { transform: translateY(-14px); }
.pg-hero-showcase__item--2 { transform: translateY(24px); }
.pg-hero-showcase__item--3 { transform: translateY(-24px); }
.pg-hero-showcase__item--4 { transform: translateY(14px); }
.pg-hero-showcase__item--1:hover { transform: translateY(-20px); }
.pg-hero-showcase__item--2:hover { transform: translateY(18px); }
.pg-hero-showcase__item--3:hover { transform: translateY(-30px); }
.pg-hero-showcase__item--4:hover { transform: translateY(8px); }
.pg-hero-showcase__mark {
    position: absolute;
    top: -8px;
    right: -8px;
    font-family: 'Fraunces', serif;
    font-size: 11px;
    font-style: italic;
    font-weight: 400;
    color: var(--pg-muted);
    letter-spacing: 0.02em;
    padding: 4px 10px;
    background: var(--pg-ivory);
    border: 1px solid var(--pg-line);
    border-radius: 999px;
    z-index: 3;
}
.pg-hero-showcase__mark span { color: var(--pg-ember); margin: 0 4px; }
@media (max-width: 960px) {
    .pg-hero-showcase { display: none; }
}

/* Hero meta definition list — tiny editorial specs below the CTAs. */
.pg-hero-meta {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: 48px 0 0;
    padding-top: 24px;
    border-top: 1px solid var(--pg-ink);
    background: transparent;
}
.pg-hero-meta > div {
    padding: 4px 20px 0 0;
    border-left: 1px solid var(--pg-line);
    padding-left: 20px;
}
.pg-hero-meta > div:first-child {
    border-left: none;
    padding-left: 0;
}
.pg-hero-meta dt {
    font-family: 'Geist', sans-serif;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--pg-muted);
    margin: 0 0 6px;
}
.pg-hero-meta dd {
    font-family: 'Fraunces', serif;
    font-size: 1.4rem;
    font-weight: 400;
    color: var(--pg-ink);
    margin: 0;
    letter-spacing: -0.02em;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}
@media (max-width: 520px) {
    .pg-hero-meta { grid-template-columns: repeat(2, 1fr); }
}
.pg-hero-content::before {
    content: "CATALOG · 14,184 PRODUCTS · 13 SUPPLIERS";
    display: block;
    font-family: 'Geist', sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.16em;
    color: var(--pg-ember);
    margin-bottom: 32px;
}
.pg-hero h1 {
    font-size: clamp(2.6rem, 5.6vw, 4.8rem);
    font-weight: 300;
    line-height: 1.02;
    color: var(--pg-ink);
    margin: 0 0 28px;
    letter-spacing: -0.035em;
}
.pg-hero h1 span {
    font-style: italic;
    color: var(--pg-ember);
    font-weight: 400;
}
.pg-hero-content p {
    font-size: 1.1rem;
    color: var(--pg-graphite);
    max-width: 44ch;
    margin: 0 0 40px;
    line-height: 1.55;
}
.pg-hero-buttons {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
/* Hero's second button — shortcode ships inline style="color:#fff" which was
   meant for a dark hero. Force the light-hero palette. */
.pg-hero-buttons .pg-btn[style],
.pg-hero-buttons a[style] {
    background: transparent !important;
    color: var(--pg-ink) !important;
    border: 1px solid var(--pg-line-2) !important;
}
.pg-hero-buttons .pg-btn[style]:hover,
.pg-hero-buttons a[style]:hover {
    background: var(--pg-ink) !important;
    color: var(--pg-ivory) !important;
    border-color: var(--pg-ink) !important;
}
/* (Hero editorial rule moved into .pg-hero-meta's border-top.) */

/* ==========================================================================
   TRUST ROW — "OUTFITTING" brands with actual contrast.
   ========================================================================== */
.pg-brands-strip {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 48px 64px;
    max-width: 1100px;
    margin: 0 auto;
    padding: 32px 0;
}
.pg-brand-logo {
    font-family: 'Fraunces', serif;
    font-weight: 500;
    font-style: italic;
    font-size: 1.15rem;
    color: var(--pg-ink-2);
    opacity: 0.85;
    letter-spacing: -0.01em;
    transition: var(--pg-transition);
    position: relative;
    padding: 4px 2px;
    text-decoration: none !important;
    border-bottom: 1px solid transparent !important;
    cursor: pointer;
}
.pg-brand-logo:hover,
.pg-brand-logo:focus-visible {
    opacity: 1;
    color: var(--pg-ember) !important;
    border-bottom-color: var(--pg-ember) !important;
    outline: none;
}
/* Replace the "Trusted by Teams Everywhere" heading with an eyebrow. */
.wp-block-heading.has-text-align-center[style*="font-size:2rem"] {
    font-family: 'Geist', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase;
    color: var(--pg-graphite) !important;
    margin-bottom: 8px !important;
}
.wp-block-heading.has-text-align-center[style*="font-size:2rem"] + p {
    font-family: 'Fraunces', serif !important;
    font-size: 1.3rem !important;
    font-style: italic;
    color: var(--pg-ink) !important;
}

/* ==========================================================================
   CATEGORY GRID — bone cards, fine keyline, typographic.
   Replaces the pastel-icon starter-template look.
   ========================================================================== */
.pg-categories-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(20px, 4vw, 48px);
    background: var(--pg-ivory);
    border-top: 1px solid var(--pg-line);
    border-left: 1px solid var(--pg-line);
}
.pg-categories-grid .pg-category-card {
    border-right: 1px solid var(--pg-line);
    border-bottom: 1px solid var(--pg-line);
}
@media (max-width: 900px) {
    .pg-categories-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
    .pg-categories-grid { grid-template-columns: 1fr; }
}
.pg-category-card {
    display: flex !important;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    background: var(--pg-ivory) !important;
    padding: 40px 32px !important;
    min-height: 280px;
    text-decoration: none !important;
    color: var(--pg-ink) !important;
    border: none !important;
    border-radius: 0 !important;
    transition: var(--pg-transition);
    overflow: hidden;
}
.pg-category-card::before {
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(135deg, var(--pg-bone) 0%, transparent 60%);
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 0;
}
.pg-category-card:hover {
    background: var(--pg-paper) !important;
    color: var(--pg-ink) !important;
}
.pg-category-card:hover::before { opacity: 1; }
.pg-category-card > * { position: relative; z-index: 1; }
.pg-cat-icon {
    width: 40px !important; height: 40px !important;
    background: transparent !important;
    border: 1px solid var(--pg-line-2) !important;
    border-radius: 2px !important;
    display: flex !important;
    align-items: center; justify-content: center;
    color: var(--pg-ink) !important;
    margin-bottom: 48px !important;
}
.pg-cat-icon svg { width: 20px !important; height: 20px !important; stroke: var(--pg-ink) !important; }
.pg-category-card h3 {
    font-family: 'Fraunces', serif !important;
    font-size: 2rem !important;
    font-weight: 400 !important;
    margin: 0 0 8px !important;
    letter-spacing: -0.02em;
}
.pg-category-card p {
    font-size: 0.9rem !important;
    color: var(--pg-graphite) !important;
    margin: 0 0 24px !important;
    line-height: 1.5;
}
.pg-cat-link {
    font-family: 'Geist', sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase;
    color: var(--pg-ember) !important;
    padding-top: 16px !important;
    border-top: 1px solid var(--pg-line) !important;
    display: inline-flex; align-items: center; gap: 8px;
}
.pg-cat-link::after { content: "→"; transition: transform 0.2s ease; }
.pg-category-card:hover .pg-cat-link::after { transform: translateX(3px); }

/* ==========================================================================
   FEATURES / TESTIMONIALS / STATS — editorial cards.
   ========================================================================== */
.pg-features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 32px;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(20px, 4vw, 48px);
}
.pg-feature-card,
.pg-testimonial {
    background: var(--pg-paper);
    border: 1px solid var(--pg-line);
    border-radius: var(--pg-radius);
    padding: 36px 32px;
    transition: var(--pg-transition);
    position: relative;
}
.pg-feature-card:hover,
.pg-testimonial:hover {
    border-color: var(--pg-ink);
    transform: translateY(-2px);
}
.pg-feature-icon {
    font-size: 28px;
    margin-bottom: 20px;
    color: var(--pg-ember);
    filter: grayscale(0.1);
}
.pg-testimonial p {
    font-family: 'Fraunces', serif;
    font-style: italic;
    font-size: 1.15rem;
    line-height: 1.5;
    color: var(--pg-ink);
    margin: 0 0 20px;
}
.pg-testimonial-author {
    font-family: 'Geist', sans-serif;
    font-size: 13px;
    font-weight: 500;
    color: var(--pg-graphite);
    letter-spacing: 0.02em;
}

/* ==========================================================================
   CTA SECTION
   ========================================================================== */
.pg-cta {
    background: var(--pg-ink) !important;
    color: var(--pg-ivory) !important;
    padding: clamp(60px, 10vw, 120px) 0 !important;
    text-align: center;
}
.pg-cta h2 {
    color: var(--pg-ivory) !important;
    max-width: 22ch;
    margin: 0 auto 20px;
}
.pg-cta p { color: rgba(250,248,244,0.7) !important; max-width: 52ch; margin: 0 auto 40px; }
.pg-cta .pg-btn {
    background: var(--pg-ember) !important;
    border-color: var(--pg-ember) !important;
}
.pg-cta .pg-btn:hover { background: var(--pg-ivory) !important; color: var(--pg-ink) !important; border-color: var(--pg-ivory) !important; }

/* ==========================================================================
   WOOCOMMERCE — SHOP GRID
   ========================================================================== */
.woocommerce-page, .woocommerce { background: var(--pg-ivory); }

.woocommerce .woocommerce-result-count {
    font-family: 'Geist', sans-serif;
    font-size: 13px;
    color: var(--pg-graphite);
    letter-spacing: 0.01em;
}
.woocommerce .woocommerce-ordering select {
    font-family: 'Geist', sans-serif;
    font-size: 14px;
    padding: 10px 36px 10px 16px;
    background: var(--pg-paper);
    border: 1px solid var(--pg-line-2);
    border-radius: var(--pg-radius);
    color: var(--pg-ink);
}

.woocommerce ul.products,
.woocommerce-page ul.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important;
    gap: 32px !important;
    margin: 32px 0 !important;
    padding: 0 !important;
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--pg-paper);
    border: 1px solid var(--pg-line);
    border-radius: var(--pg-radius);
    overflow: hidden;
    transition: var(--pg-transition);
    position: relative;
    display: flex;
    flex-direction: column;
}
.woocommerce ul.products li.product:hover {
    border-color: var(--pg-ink-2);
    transform: translateY(-3px);
    box-shadow: var(--pg-shadow-hover);
}
.woocommerce ul.products li.product a.woocommerce-loop-product__link {
    display: block;
    border-bottom: none !important;
}
.woocommerce ul.products li.product img,
.woocommerce ul.products li.product .attachment-woocommerce_thumbnail {
    display: block;
    margin: 0 !important;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    background: var(--pg-bone);
    transition: transform 0.5s ease;
    border-radius: 0 !important;
}
.woocommerce ul.products li.product:hover img { transform: scale(1.03); }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: 'Fraunces', serif !important;
    font-size: 1.05rem !important;
    font-weight: 500 !important;
    color: var(--pg-ink) !important;
    margin: 18px 20px 4px !important;
    padding: 0 !important;
    line-height: 1.3;
    letter-spacing: -0.01em;
}
.woocommerce ul.products li.product .price {
    font-family: 'Geist', sans-serif !important;
    font-size: 13px !important;
    color: var(--pg-ember) !important;
    margin: 0 20px 20px !important;
    display: block;
    letter-spacing: 0.01em;
    font-weight: 500;
}
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price .amount { color: var(--pg-ember) !important; font-weight: 500; }
.woocommerce ul.products li.product .button {
    display: none !important; /* card is the affordance, not a button */
}

/* Sale / onsale badge */
.woocommerce span.onsale {
    background: var(--pg-ember) !important;
    color: var(--pg-ivory) !important;
    font-family: 'Geist', sans-serif !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase;
    padding: 4px 10px !important;
    border-radius: var(--pg-radius) !important;
    top: 12px !important;
    left: 12px !important;
    right: auto !important;
    min-height: auto !important;
    min-width: auto !important;
    line-height: 1.4 !important;
}

/* Pagination */
.woocommerce nav.woocommerce-pagination ul {
    border: none !important;
    display: flex;
    gap: 6px;
    justify-content: center;
    margin-top: 48px !important;
}
.woocommerce nav.woocommerce-pagination ul li {
    border: none !important;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    border: 1px solid var(--pg-line-2) !important;
    border-radius: var(--pg-radius) !important;
    color: var(--pg-ink) !important;
    background: var(--pg-paper) !important;
    padding: 8px 14px !important;
    font-family: 'Geist', sans-serif;
    font-size: 13px;
    min-width: 38px;
    text-align: center;
}
.woocommerce nav.woocommerce-pagination ul li span.current {
    background: var(--pg-ink) !important;
    color: var(--pg-ivory) !important;
    border-color: var(--pg-ink) !important;
}

/* ==========================================================================
   WOOCOMMERCE — SINGLE PRODUCT (The main surface. This is the order composer.)
   ========================================================================== */
.single-product .site-main,
.single-product #main { background: var(--pg-ivory); }

.single-product .product-title.product-above,
.single-product .woocommerce-breadcrumb {
    max-width: 1280px;
    margin: 0 auto !important;
    padding: 24px clamp(20px, 4vw, 48px) 0 !important;
    font-family: 'Geist', sans-serif;
    font-size: 12px;
    color: var(--pg-muted);
    letter-spacing: 0.04em;
}
.single-product .woocommerce-breadcrumb a { color: var(--pg-graphite); border-bottom: none; }
.single-product .woocommerce-breadcrumb a:hover { color: var(--pg-ember); }

.single-product div.product {
    max-width: 1280px;
    margin: 32px auto !important;
    padding: 0 clamp(20px, 4vw, 48px) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) !important;
    gap: clamp(40px, 6vw, 80px) !important;
}
@media (max-width: 900px) {
    .single-product div.product { grid-template-columns: 1fr !important; }
}
.single-product div.product .woocommerce-product-gallery {
    width: 100% !important;
    float: none !important;
    background: var(--pg-paper);
    border: 1px solid var(--pg-line);
    border-radius: var(--pg-radius-lg);
    padding: 24px;
    position: sticky;
    top: 100px;
}
.single-product div.product .summary.entry-summary {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.single-product h1.product_title {
    font-family: 'Fraunces', serif !important;
    font-size: clamp(1.8rem, 3.2vw, 2.6rem) !important;
    font-weight: 400 !important;
    margin: 0 0 16px !important;
    letter-spacing: -0.02em;
}
.single-product .summary > .price,
.single-product .summary .woocommerce-Price-amount {
    font-family: 'Geist', sans-serif;
    color: var(--pg-ember) !important;
    font-size: 1.05rem;
    font-weight: 500;
    margin-bottom: 24px;
}
.single-product .summary .woocommerce-product-details__short-description {
    color: var(--pg-graphite);
    font-size: 1rem;
    line-height: 1.6;
    margin: 20px 0 32px;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--pg-line);
}

/* Pricing table (from ASI plugin — restyle via external selectors) */
.single-product .pgasi-pricing-table,
.pgasi-pricing-table {
    margin: 32px 0 !important;
    border: 1px solid var(--pg-line) !important;
    border-radius: var(--pg-radius-lg) !important;
    overflow: hidden;
    background: var(--pg-paper);
}
.pgasi-pricing-table h3,
.pgasi-pricing-table .pgasi-pricing-title {
    font-family: 'Geist', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase;
    color: var(--pg-ember) !important;
    padding: 18px 24px !important;
    margin: 0 !important;
    background: var(--pg-bone);
    border-bottom: 1px solid var(--pg-line);
}
.pgasi-pricing-table table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 !important;
}
.pgasi-pricing-table th,
.pgasi-pricing-table td {
    padding: 14px 24px !important;
    text-align: left !important;
    border: none !important;
    border-bottom: 1px solid var(--pg-line) !important;
    font-family: 'Geist', sans-serif !important;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
}
.pgasi-pricing-table th {
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase;
    color: var(--pg-muted) !important;
    background: transparent !important;
}
.pgasi-pricing-table td { color: var(--pg-ink); }
.pgasi-pricing-table tr:last-child td { border-bottom: none !important; }
.pgasi-pricing-table tr:hover td { background: var(--pg-ember-soft); color: var(--pg-ink); transition: background 0.2s ease; }
.pgasi-pricing-table td.pgasi-price,
.pgasi-pricing-table td:nth-child(2) {
    font-family: 'Fraunces', serif !important;
    font-size: 1.1rem;
    color: var(--pg-ink);
    font-weight: 500;
}

/* Setup charges panel */
.pgasi-setup-charges,
.woocommerce-product-details__short-description + .pgasi-setup-charges {
    background: var(--pg-ember-soft);
    border: 1px solid rgba(180,84,42,0.2);
    border-radius: var(--pg-radius);
    padding: 18px 22px;
    margin: 20px 0;
    font-size: 14px;
    color: var(--pg-ink);
}
.pgasi-setup-charges strong, .pgasi-setup-charges h4 {
    font-family: 'Geist', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase;
    color: var(--pg-ember) !important;
    display: block;
    margin: 0 0 8px !important;
}

/* Color swatches */
.pgasi-color-swatches {
    margin: 28px 0 !important;
}
.pgasi-color-swatches-label,
.pgasi-color-label {
    font-family: 'Geist', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase;
    color: var(--pg-graphite) !important;
    display: block;
    margin-bottom: 14px !important;
}
.pgasi-color-swatch,
.pgasi-color-swatches li,
.pgasi-color-dot {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    border: 2px solid var(--pg-paper) !important;
    box-shadow: 0 0 0 1px var(--pg-line-2), var(--pg-shadow-fine);
    display: inline-block !important;
    margin: 0 10px 10px 0 !important;
    cursor: pointer;
    transition: var(--pg-transition);
    position: relative;
}
.pgasi-color-swatch:hover,
.pgasi-color-dot:hover {
    transform: scale(1.12);
    box-shadow: 0 0 0 1px var(--pg-ink), 0 6px 16px rgba(11,29,46,0.12);
}
.pgasi-color-swatch.is-active,
.pgasi-color-swatch.selected,
.pgasi-color-dot.active {
    box-shadow: 0 0 0 2px var(--pg-ink) !important;
    transform: scale(1.1);
}

/* Decoration options */
.pgasi-decoration-options,
.pgasi-decoration-section {
    margin: 28px 0 !important;
    padding: 24px !important;
    background: var(--pg-paper);
    border: 1px solid var(--pg-line);
    border-radius: var(--pg-radius-lg);
}
.pgasi-decoration-options h4,
.pgasi-decoration-section h4,
.pgasi-decoration-title {
    font-family: 'Geist', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase;
    color: var(--pg-ember) !important;
    margin: 0 0 16px !important;
}
.pgasi-decoration-options label,
.pgasi-decoration-section label {
    font-family: 'Geist', sans-serif;
    font-size: 13px !important;
    font-weight: 500;
    color: var(--pg-graphite);
    display: block;
    margin-bottom: 8px;
}
.pgasi-decoration-options select,
.pgasi-decoration-section select,
.pgasi-decoration-options input[type="text"],
.pgasi-decoration-section input[type="text"] {
    width: 100% !important;
    padding: 12px 14px !important;
    background: var(--pg-ivory) !important;
    border: 1px solid var(--pg-line-2) !important;
    border-radius: var(--pg-radius) !important;
    font-family: 'Geist', sans-serif;
    font-size: 14px;
    color: var(--pg-ink);
    margin-bottom: 16px;
    transition: var(--pg-transition);
}
.pgasi-decoration-options select:focus,
.pgasi-decoration-section select:focus,
.pgasi-decoration-options input[type="text"]:focus,
.pgasi-decoration-section input[type="text"]:focus {
    outline: none;
    border-color: var(--pg-ink);
    box-shadow: 0 0 0 3px rgba(11,29,46,0.06);
}

/* Logo upload dropzone */
.pgasi-logo-upload,
.pgasi-logo-dropzone {
    border: 1.5px dashed var(--pg-line-2) !important;
    border-radius: var(--pg-radius-lg) !important;
    padding: 32px 24px !important;
    text-align: center;
    background: var(--pg-bone);
    color: var(--pg-graphite);
    font-family: 'Geist', sans-serif;
    font-size: 13px;
    transition: var(--pg-transition);
    margin: 20px 0;
}
.pgasi-logo-upload:hover,
.pgasi-logo-dropzone:hover {
    border-color: var(--pg-ember);
    background: var(--pg-ember-soft);
    color: var(--pg-ink);
}
.pgasi-logo-upload a, .pgasi-logo-dropzone a { color: var(--pg-ember); border-bottom: 1px solid var(--pg-ember); }

/* Shipping notice */
.pgasi-shipping-notice,
.pgasi-ship-notice {
    background: rgba(100,125,95,0.08) !important;
    border: 1px solid rgba(100,125,95,0.22) !important;
    border-radius: var(--pg-radius) !important;
    padding: 16px 20px !important;
    color: var(--pg-ink) !important;
    font-size: 13.5px !important;
    margin: 20px 0 !important;
    line-height: 1.55;
}
.pgasi-shipping-notice strong, .pgasi-ship-notice strong {
    color: var(--pg-sage);
    font-family: 'Geist', sans-serif;
    font-weight: 600;
}

/* Add-to-cart button + qty */
.single-product .summary form.cart {
    display: flex;
    gap: 12px;
    align-items: stretch;
    margin: 24px 0 !important;
    padding: 24px 0 !important;
    border-top: 1px solid var(--pg-line);
}
.single-product .summary form.cart .quantity input.qty {
    width: 72px;
    padding: 14px 12px;
    background: var(--pg-paper);
    border: 1px solid var(--pg-line-2);
    border-radius: var(--pg-radius);
    font-family: 'Geist', sans-serif;
    font-size: 15px;
    text-align: center;
    font-variant-numeric: tabular-nums;
}
.single-product .summary form.cart .single_add_to_cart_button {
    flex: 1 !important;
    justify-content: center;
    font-size: 14px !important;
}

/* Product tabs */
.single-product .woocommerce-tabs {
    grid-column: 1 / -1;
    margin: 48px 0 !important;
    padding: 48px 0 0 !important;
    border-top: 1px solid var(--pg-line);
}
.single-product .woocommerce-tabs ul.tabs {
    list-style: none;
    display: flex;
    gap: 32px;
    padding: 0 !important;
    margin: 0 0 32px !important;
    border: none !important;
}
.single-product .woocommerce-tabs ul.tabs::before,
.single-product .woocommerce-tabs ul.tabs::after { display: none !important; }
.single-product .woocommerce-tabs ul.tabs li {
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}
.single-product .woocommerce-tabs ul.tabs li a {
    padding: 12px 0 !important;
    font-family: 'Geist', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase;
    color: var(--pg-muted) !important;
    border-bottom: 2px solid transparent !important;
    background: transparent !important;
}
.single-product .woocommerce-tabs ul.tabs li.active a,
.single-product .woocommerce-tabs ul.tabs li a:hover {
    color: var(--pg-ink) !important;
    border-bottom-color: var(--pg-ember) !important;
}
.single-product .woocommerce-tabs .panel {
    padding: 24px 0 !important;
    font-size: 1rem;
    line-height: 1.7;
    color: var(--pg-graphite);
}
.single-product .woocommerce-tabs .panel h2 {
    font-family: 'Fraunces', serif;
    font-size: 1.6rem;
    color: var(--pg-ink);
    margin-bottom: 16px;
}

/* Related products */
.single-product .related.products {
    grid-column: 1 / -1;
    padding: 48px 0 !important;
    border-top: 1px solid var(--pg-line);
    margin-top: 32px !important;
}
.single-product .related.products > h2 {
    font-family: 'Fraunces', serif;
    font-size: 1.8rem;
    font-weight: 400;
    margin-bottom: 32px;
    color: var(--pg-ink);
}

/* ==========================================================================
   WOOCOMMERCE — CART + CHECKOUT
   ========================================================================== */
.woocommerce-cart table.cart,
.woocommerce-checkout table.shop_table {
    border: 1px solid var(--pg-line) !important;
    border-radius: var(--pg-radius-lg) !important;
    overflow: hidden;
    background: var(--pg-paper);
}
.woocommerce-cart table.cart th,
.woocommerce-checkout table.shop_table th,
.woocommerce-cart table.cart td,
.woocommerce-checkout table.shop_table td {
    border: none !important;
    border-bottom: 1px solid var(--pg-line) !important;
    padding: 16px 20px !important;
    font-family: 'Geist', sans-serif;
    font-size: 14px;
    color: var(--pg-ink);
    background: transparent !important;
}
.woocommerce-cart table.cart thead th,
.woocommerce-checkout table.shop_table thead th {
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase;
    color: var(--pg-muted) !important;
    background: var(--pg-bone) !important;
}

.woocommerce .cart_totals h2,
.woocommerce .cart-collaterals h2,
.woocommerce-checkout h3 {
    font-family: 'Geist', sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--pg-ember);
    margin: 0 0 16px;
}
.woocommerce form .form-row label {
    font-family: 'Geist', sans-serif;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.04em;
    color: var(--pg-graphite);
    margin-bottom: 6px;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea {
    padding: 12px 14px !important;
    background: var(--pg-paper) !important;
    border: 1px solid var(--pg-line-2) !important;
    border-radius: var(--pg-radius) !important;
    font-family: 'Geist', sans-serif;
    font-size: 14px;
    color: var(--pg-ink);
    transition: var(--pg-transition);
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row select:focus,
.woocommerce form .form-row textarea:focus {
    outline: none;
    border-color: var(--pg-ink);
    box-shadow: 0 0 0 3px rgba(11,29,46,0.06);
}

/* Block checkout compatibility */
.wc-block-checkout, .wc-block-cart {
    font-family: 'Geist', sans-serif;
}
.wc-block-components-title {
    font-family: 'Fraunces', serif !important;
    font-weight: 500 !important;
    letter-spacing: -0.01em;
}

/* WC notices */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    border-top: none !important;
    border-left: 3px solid var(--pg-ember) !important;
    background: var(--pg-paper) !important;
    color: var(--pg-ink) !important;
    padding: 16px 20px !important;
    border-radius: var(--pg-radius) !important;
    font-size: 14px !important;
    box-shadow: var(--pg-shadow);
}
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before { color: var(--pg-ember) !important; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
.site-footer, footer.site-footer, #colophon {
    background: var(--pg-ink) !important;
    color: rgba(250,248,244,0.7) !important;
    padding: 80px 0 40px !important;
    border-top: none !important;
    margin-top: 80px;
}
.site-footer *, #colophon * { color: inherit !important; }
.site-footer a, #colophon a {
    color: rgba(250,248,244,0.82) !important;
    border-bottom: 1px solid transparent !important;
}
.site-footer a:hover, #colophon a:hover {
    color: var(--pg-ember) !important;
    border-bottom-color: var(--pg-ember) !important;
}
.footer-widget-title {
    font-family: 'Geist', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase;
    color: rgba(250,248,244,0.5) !important;
    margin: 0 0 20px !important;
}
.footer-widget ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.footer-widget ul li {
    margin: 0 0 10px;
    font-size: 14px;
    list-style: none;
}
.footer-widget p {
    font-size: 14px;
    line-height: 1.6;
    color: rgba(250,248,244,0.65) !important;
}
.site-footer .site-info, #colophon .site-info {
    margin-top: 60px;
    padding-top: 32px;
    border-top: 1px solid rgba(250,248,244,0.1);
    font-size: 12px;
    color: rgba(250,248,244,0.5) !important;
    font-family: 'Geist', sans-serif;
    letter-spacing: 0.02em;
}

/* ==========================================================================
   LEDGER — the stats section. Editorial, full-width, typographic.
   ========================================================================== */
.pg-ledger {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(20px, 4vw, 48px);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-top: 2px solid var(--pg-ink);
    border-bottom: 1px solid var(--pg-line);
}
.pg-ledger__row {
    padding: 40px 24px 28px;
    border-right: 1px solid var(--pg-line);
    position: relative;
}
.pg-ledger__row:last-child { border-right: none; }
.pg-ledger__num {
    font-family: 'Fraunces', serif;
    font-size: clamp(2.4rem, 4.2vw, 3.6rem);
    font-weight: 400;
    line-height: 1;
    letter-spacing: -0.03em;
    color: var(--pg-ink);
    font-variant-numeric: tabular-nums;
    margin-bottom: 18px;
}
.pg-ledger__lbl {
    font-family: 'Geist', sans-serif;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--pg-graphite);
}
@media (max-width: 760px) {
    .pg-ledger { grid-template-columns: repeat(2, 1fr); }
    .pg-ledger__row:nth-child(2) { border-right: none; }
    .pg-ledger__row:nth-child(-n+2) { border-bottom: 1px solid var(--pg-line); }
}

/* ==========================================================================
   QUOTES — pull-quote + supporting rows. Magazine-style.
   ========================================================================== */
.pg-quotes {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(20px, 4vw, 48px);
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    gap: clamp(40px, 6vw, 96px);
    align-items: center;
}
.pg-quotes__feature {
    position: relative;
    padding-top: 56px;
}
.pg-quotes__feature::before {
    content: "\201C";
    position: absolute;
    top: -8px;
    left: 0;
    font-size: 5.5rem;
    line-height: 1;
    color: var(--pg-ember);
    font-family: 'Fraunces', serif;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 0;
}
.pg-quotes__feature blockquote {
    font-family: 'Fraunces', serif;
    font-size: clamp(1.4rem, 2.1vw, 1.8rem);
    font-style: italic;
    font-weight: 400;
    line-height: 1.4;
    color: var(--pg-ink);
    margin: 0 0 28px;
    padding: 0;
    border: none;
    border-left: 0;
    letter-spacing: -0.015em;
    max-width: 28ch;
}
.pg-quotes__feature figcaption {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-top: 20px;
    border-top: 1px solid var(--pg-line);
    max-width: 320px;
}
.pg-quotes__name {
    font-family: 'Geist', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: var(--pg-ink);
    letter-spacing: 0.01em;
}
.pg-quotes__role {
    font-family: 'Geist', sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: var(--pg-muted);
    letter-spacing: 0.02em;
}
.pg-quotes__list {
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.pg-quotes__row {
    margin: 0;
    padding: 0 0 28px;
    border-bottom: 1px solid var(--pg-line);
}
.pg-quotes__row:last-child { border-bottom: none; padding-bottom: 0; }
.pg-quotes__row blockquote {
    font-family: 'Fraunces', serif;
    font-size: 1.05rem;
    font-style: italic;
    color: var(--pg-ink);
    line-height: 1.55;
    margin: 0 0 14px;
    padding: 0;
    border: none;
    border-left: 0;
}
.pg-quotes__row figcaption {
    font-family: 'Geist', sans-serif;
    font-size: 12px;
    color: var(--pg-graphite);
    letter-spacing: 0.01em;
}
.pg-quotes__row figcaption .pg-quotes__name { color: var(--pg-ink); font-weight: 600; }
.pg-quotes__row figcaption .pg-quotes__role { color: var(--pg-muted); }

/* Kill any inherited blockquote border from Kadence or Gutenberg defaults. */
.pg-quotes blockquote,
.pg-quotes__feature blockquote,
.pg-quotes__row blockquote {
    background: transparent !important;
    border-left: 0 !important;
    box-shadow: none !important;
    quotes: none;
}
.pg-quotes blockquote::before,
.pg-quotes blockquote::after { content: none; }
@media (max-width: 960px) {
    .pg-quotes { grid-template-columns: 1fr; }
}

/* ==========================================================================
   FEATURED GRID — 4-col of real products on homepage.
   ========================================================================== */
.pg-featured-grid {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(20px, 4vw, 48px);
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 24px;
}
.pg-featured-card {
    display: flex;
    flex-direction: column;
    background: var(--pg-paper);
    border: 1px solid var(--pg-line);
    border-radius: var(--pg-radius);
    overflow: hidden;
    text-decoration: none !important;
    color: var(--pg-ink) !important;
    border-bottom: 1px solid var(--pg-line) !important;
    transition: var(--pg-transition);
}
.pg-featured-card:hover {
    border-color: var(--pg-ink) !important;
    transform: translateY(-3px);
    box-shadow: var(--pg-shadow-hover);
    color: var(--pg-ink) !important;
}
.pg-featured-card__img { display: block; aspect-ratio: 1 / 1; overflow: hidden; background: var(--pg-bone); }
.pg-featured-card__img img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}
.pg-featured-card:hover .pg-featured-card__img img { transform: scale(1.05); }
.pg-featured-card__body { padding: 18px 20px 22px; }
.pg-featured-card__body h3 {
    font-family: 'Fraunces', serif;
    font-size: 1.05rem;
    font-weight: 500;
    margin: 0 0 6px;
    color: var(--pg-ink);
    letter-spacing: -0.01em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.pg-featured-card__price {
    font-family: 'Geist', sans-serif;
    font-size: 13px;
    color: var(--pg-ember);
    font-weight: 500;
    letter-spacing: 0.01em;
}

/* Hide the raw "Featured Products" H2 so the shortcode's own title isn't doubled. */
.home h2.wp-block-heading + .pg-featured-grid { margin-top: 0; }

/* ==========================================================================
   ANIMATIONS — subtle, editorial. Progressively enhanced.

   Default state is VISIBLE so content never vanishes when JS/IntersectionObserver
   lags. When `<html>` gets a `js-animate-ready` class from promogosh.js, we
   switch into the staged fade-up; above-the-fold content (hero, categories)
   stays visible regardless so the first paint is clean.
   ========================================================================== */
.pg-animate {
    opacity: 1;
    transform: none;
    transition: opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1),
                transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.pg-animate.pg-in-view { opacity: 1; transform: translateY(0); }
/* Above-the-fold and structurally important content is ALWAYS visible — never
   depend on JS to reveal it. The hero, category grid, and shop cards must
   paint on first frame. JS can still layer in entrance animations via .pg-in-view. */
.pg-hero .pg-animate,
.pg-hero-content,
.pg-hero-content.pg-animate,
.pg-category-card,
.pg-category-card.pg-animate,
.woocommerce ul.products li.product.pg-animate,
.pg-feature-card.pg-animate,
.pg-testimonial.pg-animate {
    opacity: 1 !important;
    transform: none !important;
}
.pg-animate-delay-1 { transition-delay: 0.08s; }
.pg-animate-delay-2 { transition-delay: 0.16s; }
.pg-animate-delay-3 { transition-delay: 0.24s; }
.pg-animate-delay-4 { transition-delay: 0.32s; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 768px) {
    h1 { font-size: 2.4rem; }
    h2 { font-size: 1.8rem; }
    .pg-section { padding: 56px 0; }
    .pg-hero { padding: 56px 0 64px; }
    .pg-categories-grid { grid-template-columns: 1fr 1fr; }
    .single-product div.product .woocommerce-product-gallery { position: static; }
}
@media (max-width: 520px) {
    .pg-categories-grid { grid-template-columns: 1fr; }
    .woocommerce ul.products, .woocommerce-page ul.products {
        grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important;
        gap: 16px !important;
    }
}