/* ============================================================
   Avata Labs — design polish pass (Alpha-parity card anatomy)
   ============================================================ */

/* ---- Product cards: badges ---- */
.nvr-box { position: relative; border: 1px solid #e8edf3; border-radius: 14px; background: #fff;
  transition: transform .18s ease, box-shadow .18s ease; overflow: hidden; }
.nvr-box:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(27,42,74,.12); }
.nvr-img { display: block; position: relative; background: #f6f9fc; }
.nvr-img img { transition: transform .25s ease; }
.nvr-box:hover .nvr-img img { transform: scale(1.04); }

/* Popular: gold pill top-right */
.nvr-pop { position: absolute; top: 10px; right: 10px; left: auto; background: #ffc93c; color: #1b2a4a;
  font-size: 11px; font-weight: 800; letter-spacing: .02em; padding: 4px 10px; border-radius: 999px;
  box-shadow: 0 3px 8px rgba(0,0,0,.14); }
.nvr-pop::before { content: "\2605\00a0"; font-size: 10px; }

/* New: red ribbon top-left */
.nvr-new { position: absolute; top: 10px; left: -6px; background: #e02b2b; color: #fff;
  font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  padding: 4px 12px 4px 10px; border-radius: 0 6px 6px 0; box-shadow: 0 3px 8px rgba(0,0,0,.18); }
.nvr-new::after { content: ""; position: absolute; left: 0; bottom: -6px; border: 3px solid transparent;
  border-top-color: #8f1717; border-right-color: #8f1717; }

/* ---- Price typography: grey strike -> bold sale ---- */
.nvr-txt .price { display: block; margin: 6px 0 10px; font-size: 15px; }
.nvr-txt .price del { color: #9aa5b1; font-weight: 500; font-size: 13px; margin-right: 6px; }
.nvr-txt .price del .amount { color: #9aa5b1; }
.nvr-txt .price ins { text-decoration: none; }
.nvr-txt .price ins .amount, .nvr-txt .price > .amount { color: #17C0E0; font-weight: 800; font-size: 17px; }

/* ---- CTA: orange add-to-cart with cart glyph ---- */
.nvr-cart { display: block; text-align: center; background: #17C0E0; color: #fff !important;
  font-weight: 800; font-size: 14px; padding: 10px 12px; border-radius: 10px; margin: 0 12px 14px;
  transition: background .18s ease, transform .18s ease; }
.nvr-cart:hover { background: #12A3BF; transform: translateY(-1px); }

/* ---- Section rhythm: alternating band (Alpha peach -> Avata ice-blue) ---- */
.nvr-blk { padding: 34px 15px; }
.nvr-blk:nth-of-type(odd) { background: #f2f7fb; }
.nvr-blk .nvr-hd h2 { font-size: 26px; }
.nvr-blk .nvr-hd a { color: #17C0E0; font-weight: 700; }

/* ---- USP cards: icon chips instead of raw emoji ---- */
.nvu-card { border: 1px solid #e8edf3; border-radius: 16px; background: #fff; padding: 26px 20px;
  box-shadow: 0 8px 22px rgba(27,42,74,.05); transition: transform .18s ease, box-shadow .18s ease; }
.nvu-card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(27,42,74,.1); }
.nvu-card .ico { display: inline-flex; align-items: center; justify-content: center;
  width: 54px; height: 54px; border-radius: 50%; background: #fff0e4; font-size: 24px; margin-bottom: 12px; }

/* ---- Flash-sale countdown bar ---- */
.nv-flash { background: #101820; color: #ffd75e; text-align: center; padding: 8px 12px;
  font-size: 13px; font-weight: 800; letter-spacing: .04em; display: flex; gap: 14px;
  align-items: center; justify-content: center; flex-wrap: wrap; }
.nv-flash .nvf-units { display: inline-flex; gap: 6px; }
.nv-flash .nvf-unit { background: #1f2b38; color: #fff; border-radius: 6px; padding: 3px 7px;
  min-width: 34px; text-align: center; font-variant-numeric: tabular-nums; }
.nv-flash .nvf-unit small { display: block; font-size: 8px; font-weight: 600; color: #9fb2c5;
  letter-spacing: .08em; text-transform: uppercase; }
@media (max-width: 600px) { .nv-flash { font-size: 11px; gap: 8px; padding: 6px 8px; } }

/* ---- Category tiles: hover lift + arrow nudge ---- */
.nvc-card, .nvp-card { transition: transform .18s ease, box-shadow .18s ease; }
.nvc-card:hover, .nvp-card:hover { transform: translateY(-4px); box-shadow: 0 18px 38px rgba(27,42,74,.16); }

/* ---- FAQ contact CTA card (Alpha pattern) ---- */
.nvq-img{position:relative}
.nvq-ctct{position:absolute;left:18px;bottom:18px;background:#fff;border-radius:12px;padding:14px 22px;box-shadow:0 6px 24px rgba(27,42,74,.18);text-decoration:none;transition:.2s;display:block}
.nvq-ctct:hover{transform:translateY(-3px);box-shadow:0 10px 30px rgba(27,42,74,.25)}
.nvq-ctct p{margin:0;color:#5a6577;font-size:14px;line-height:1.45}
.nvq-ctct strong{color:#1b2a4a;font-size:16px}

/* ---- Category tile hover affordance (Alpha pattern) ---- */
.nvc-card .nvc-arrow{transition:.25s;box-shadow:0 3px 10px rgba(0,0,0,.15)}
.nvc-card:hover .nvc-arrow{transform:translateX(4px);background:#1b2a4a}
.nvc-card:hover .nvc-arrow svg{color:#fff}
.nvc-card{transition:transform .3s ease,box-shadow .3s ease,background-size .45s ease}
.nvc-card:hover{background-size:88% auto}

/* === 07-18 polish: shop pagination (was inheriting checkmark li bullets) === */
.woocommerce-pagination{margin:30px 0 10px;text-align:center}
.woocommerce-pagination ul.page-numbers{display:inline-flex!important;gap:8px;list-style:none;margin:0;padding:0}
.woocommerce-pagination ul.page-numbers li{background:none!important;padding:0!important;margin:0!important;display:inline-block!important}
.woocommerce-pagination .page-numbers li .page-numbers,
.woocommerce-pagination li>.page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 12px;border:1px solid #e3d8ca;border-radius:10px;background:#fff;color:#3A210F;font-weight:600;text-decoration:none;transition:all .15s}
.woocommerce-pagination li>a.page-numbers:hover{border-color:#17C0E0;color:#17C0E0}
.woocommerce-pagination li>span.page-numbers.current{background:#0E2444;border-color:#0E2444;color:#fff}
/* ===== AAA-MOBILE-FIXES 2026-07-25 — mobile compliance audit remediation ===== */

/* C2 — cart table forced 780px width at mobile → card layout */
@media screen and (max-width: 600px) {
  .post-inner-content .entry-content .cart-flx form .cart-tab table { width: 100% !important; }
  .post-inner-content .entry-content .cart-flx form .cart-tab table thead { display: none; }
  .woocommerce table.shop_table_responsive tr,
  .post-inner-content .entry-content .cart-flx form .cart-tab table tbody tr {
    display: flex; flex-wrap: wrap; align-items: center;
    padding: 12px 0; border-bottom: 1px solid #e8e8e8;
  }
  .post-inner-content .entry-content .cart-flx form .cart-tab table tbody tr td {
    width: auto !important; display: inline-block; border: none; padding: 4px 8px;
  }
  .post-inner-content .entry-content .cart-flx form .cart-tab table tbody tr td.product-thumbnail { width: 25% !important; }
  .post-inner-content .entry-content .cart-flx form .cart-tab table tbody tr td.product-name { width: 70% !important; }
  .post-inner-content .entry-content .cart-flx form .cart-tab table tbody tr td:first-of-type a { height: 70px; width: 70px; }
}

/* C3 — checkout sidebar must stack on phones */
@media screen and (max-width: 767px) {
  .checkout-blk .chec .wc-block-components-sidebar-layout { flex-direction: column; }
  .checkout-blk .chec .wc-block-components-sidebar-layout .wc-block-components-main { width: 100%; padding-right: 0; }
  .checkout-blk .chec .wc-block-components-sidebar { width: 100%; padding-left: 0; margin-top: 20px; }
  .checkout-blk .chec .is-large .wc-block-checkout__sidebar.is-sticky { position: static; }
}

/* M1 — countdown unit labels 8px → 10px */
@media (max-width: 600px) { .nv-flash .nvf-unit small { font-size: 10px; } }

/* M2 — RUO compliance bar readability */
@media (max-width: 480px) {
  body > div[style*="0a3d3d"], .ruo-compliance-bar { font-size: 11px; padding: 6px 12px; line-height: 1.5; }
}

/* M3 — category card arrows must hit 44px tap target */
@media (max-width: 640px) {
  .nvc-arrow { width: 44px; height: 44px; }
  .nvc-arrow svg { width: 18px; height: 18px; }
}

/* M4 — proceed-to-checkout button fixed padding overflow */
@media (max-width: 480px) {
  .post-inner-content .entry-content .cart-flx .cart-collaterals .cart_totals .wc-proceed-to-checkout a {
    padding: 12px 20px; width: 100%; text-align: center; box-sizing: border-box;
  }
}

/* M6 — search must expand to full width on focus, not stay a 44px icon */
@media (max-width: 650px) {
  header .top_head .top_head_inr .mid ul li.search:focus-within {
    position: fixed; top: 0; left: 0; right: 0; width: 100%; height: auto;
    z-index: 9999; background: #fff; padding: 12px 16px; box-shadow: 0 4px 20px rgba(0,0,0,.15);
  }
  header .top_head .top_head_inr .mid ul li.search:focus-within input { width: 100%; font-size: 16px; }
}

/* M7 — product badges below 12px */
.nvr-pop, .nvr-new { font-size: 12px !important; }

/* N1 — simple banner bar sizing on narrow screens */
@media (max-width: 480px) {
  #simple-banner, .simple-banner { font-size: 12px !important; padding: 7px 12px !important; }
}

/* N3 — floating SEO badges overlap at mobile */
@media (max-width: 640px) { .nvm-badge { display: none; } }

/* N5 — footer disclaimer legibility */
@media (max-width: 480px) { .footer-disclaimer p { font-size: 11px; line-height: 1.6; } }

/* N6 — flash bar stacks tall at 375px */
@media (max-width: 400px) {
  .nv-flash { flex-direction: column; gap: 4px; padding: 5px 8px; }
  .nv-flash .nvf-msg { font-size: 10px; }
}

/* ===== AAA-PRODUCT-IMG-FIT 2026-07-25 — never squash a non-square product image ===== */
ul.products li.product img,
li.product a img,
.woocommerce ul.products li.product img {
  object-fit: contain !important;
  background: #fff;
}

/* ===== AAA-CHECKOUT-MOBILE-FIX 2026-07-26 =====
   WooCommerce checkout overflowed to 425px on a 390px viewport: select2 and the
   state select render at a fixed width and push past the viewport edge. Also
   belt-and-braces horizontal-overflow guard on the money pages. */
@media (max-width: 900px) {
  .woocommerce form .form-row,
  .woocommerce-checkout .form-row,
  .woocommerce-billing-fields .form-row,
  .woocommerce-shipping-fields .form-row {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .woocommerce form .form-row input.input-text,
  .woocommerce form .form-row textarea,
  .woocommerce form .form-row select,
  select.state_select,
  select.country_select,
  .select2-container,
  .select2-container .select2-selection--single {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .woocommerce table.shop_table,
  .woocommerce-checkout-review-order-table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
  }
  .woocommerce table.shop_table th,
  .woocommerce table.shop_table td {
    word-break: break-word;
    overflow-wrap: anywhere;
  }
  html, body { overflow-x: clip !important; } /* AAA-STICKY-OVERFLOW-CLIP-20260820: clip, not hidden — hidden forces overflow-y:auto and kills position:sticky */
}

/* ===== AAA-SELECT2-OVERFLOW-FIX 2026-07-26 =====
   Root cause of the 425px checkout overflow on a 390px viewport: select2 clones
   the original <select> as .select2-hidden-accessible and parks it via absolute
   positioning; it keeps its full width and extends past the viewport edge.
   Clipping it (not just width:100%) is what actually removes the scroll. */
.select2-hidden-accessible {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  max-width: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
  left: 0 !important;
}

/* ===== AAA-BRAND-COLOR-FIX 2026-07-26 =====
   The inherited theme shipped #17C0E0 orange for prices, Add-to-cart buttons and
   several accent surfaces. Brand canon (AVATALABS-BRAND-SPEC.md v2.0) is
   deep navy #0E2444 + electric cyan #17C0E0 ONLY. Orange is off-brand and clashed
   with the navy/cyan product photography and header.
   Loaded after new_style_1.css, so these win without editing the vendor file.
   Rollback: /root/bak-cosmetics-20260726/design-polish.css.bak
   ========================================================================== */

:root {
  --avata-navy: #0E2444;
  --avata-navy-700: #14315c;
  --avata-cyan: #17C0E0;
  --avata-cyan-600: #12a3bf;
}

/* Price: orange -> navy (high contrast, brand-correct) */
ul.products li.product .price,
ul.products li.product .price ins,
.woocommerce ul.products li.product .price {
  color: var(--avata-navy) !important;
}

/* Primary buy buttons: orange -> cyan-to-navy brand treatment */
ul.products li.product .button,
ul.products li.product .add_to_cart_button,
.woocommerce a.button.add_to_cart_button,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt {
  background: var(--avata-cyan) !important;
  color: #fff !important;
  border-color: var(--avata-cyan) !important;
}

ul.products li.product .button:hover,
ul.products li.product .add_to_cart_button:hover,
.woocommerce a.button.add_to_cart_button:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover {
  background: var(--avata-cyan-600) !important;
  border-color: var(--avata-cyan-600) !important;
}

/* Newsletter / subscribe submit buttons */
.newsletter button,
.newsletter input[type="submit"],
.footer-newsletter button,
form.newsletter-form button {
  background: var(--avata-cyan) !important;
  border-color: var(--avata-cyan) !important;
  color: #fff !important;
}

/* Any residual orange accents inherited from the base theme */
.woocommerce .onsale,
.woocommerce span.onsale {
  background: var(--avata-navy) !important;
  color: #fff !important;
}

/* ===== AAA-DESIGN-AUDIT-0728 ===== */
/* Sort dropdown: styled select (shop + category) */
.woocommerce-ordering select, select.orderby{
  -webkit-appearance:none;appearance:none;
  background:#fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"><path d="M1 1l5 5 5-5" stroke="%230E2444" stroke-width="2" fill="none" stroke-linecap="round"/></svg>') no-repeat right 12px center;
  border:1px solid #cfdae6;border-radius:8px;padding:9px 34px 9px 12px;
  font-size:13px;color:#0E2444;font-weight:600;cursor:pointer;line-height:1.3;
}
.woocommerce-ordering select:focus{outline:none;border-color:#17C0E0;box-shadow:0 0 0 3px rgba(23,192,224,.15)}

/* Product-card titles: 2-line clamp for even card heights */
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2.woocommerce-loop-product__title{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;min-height:2.6em;line-height:1.3em;
}

/* Card CTAs: one primary. Demote Learn More to text link */
.nl-learn-more-btn{
  background:transparent!important;border:none!important;color:#51617a!important;
  font-size:12px!important;font-weight:600!important;text-decoration:underline!important;
  padding:4px 0!important;box-shadow:none!important;
}
.nl-learn-more-btn:hover{color:#0E2444!important}

/* PDP badges: brand navy/cyan (replace teal inline styles) */
.nl-tested-badges span:first-child{background:#0E2444!important;border-color:#0E2444!important}
.nl-tested-badges span:not(:first-child){background:#0B6E82!important;border-color:#0B6E82!important}

/* PDP COA panel: brand palette */
.nl-coa-section{background:#F0FAFD!important;border:1px solid #bfe7f2!important}
.nl-coa-section strong{color:#0E2444!important}
.nl-coa-section a{color:#0E86A8!important;border-color:#0E86A8!important}

/* Promise bar icons: cyan */
.nl-promise-bar svg{stroke:#12A3BF!important}

/* PDP: full-width add-to-cart on mobile + tighter summary */
@media(max-width:600px){
  .single-product form.cart{display:flex;flex-wrap:wrap;gap:10px}
  .single-product form.cart .qib-button-wrapper, .single-product form.cart > .quantity{flex:0 0 auto}
  .single-product form.cart .single_add_to_cart_button{flex:1 1 auto;width:auto;min-height:48px;font-size:15px}
  .nl-promise-bar{grid-template-columns:1fr!important;gap:8px!important;padding:12px!important}
  .nl-promise-bar>div{align-items:center!important}
}

/* Announcement stack: slim on mobile */
@media(max-width:600px){
  .nv-flash .nvf-msg{font-size:10px;line-height:1.25}
  .nv-flash{padding:4px 8px}
  .nv-flash .nvf-unit{padding:2px 5px;font-size:11px}
}

/* Footer: clear the floating cart bubble */
@media(max-width:600px){ .main_footer{padding-bottom:96px} }

/* Woo tabs: consistent brand styling */
.woocommerce-tabs ul.tabs li a{color:#51617a}
.woocommerce-tabs ul.tabs li.active a{color:#0E2444;border-bottom:2px solid #17C0E0}
/* ===== /AAA-DESIGN-AUDIT-0728 ===== */

/* AAA-DESIGN-AUDIT-0728b: unify PDP tab pills (kill teal/black mismatch) */
.woocommerce div.product .woocommerce-tabs ul.tabs li,
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{
  background:#eef3f8!important;border:1px solid #d7e2ec!important;border-radius:8px 8px 0 0!important;margin:0 4px 0 0!important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active{background:#0E2444!important;border-color:#0E2444!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{color:#3a4a5e!important;font-weight:600!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:#fff!important;border-bottom:none!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none!important}
.woocommerce div.product .woocommerce-tabs ul.tabs{padding:0!important;border-bottom:2px solid #0E2444!important;margin-bottom:18px!important}
.woocommerce div.product .woocommerce-tabs ul.tabs::before{border:none!important}

/* AAA-DESIGN-AUDIT-0728c: anchors carry the legacy teal/black — neutralize */
.woocommerce div.product .woocommerce-tabs ul.tabs li a,
.tabs-blk ul li a{background:transparent!important;width:auto!important;border-radius:0!important;padding:12px 18px!important;margin:0!important}
.tabs-blk ul li a.active,
.woocommerce div.product .woocommerce-tabs ul.tabs li a.active{background:transparent!important;color:#fff!important}

/* AAA-DESIGN-AUDIT-0728d: quantity stepper brand styling */
.single-product form.cart > .quantity{background:#fff!important;border:1px solid #cfdae6!important;border-radius:8px!important;overflow:hidden}
.single-product form.cart > .quantity .qty{border:none!important;background:#fff!important;color:#0E2444!important;font-weight:700}
.single-product form.cart .quantity .plus,
.single-product form.cart .quantity .minus,
.single-product form.cart .quantity button{background:#0E2444!important;color:#fff!important;border:none!important}

/* AAA-DESIGN-AUDIT-0728e: exact clamp height (kill half-clipped 3rd line) + navy breadcrumb */
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2.woocommerce-loop-product__title{
  line-height:1.35em!important;padding-top:0!important;padding-bottom:0!important;max-height:2.7em!important;min-height:2.7em!important;overflow:hidden!important;box-sizing:content-box!important;margin:8px 0 6px!important;
}
.woocommerce-breadcrumb, .breadcrumb-blk, .brdcrmb-blk{background:#0E2444!important}

/* AAA-DESIGN-AUDIT-0728f: qib stepper (quantity plugin) brand styling */
.qib-button-wrapper{background:transparent!important;border:1px solid #cfdae6!important;border-radius:8px!important;overflow:hidden;display:inline-flex!important;align-items:stretch!important;padding:0!important}
.qib-button-wrapper .qib-button{background:#0E2444!important;color:#fff!important;border:none!important;width:40px!important;min-height:44px!important;font-size:18px!important}
.qib-button-wrapper .quantity,.qib-button-wrapper .wqpmb_quantity{margin:0!important;background:#fff!important}
.qib-button-wrapper .qty{border:none!important;background:#fff!important;color:#0E2444!important;font-weight:700!important;min-height:44px!important}
/* qib: flatten inner input so +/- stay visible */
.qib-button-wrapper .qty{border-radius:0!important;box-shadow:none!important;margin:0!important;width:56px!important;text-align:center!important}
.qib-button-wrapper .quantity{border:none!important;border-radius:0!important;box-shadow:none!important}
.qib-button-wrapper .qib-button{flex:0 0 40px!important;display:flex!important;align-items:center!important;justify-content:center!important;line-height:1!important}

/* qib final: kill negative margins + inner border */
.qib-button-wrapper .quantity,.qib-button-wrapper .wqpmb_quantity{border:none!important;border-radius:0!important;width:auto!important}
.qib-button-wrapper .qib-button{margin:0!important}
.qib-button-wrapper button.minus{margin-left:0!important}
.qib-button-wrapper button.plus{margin-right:0!important}


/* AAA-MEDIA-0728-card-scrim: category card titles are navy on light vial photography — add a soft
   white top scrim so the heading always sits on a near-white field. */
.nvc-card__inner::before{
  content:"";position:absolute;left:0;right:0;top:0;height:46%;
  background:linear-gradient(180deg,rgba(255,255,255,.92) 0%,rgba(255,255,255,.72) 55%,rgba(255,255,255,0) 100%);
  pointer-events:none;z-index:0;
}
.nvc-card__title,.nvc-arrow{position:relative;z-index:1}

/* 08-11: related products — containment ONLY when owl-carousel is not active (carousel peek is intentional on mobile) */
.related.products ul.products:not(.owl-loaded){display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%;margin:0 0 8px}
.related.products ul.products:not(.owl-loaded) li.product{width:100% !important;float:none !important;margin:0 !important;min-width:0;display:flex;flex-direction:column}
.related.products ul.products li.product .button,
.related.products ul.products li.product .add_to_cart_button{max-width:100%;box-sizing:border-box;white-space:normal}
@media(min-width:768px){.related.products ul.products:not(.owl-loaded){grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}}
/* 08-11: loop price — keep del+ins on one compact line, prevent ugly wraps */
.related.products ul.products li.product .price,
.woocommerce ul.products li.product .price{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:4px;line-height:1.25}
.woocommerce ul.products li.product .price del{font-size:.78em;opacity:1}
.woocommerce ul.products li.product .price ins{text-decoration:none;white-space:nowrap}

/* 08-11 Option A — full-bleed lab band */
.nva-band{position:relative;background:linear-gradient(160deg,#0b2545 0%,#123a6b 60%,#0e5f86 100%);color:#fff;padding:38px 22px 0;overflow:hidden;text-align:left}
.nva-in{max-width:1080px;margin:0 auto;position:relative;z-index:1}
.nva-glow{position:absolute;right:-70px;top:-70px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(0,180,216,.35),transparent 70%);z-index:0}
.nva-kick{color:#00b4d8;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.nva-band h2{font-size:25px;line-height:1.16;margin:10px 0;font-weight:800;color:#fff}
.nva-band p{font-size:14px;line-height:1.5;color:#cfe6f2;margin:0 0 16px;max-width:560px}
.nva-cta{display:inline-block;background:#00b4d8;color:#04283b;font-weight:800;font-size:14px;padding:12px 22px;border-radius:8px;text-decoration:none;margin-bottom:6px}
.nva-cta:hover{background:#2ec6e4;color:#04283b}
.nva-img{display:block;width:118%;margin-left:-9%;margin-top:8px;max-width:none}
@media(min-width:768px){.nva-band{padding:48px 32px 0}.nva-in{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:24px}.nva-img{width:100%;margin:0;grid-column:2;grid-row:1/span 4;border-radius:12px 12px 0 0}.nva-band h2{font-size:32px}}

/* ============================================================
   AAA-DESIGN-PASS-20260818 — Category cards, hover states,
   product rows, photo cards, mobile polish
   ============================================================ */

/* ─── 1. CATEGORY CARDS (tall, .nvc-card) ─────────────────────────────────
   FIXES:
   a) background-size:88% on hover → photo SHRINKS showing navy edges — KILLED
   b) white-fog ::before scrim at top — fights dark ::after gradient — REMOVED
   c) Hover: lift + deeper shadow only; photo stays cover at all times
   d) Arrow: cyan fill on hover, nudges right
   e) Title: stronger text-shadow for legibility over any photo
   ──────────────────────────────────────────────────────────────────────── */

/* Remove the white fog scrim — it washed out every card top */
.nvc-card__inner::before { display: none !important; }

/* Photo ALWAYS fills the card — never shrinks */
.nvc-card {
  background-size: cover !important;
  background-position: center !important;
  transition: transform .28s ease, box-shadow .28s ease !important;
  will-change: transform;
}
.nvc-card:hover {
  background-size: cover !important;
  transform: translateY(-6px) !important;
  box-shadow: 0 22px 44px rgba(6,26,48,.28) !important;
}

/* Inner: text at bottom, clean padding */
.nvc-card__inner {
  padding: 0 20px 22px !important;
  z-index: 2 !important;
}

/* Title: crisp white, bold */
.nvc-card__title {
  font-size: 1.3rem !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
  color: #fff !important;
  text-shadow: 0 2px 14px rgba(6,26,48,.75) !important;
  margin: 0 0 6px !important;
}

/* "Shop now ›" line */
.nvc-card__cta {
  color: rgba(255,255,255,.85) !important;
  font-size: .8rem !important;
  font-weight: 700 !important;
  letter-spacing: .04em !important;
  display: block !important;
  margin-bottom: 14px !important;
}

/* Arrow circle */
.nvc-card .nvc-arrow {
  background: rgba(255,255,255,.95) !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 14px rgba(6,26,48,.3) !important;
  transition: transform .22s ease, background .22s ease, box-shadow .22s ease !important;
}
.nvc-card .nvc-arrow svg {
  width: 20px !important;
  height: 20px !important;
  transition: color .22s ease !important;
}
.nvc-card:hover .nvc-arrow {
  transform: translateX(5px) !important;
  background: #17C0E0 !important;
  box-shadow: 0 6px 18px rgba(23,192,224,.4) !important;
}
.nvc-card:hover .nvc-arrow svg { color: #fff !important; }

@media (max-width: 640px) {
  .nvc-wrap { grid-template-columns: repeat(2,1fr) !important; gap: 10px !important; }
  .nvc-card { aspect-ratio: 2/3 !important; }
  .nvc-card__title { font-size: 1rem !important; }
  .nvc-card .nvc-arrow { width: 38px !important; height: 38px !important; }
}
@media (max-width: 380px) {
  .nvc-wrap { grid-template-columns: 1fr !important; }
  .nvc-card { aspect-ratio: 4/3 !important; }
}

/* ─── 2. PHOTO CATEGORY CARDS (.nvp-card) ──────────────────────────────── */

.nvp-card {
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 12px rgba(20,35,70,.07) !important;
  transition: transform .25s ease, box-shadow .25s ease !important;
}
.nvp-card:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 16px 32px rgba(20,35,70,.16) !important;
}
.nvp-card__img { overflow: hidden !important; }
.nvp-card__body { padding: 18px 20px 20px !important; background: #fff !important; }
.nvp-card__title {
  font-size: 16px !important;
  font-weight: 800 !important;
  color: #1b2a4a !important;
  margin: 0 0 5px !important;
}
.nvp-card__cta {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #01679A !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  transition: color .18s ease !important;
}
.nvp-card:hover .nvp-card__cta { color: #0E2444 !important; }

/* ─── 3. PRODUCT ROWS (.nvr-box) ─────────────────────────────────────────── */

.nvr-box {
  border-radius: 14px !important;
  border: 1px solid #e7ecf3 !important;
  background: #fff !important;
  overflow: hidden !important;
  transition: transform .22s ease, box-shadow .22s ease !important;
  display: flex !important;
  flex-direction: column !important;
}
.nvr-box:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 14px 30px rgba(20,35,70,.13) !important;
}

/* Image area */
.nvr-img {
  background: #f4f8fc !important;
  display: block !important;
  overflow: hidden !important;
  position: relative !important;
}
.nvr-img img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  mix-blend-mode: multiply !important;
  transition: transform .3s ease !important;
}
.nvr-box:hover .nvr-img img { transform: scale(1.05) !important; }

/* Popular badge — navy pill, star prefix */
.nvr-pop {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  right: auto !important;
  background: #0E2444 !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  padding: 4px 10px !important;
  border-radius: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  box-shadow: 0 3px 8px rgba(14,36,68,.25) !important;
  z-index: 5 !important;
}
.nvr-pop::before { content: "\2605"; color: #f5b52e !important; font-size: 10px !important; }

/* NEW badge — flat pill, no diagonal rotation */
.nvr-new {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  left: auto !important;
  background: #17C0E0 !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  padding: 4px 9px !important;
  border-radius: 20px !important;
  transform: none !important;
  box-shadow: 0 3px 8px rgba(23,192,224,.3) !important;
  z-index: 5 !important;
}
.nvr-new::after { display: none !important; }

/* Text area */
.nvr-txt {
  padding: 14px 14px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  flex: 1 !important;
}
.nvr-txt strong {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #1b2a4a !important;
  line-height: 1.35 !important;
  min-height: 38px !important;
  display: block !important;
}
.nvr-txt .price {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  gap: 5px !important;
  margin: 0 !important;
}
.nvr-txt .price del { font-size: .78em !important; color: #8B9DA1 !important; opacity: 1 !important; }
.nvr-txt .price ins {
  text-decoration: none !important;
  color: #0E2444 !important;
  font-weight: 900 !important;
  font-size: 16px !important;
}

/* CTA button */
.nvr-cart {
  margin-top: auto !important;
  display: block !important;
  text-align: center !important;
  background: #17C0E0 !important;
  color: #fff !important;
  font-weight: 800 !important;
  font-size: 13.5px !important;
  padding: 11px 10px !important;
  border-radius: 9px !important;
  text-decoration: none !important;
  transition: background .18s ease, transform .18s ease !important;
  border: none !important;
}
.nvr-cart:hover {
  background: #0E2444 !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
}

@media (max-width: 640px) {
  .nvr-row { grid-template-columns: repeat(2,1fr) !important; gap: 10px !important; }
  .nvr-txt strong { font-size: 12.5px !important; min-height: 32px !important; }
  .nvr-cart { font-size: 12px !important; padding: 9px 6px !important; }
}

/* ─── 4. USP CARDS (.nvu-card) ─────────────────────────────────────────── */

.nvu-card {
  border-radius: 16px !important;
  border: 1px solid #e7ecf3 !important;
  background: #fff !important;
  padding: 28px 22px !important;
  text-align: center !important;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
}
.nvu-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 28px rgba(20,35,70,.10) !important;
  border-color: #17C0E0 !important;
}
.nvu-card .ico { font-size: 36px !important; display: block !important; margin-bottom: 12px !important; }
.nvu-card h3 { font-size: 16px !important; font-weight: 800 !important; color: #1b2a4a !important; margin: 0 0 8px !important; }
.nvu-card p { font-size: 13.5px !important; color: #4a5670 !important; line-height: 1.55 !important; margin: 0 !important; }

/* ─── 5. FAQ ACCORDION ──────────────────────────────────────────────────── */

.nvq-box {
  border: 1px solid #e7ecf3 !important;
  border-radius: 12px !important;
  margin-bottom: 10px !important;
  overflow: hidden !important;
  transition: border-color .2s ease !important;
}
.nvq-box:hover { border-color: #17C0E0 !important; }
.nvq-hd {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 16px 20px !important;
  cursor: pointer !important;
  font-weight: 800 !important;
  font-size: 15.5px !important;
  color: #1b2a4a !important;
  user-select: none !important;
}
.nvq-hd .arw { color: #17C0E0 !important; font-size: 20px !important; transition: transform .25s ease !important; }
.nvq-box.open .nvq-hd { background: #f4f8fc !important; }
.nvq-box.open .arw { transform: rotate(180deg) !important; }
.nvq-txt { max-height: 0 !important; overflow: hidden !important; transition: max-height .3s ease !important; }
.nvq-box.open .nvq-txt { max-height: 400px !important; }
.nvq-txt p { padding: 0 20px 18px !important; margin: 0 !important; font-size: 14.5px !important; color: #4a5670 !important; line-height: 1.65 !important; }

/* ─── 6. SHOP LOOP — archive/category pages ─────────────────────────────── */

.woocommerce ul.products li.product {
  border-radius: 14px !important;
  border: 1px solid #e7ecf3 !important;
  background: #fff !important;
  overflow: hidden !important;
  transition: transform .22s ease, box-shadow .22s ease !important;
}
.woocommerce ul.products li.product:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 14px 30px rgba(20,35,70,.12) !important;
}
.woocommerce ul.products li.product img { transition: transform .3s ease !important; }
.woocommerce ul.products li.product:hover img { transform: scale(1.04) !important; }
.woocommerce ul.products li.product .price del { opacity: 1 !important; font-size: .78em !important; }
.woocommerce ul.products li.product .price ins {
  text-decoration: none !important;
  color: #0E2444 !important;
  font-weight: 900 !important;
}
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button {
  background: #17C0E0 !important;
  color: #fff !important;
  border-radius: 9px !important;
  font-weight: 800 !important;
  padding: 11px 12px !important;
  transition: background .18s ease, transform .18s ease !important;
  width: calc(100% - 24px) !important;
  margin: 0 12px 12px !important;
  display: block !important;
  text-align: center !important;
}
.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product .add_to_cart_button:hover {
  background: #0E2444 !important;
  transform: translateY(-1px) !important;
}

/* ─── 7. MOBILE GLOBAL GUARD ────────────────────────────────────────────── */

@media (max-width: 768px) {
  html, body { overflow-x: clip !important; max-width: 100vw !important; } /* AAA-STICKY-OVERFLOW-CLIP-20260820 */
  .nvp-wrap { grid-template-columns: repeat(2,1fr) !important; gap: 12px !important; }
  .nvu-grid { grid-template-columns: repeat(2,1fr) !important; gap: 14px !important; }
  .nvq-flex { grid-template-columns: 1fr !important; }
  .nvr-row { grid-template-columns: repeat(2,1fr) !important; gap: 10px !important; }
}
@media (max-width: 480px) {
  .nvh-banner__title { font-size: 28px !important; line-height: 1.18 !important; }
  .nvh-banner__subtitle { font-size: 15px !important; }
  .nvf-grid { grid-template-columns: repeat(2,1fr) !important; gap: 14px !important; }
  .nvp-wrap { grid-template-columns: 1fr !important; }
}

/* ─── /AAA-DESIGN-PASS-20260818 ─────────────────────────────────────────── */

/* AAA-DESIGN-PASS-20260818b: kill duplicate page titles — theme prints entry-title AND page content carries its own styled h1 */
article.page:has(.entry-content h1) h1.entry-title { display: none !important; }

/* ===== AAA-STICKY-HEADER-20260820 =====================================
   Parity with goalphalabs: their <header> is position:sticky;top:0;z:9990
   with an is-compact scroll state. Ours was position:relative on every
   page type (verified at CSS layer 2026-08-20, all 4 templates).

   Our top chrome is 241px (RUO 76 + flash 101 + header 168 = 2.2x Alpha's
   77px header), so on mobile the nav scrolls away and the cart becomes
   unreachable without scrolling back to the top. Sticky ONLY the <header>
   (not the RUO/flash bars) so the compliance line still scrolls away and
   we reclaim vertical budget.
   ==================================================================== */
header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 9990;
  background: #fff;
  transition: box-shadow .2s ease, transform .2s ease;
}

/* Compact state once the shopper scrolls past the promo bars. */
header.is-compact {
  box-shadow: 0 2px 14px rgba(14, 36, 68, .13);
}
header.is-compact .top_head { padding-top: 4px; padding-bottom: 4px; }
header.is-compact .top_head .lft img {
  max-height: 42px;
  width: auto;
  transition: max-height .2s ease;
}

/* Mobile: tighten further — every px above the fold is Add-to-Cart distance.
   Ours sits 1715px from top vs Alpha 1410px (+305px). */
@media (max-width: 767px) {
  header.is-compact .top_head .lft img { max-height: 34px; }
  header.is-compact .top_head { padding-top: 2px; padding-bottom: 2px; }
}

/* Respect reduced-motion preferences. */
@media (prefers-reduced-motion: reduce) {
  header, header.is-compact .top_head .lft img { transition: none; }
}
