*{ box-sizing:border-box; } img{ display:block; max-width:100%; height:auto; }
body{ margin:0; font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; background: var(--brand-bg); color:#0b1220; }
a{ color: var(--brand-primary); text-decoration:none; }
.container{ width:min(1280px,92%); margin:0 auto; }
.py{ padding:3rem 0; }

/* Header */
.site-header{ position:sticky; top:0; z-index:20; background:#fff; box-shadow:0 10px 30px rgba(2,6,23,.06); }
.header-top{ display:grid; grid-template-columns:auto 1fr; align-items:center; gap:1rem; padding:.5rem 0; }
.brand .brand-combo{ display:flex; align-items:center; gap:.9rem; }
.brand-bear{ height:140px; } .brand-wordmark{ height:200px; }
.menu-toggle{ justify-self:end; width:48px; height:44px; border:none; background:transparent; position:relative; }
.menu-toggle span{ position:absolute; left:10px; right:10px; height:3px; background: var(--brand-primary); border-radius:3px; transition:transform .25s, top .25s, opacity .25s; }
.menu-toggle span:nth-child(1){ top:12px;} .menu-toggle span:nth-child(2){ top:20px;} .menu-toggle span:nth-child(3){ top:28px; }

.primary-nav{ display:flex; gap:1rem; align-items:center; justify-content:flex-end; }
.primary-nav ul{ display:flex; gap:1.2rem; list-style:none; margin:0; padding:0; font-weight:700; }
.nav-cta{ display:flex; gap:.6rem; align-items:center; }
.header-top .btn{ border-radius:14px; padding:.8rem 1.1rem; font-weight:800; }
.cart{ font-size:1.4rem; }

/* Mobile overlay */
@media (max-width:900px){
  .header-top{ min-height:92px; }
  .brand-bear{ height:84px; } .brand-wordmark{ height:124px; }
  .menu-toggle{ height:40px; width:44px; }
  .primary-nav{ position:fixed; inset: var(--mobile-header-offset, 100px) 0 0 0; background:#fff; transform:translateY(-120%); opacity:0; pointer-events:none; transition:transform .25s, opacity .25s; display:flex; flex-direction:column; z-index:50; padding:.75rem .9rem .5rem; height:calc(100vh - var(--mobile-header-offset, 100px)); overflow:hidden; }
  .primary-nav.open{ transform:translateY(0); opacity:1; pointer-events:auto; }
  .primary-nav ul{ flex:1 1 auto; overflow:auto; -webkit-overflow-scrolling:touch; padding:.8rem 0 1rem; flex-direction:column; gap:.8rem; font-size:1.05rem; }
  .primary-nav .nav-cta{ position:sticky; bottom:0; background:linear-gradient(180deg, rgba(255,255,255,.6), #fff 40%); padding:.8rem .2rem .5rem; border-top:1px solid rgba(2,6,23,.08); display:flex; align-items:center; justify-content:space-between; gap:.6rem; }
  .menu-close{ position:absolute; top:10px; right:10px; width:36px; height:36px; border:none; background:transparent; display:block; }
  .menu-close span{ position:absolute; left:8px; right:8px; top:17px; height:2px; background:#0b1220; } .menu-close span:first-child{ transform:rotate(45deg);} .menu-close span:last-child{ transform:rotate(-45deg);}
}

/* Hero */
.hero{ background: linear-gradient(180deg,#fff, rgba(2,6,23,.02)); border-bottom:1px solid rgba(2,6,23,.06); }
.hero-inner{ display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:2rem; padding:2.6rem 0 2.2rem; }
.hero-copy h1{ font-size: clamp(2.4rem, 5.2vw, 3.8rem); margin:.2rem 0 .4rem; color:var(--brand-primary); }
.hero-copy .lead{ font-size:1.15rem; color:var(--brand-secondary); }
.hero-actions{ display:flex; gap:.8rem; margin-top:1rem; }
.hero-art img{ width:min(620px, 100%); filter: drop-shadow(0 28px 70px rgba(2,6,23,.15)); }
@media (max-width:1024px){ .hero-inner{ grid-template-columns:1fr; text-align:center; } .hero-actions{ justify-content:center; } .hero-art img{ width:min(520px,88%);} }

/* Cards */
.features{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.feature{ background:#fff; border-radius:20px; padding:1.2rem; box-shadow:0 12px 26px rgba(2,6,23,.06); }
.feature h3{ margin:.2rem 0 .4rem; color:var(--brand-primary); }
@media (max-width:900px){ .features{ grid-template-columns:1fr; gap:.9rem; } .feature{ padding:1rem; border-radius:18px; } }

/* Products and CTA */
.section-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:1rem; }
.section-head .link{ color:var(--brand-secondary); }
.cta-band{ background:var(--brand-primary); color:#fff; }
.cta-inner{ display:flex; align-items:center; justify-content:space-between; padding:2rem 0; }

/* Footer */
.site-footer{ background:#0f1324; color:#f1f5ff; }
.footer-grid{ display:grid; grid-template-columns:1.2fr .8fr .8fr; gap:1rem; padding:2rem 0; }
.footer-tagline{ margin:0; font-weight:600; opacity:.9; }
.copyright{ text-align:center; padding:1rem; opacity:.75; font-size:.9rem; }

/* Buttons */
.btn{ display:inline-block; background:var(--brand-primary); color:#fff; padding:.9rem 1.15rem; border-radius:14px; font-weight:800; }
.btn-accent{ background:var(--brand-accent); }
.btn-secondary{ background:#fff; color:var(--brand-primary); border:2px solid rgba(2,6,23,.12); }
.btn:hover{ transform:translateY(-1px); box-shadow:0 10px 22px rgba(2,6,23,.10); }

/* Woo tweaks */
.woocommerce ul.products li.product .button, .woocommerce div.product form.cart .button{ background:var(--brand-accent); color:#fff; border-radius:10px; }

/* Builder */
.builder{ display:grid; gap:2rem; }
.builder .canvas{ background:#fff; border-radius:22px; padding:1rem; display:flex; align-items:center; justify-content:center; min-height:380px; box-shadow:0 12px 26px rgba(2,6,23,.06); }
.builder .canvas img{ max-width:420px; }
.controls{ background:#fff; border-radius:22px; padding:1rem; box-shadow:0 12px 26px rgba(2,6,23,.06); }
.control{ margin-bottom:1rem; } .control label{ display:block; font-weight:800; margin-bottom:.5rem; }
.swatches{ display:flex; flex-wrap:wrap; gap:.5rem; }
.swatch{ border:2px solid var(--brand-primary); padding:.45rem .8rem; border-radius:999px; font-weight:700; background:#fff; cursor:pointer; }
.swatch.active{ background:var(--brand-primary); color:#fff; }
.add-to-cart[disabled]{ filter:grayscale(1) opacity(.6); cursor:not-allowed; }

/* v4.1 — Desktop inline nav & fixed mobile overlay */
.header-top{ grid-template-columns: auto 1fr auto; }
.primary-nav{ justify-content:center; }
.menu-toggle{ display:none; }
@media (max-width: 1024px){
  .menu-toggle{ display:block; }
  .primary-nav{ justify-content:flex-start; }
}

/* Desktop nav visible; overlay only used on mobile */
@media (min-width: 901px){
  .primary-nav{ position:static; transform:none; opacity:1; pointer-events:auto; height:auto; padding:0; }
  .primary-nav ul{ flex-direction:row; overflow:visible; }
  .primary-nav .nav-cta{ position:static; background:none; padding:0; border:0; }
  .menu-close{ display:none; }
}

/* Mobile overlay from top, links at top, sticky CTA bottom */
@media (max-width: 900px){
  :root{ --mobile-header-offset: 100px; }
  .menu-toggle{ display:block; }
  .primary-nav{
    position: fixed;
    top: var(--mobile-header-offset);
    left: 0; right: 0; bottom: 0;
    background:#fff;
    display:flex; flex-direction:column;
    transform: translateY(-120%);
    opacity:0; pointer-events:none;
    transition: transform .25s, opacity .25s;
    z-index: 60;
    padding: .75rem .9rem .5rem;
  }
  .primary-nav.open{ transform: translateY(0); opacity:1; pointer-events:auto; }
  .primary-nav ul{
    flex: 1 1 auto;
    overflow:auto;
    -webkit-overflow-scrolling: touch;
    margin: 0;
    padding: .6rem 0 1rem;
  }
  .primary-nav .nav-cta{
    position: sticky;
    bottom: 0;
    background: linear-gradient(180deg, rgba(255,255,255,.6), #fff 40%);
    padding: .8rem .2rem .5rem;
    border-top: 1px solid rgba(2,6,23,.08);
    display:flex; align-items:center; justify-content:space-between; gap:.6rem;
  }
  .primary-nav .cart{ font-size:1.4rem; padding:.6rem; }
  .menu-close{ position:absolute; top:10px; right:10px; width:36px; height:36px; border:none; background:transparent; display:block; }
  .menu-close span{ position:absolute; left:8px; right:8px; top:17px; height:2px; background:#0b1220; }
  .menu-close span:first-child{ transform:rotate(45deg); } .menu-close span:last-child{ transform:rotate(-45deg); }
}

/* v4.2 — Footer readability + remove bullets */
.site-footer,
.site-footer p,
.site-footer .footer-tagline { color:#ffffff; }

.site-footer a,
.site-footer .menu a,
.site-footer .social-col a {
  color:#ffffff;
  opacity:0.95;
  text-decoration:none;
}
.site-footer a:hover,
.site-footer .menu a:hover,
.site-footer .social-col a:hover {
  opacity:1;
  text-decoration:underline;
}

/* Remove bullets & tidy spacing */
.site-footer .menu,
.site-footer ul { list-style:none; margin:0; padding:0; }
.site-footer li { margin:.35rem 0; }
.site-footer li::marker { content:none; }

/* Stronger copyright contrast */
.site-footer .copyright { color:#e9ecff; opacity:.9; }

/* removed v4.3 inner-page header overrides *//* Ensure header overlaps nothing on inner pages */
.site-header{ z-index: 100; }
body:not(.home) .container.py{ padding-top: 2rem; }

/* Safety: if any large artwork sneaks into the header area on inner pages, constrain it */
body:not(.home) .hero-art img{ display:none !important; }

/* v4.4 — Consistent header on ALL pages (same as homepage) */
/* Desktop: inline nav centered, CTA/cart right; no hamburger */
@media (min-width: 901px){
  .header-top{ grid-template-columns: auto 1fr auto; align-items:center; min-height: 92px; padding: .4rem 0; }
  .brand-bear{ height: 110px; }  /* matches home scaling in theme */
  .brand-wordmark{ height: 160px; }
  .primary-nav{ position:static; transform:none; opacity:1; pointer-events:auto; height:auto; padding:0; display:flex; justify-content:center; align-items:center; gap:1rem; }
  .primary-nav ul{ display:flex; flex-direction:row; gap:1.2rem; list-style:none; margin:0; padding:0; font-weight:700; }
  .menu-toggle{ display:none !important; }
  .menu-close{ display:none !important; }
}

/* Mobile overlay (unchanged) */
@media (max-width: 900px){
  :root{ --mobile-header-offset: 100px; }
  .header-top{ min-height:92px; }
  .brand-bear{ height:84px; } .brand-wordmark{ height:124px; }
  .menu-toggle{ display:block; }
  .primary-nav{
    position: fixed;
    inset: calc(var(--mobile-header-offset, 120px) + env(safe-area-inset-top)) 0 0 0;
    background:#fff;
    display:flex; flex-direction:column;
    transform: translateY(-120%);
    opacity:0; pointer-events:none;
    transition: transform .25s, opacity .25s;
    z-index: 60;
    padding: .75rem .9rem .5rem;
    height: calc(100vh - var(--mobile-header-offset));
    overflow:hidden;
  }
  .primary-nav.open{ transform: translateY(0); opacity:1; pointer-events:auto; }
  .primary-nav ul{ flex:1 1 auto; overflow:auto; -webkit-overflow-scrolling:touch; margin:0; padding:.6rem 0 1rem; }
  .primary-nav .nav-cta{ position:sticky; bottom:0; background:linear-gradient(180deg, rgba(255,255,255,.6), #fff 40%); padding:.8rem .2rem .5rem; border-top:1px solid rgba(2,6,23,.08); display:flex; align-items:center; justify-content:space-between; gap:.6rem; }
  .primary-nav .cart{ font-size:1.4rem; padding:.6rem; }
}

/* Keep hero only on home */
body:not(.home) .hero{ display:none !important; }

/* v4.5 — Make all non-home pages match header/topper of index */
body:not(.home) .hero,
body.page .hero,
body.woocommerce-page .hero { display:none !important; }

/* Prevent hero artwork bleed anywhere except home */
body:not(.home) .hero-art,
body:not(.home) .hero-art img { display:none !important; }

/* Consistent header behavior everywhere */
.site-header{ position:sticky; top:0; z-index:100; background:#fff; }
.header-top{ grid-template-columns:auto 1fr auto; align-items:center; }
@media (min-width:901px){
  .primary-nav{ position:static; transform:none; opacity:1; pointer-events:auto; height:auto; padding:0; }
  .primary-nav ul{ display:flex; gap:1.2rem; list-style:none; margin:0; padding:0; }
  .menu-toggle, .menu-close{ display:none !important; }
}
/* Page content spacing under header (inner pages) */
body:not(.home) .site-main .container.py{ padding-top: 2rem; }

/* v4.6 — Consistent inner pages + WooCommerce */
.page-header{ background:linear-gradient(180deg,#fff, rgba(2,6,23,.02)); border-bottom:1px solid rgba(2,6,23,.06); }
.page-header .container{ padding:1.4rem 0; }
.page-header h1{ margin:0; font-size: clamp(1.6rem, 3.2vw, 2.2rem); color:var(--brand-primary); }

/* Kill any hero/art outside the homepage, even if a plugin or block injects it */
body:not(.home) section.hero,
body:not(.home) .hero,
body:not(.home) .hero-inner,
body:not(.home) .hero-art,
body:not(.home) .hero-art img{ display:none !important; }

/* Make sure the header sits above everything */
.site-header{ position:sticky; top:0; z-index:100; background:#fff; }

/* v4.7 — HIDE hero on all non-home & Woo pages; compact, consistent header */
body:not(.home) section.hero,
body:not(.home) .hero,
body:not(.home) .hero-inner,
body:not(.home) .hero-art,
body:not(.home) .hero-art img,
body.woocommerce-page section.hero,
body.woocommerce-page .hero,
body.woocommerce-page .hero-inner,
body.woocommerce-page .hero-art,
body.woocommerce-cart .hero,
body.woocommerce-checkout .hero,
body.woocommerce-account .hero { display:none !important; }

.site-header { position: sticky; top: 0; z-index: 100; background:#fff; }
.header-top { display:grid; grid-template-columns:auto 1fr auto; align-items:center; }

/* Desktop: compact brand + no hamburger */
@media (min-width:901px){
  .header-top{ min-height:84px !important; padding:.25rem 0 !important; }
  .brand-bear{ height:72px !important; }
  .brand-wordmark{ height:104px !important; }
  .primary-nav{ position:static !important; transform:none !important; opacity:1 !important; pointer-events:auto !important; height:auto !important; padding:0 !important; z-index:2; }
  .primary-nav ul{ display:flex; gap:1.2rem; list-style:none; margin:0; padding:0; align-items:center; }
  .menu-toggle, .menu-close{ display:none !important; }
  .brand{ position:relative; z-index:3; }
}

/* Mobile: tidy header + overlay starts below it */
@media (max-width:900px){
  .header-top{ min-height:72px !important; }
  .brand-bear{ height:60px !important; }
  .brand-wordmark{ height:88px !important; }
  :root{ --mobile-header-offset: 92px; }
  .primary-nav{ inset: calc(var(--mobile-header-offset, 120px) + env(safe-area-inset-top)) 0 0 0; }
}

/* v4.8 — Larger top-left logos on all pages */
@media (min-width:901px){
  .header-top{ min-height:96px !important; padding:.35rem 0 !important; }
  .brand-bear{ height:88px !important; }
  .brand-wordmark{ height:128px !important; }
}
@media (max-width:900px){
  .header-top{ min-height:84px !important; }
  .brand-bear{ height:72px !important; }
  .brand-wordmark{ height:104px !important; }
  :root{ --mobile-header-offset: 100px; }
  .primary-nav{ inset: calc(var(--mobile-header-offset, 120px) + env(safe-area-inset-top)) 0 0 0; }
}

/* v4.9 — Even larger brand sizes globally */
@media (min-width:901px){
  .header-top{ min-height:108px !important; padding:.4rem 0 !important; }
  .brand-bear{ height:100px !important; }
  .brand-wordmark{ height:148px !important; }
}
@media (max-width:900px){
  .header-top{ min-height:92px !important; }
  .brand-bear{ height:80px !important; }
  .brand-wordmark{ height:116px !important; }
  :root{ --mobile-header-offset: 104px; }
  .primary-nav{ inset: calc(var(--mobile-header-offset, 120px) + env(safe-area-inset-top)) 0 0 0; }
}

/* v4.10 — +50% larger brand globally */
@media (min-width:901px){
  .header-top{ min-height:156px !important; padding:.5rem 0 !important; }
  .brand-bear{ height:150px !important; }
  .brand-wordmark{ height:222px !important; }
}
@media (max-width:900px){
  .header-top{ min-height:138px !important; }
  .brand-bear{ height:120px !important; }
  .brand-wordmark{ height:174px !important; }
  :root{ --mobile-header-offset: 146px; } /* ensure overlay starts below larger header */
  .primary-nav{ inset: calc(var(--mobile-header-offset, 120px) + env(safe-area-inset-top)) 0 0 0; }
}

/* v4.11 — Mobile overlay sits lower under larger header */
@media (max-width: 900px){
  :root{ --mobile-header-offset: 168px; } /* was ~146px; push further down */
  .primary-nav{
    inset: calc(var(--mobile-header-offset, 120px) + env(safe-area-inset-top)) 0 0 0;
    padding: 1.1rem .9rem .6rem; /* more breathing room at top */
  }
  .menu-close{ top: 14px; right: 12px; }
  .primary-nav ul{ padding-top: .2rem; }
}

/* v4.12 — Mobile menu even lower under the topper */
@media (max-width: 900px){
  :root{ --mobile-header-offset: 200px; } /* push further down */
  .primary-nav{
    inset: calc(var(--mobile-header-offset) + env(safe-area-inset-top)) 0 0 0;
    padding: 1.35rem .9rem .7rem;
  }
  .menu-close{ top: 18px; right: 14px; }
  .primary-nav ul{ padding-top: .25rem; }
}

/* v4.14 — smoother mobile overlay animation */
@media (max-width:900px){
  .primary-nav{ transition: transform .45s ease, opacity .45s ease; }
  .primary-nav.closing{ transform: translateY(-8%); opacity: .6; }
}

/* v4.16 — Latest posts grid on homepage */
.latest-posts .lp-head{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.latest-posts h2{ margin:0; font-size: clamp(1.4rem, 2.8vw, 1.8rem); }
.latest-posts .lp-more{ font-weight:700; text-decoration:none; color:var(--brand-primary); }
.latest-posts .lp-more:hover{ text-decoration:underline; }

.latest-posts .lp-grid{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:1rem; }
@media (max-width: 1024px){ .latest-posts .lp-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px){ .latest-posts .lp-grid{ grid-template-columns: 1fr; } }

.lp-card{ background:#fff; border:1px solid rgba(2,6,23,.06); border-radius:18px; overflow:hidden; box-shadow: 0 10px 30px rgba(2,6,23,.05); display:flex; flex-direction:column; }
.lp-card .thumb{ display:block; aspect-ratio: 16/9; background: #f3f6fb; position:relative; overflow:hidden; }
.lp-card .thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.lp-card .thumb-fallback{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; font-weight:800; color:#93A3B8; }

.lp-card .lp-body{ padding: .9rem 1rem 1rem; display:flex; flex-direction:column; gap:.5rem; }
.lp-card h3{ margin:0; font-size: clamp(1rem, 2.2vw, 1.15rem); }
.lp-card h3 a{ text-decoration:none; color:#0b1220; }
.lp-card h3 a:hover{ text-decoration:underline; }
.lp-card .lp-excerpt{ margin:0; color:#334155; line-height:1.45; min-height: 2.8em; }
.lp-card .lp-meta{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-top:.3rem; font-size:.9rem; color:#64748b; }
.lp-card .lp-read{ font-weight:700; text-decoration:none; color:var(--brand-primary); }
.lp-card .lp-read:hover{ text-decoration:underline; }
.lp-empty{ color:#64748b; }

/* v4.17 — Latest posts: compact card when no thumbnail */
.lp-card.no-thumb .lp-body{ padding-top: 1.1rem; }
.lp-card.no-thumb .thumb{ display:none; }

/* v4.17 — Footer menu (only if enabled) */
.footer-menu{ margin-top: .75rem; }
.footer-links{ list-style:none; display:flex; gap:1rem; margin:0; padding:0; flex-wrap:wrap; }
.footer-links a{ color:#fff; text-decoration:none; opacity:.95; }
.footer-links a:hover{ text-decoration:underline; opacity:1; }

/* v4.18 — Footer layout restore */
.site-footer .footer-top{ margin-bottom:.5rem; }
.site-footer .footer-bottom{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; }