/*
Theme Name: Tienda Promos (Astra Child)
Theme URI: https://lavetraxpromos.com
Description: Child theme de Astra para personalizaciones de UI/UX sin tocar el tema padre.
Author: Dany
Template: astra
Version: 1.0.1
Text Domain: tienda-promos-astra-child
*/

/* ====== Design System: VistaPrint-style UI (mobile-first) ====== */

/* ===============================
   1) Tokens (Variables CSS)
   =============================== */
:root {
  /* Color palette */
  --tp-color-primary: #2563eb;
  --tp-color-primary-hover: #1d4ed8;
  --tp-color-primary-soft: #e5f3ff;
  --tp-color-secondary-brand: #0ea5a4;
  --tp-color-secondary: #ffffff;
  --tp-color-accent: #facc15;
  --tp-color-bg: #f8fafc;
  --tp-color-surface: #ffffff;
  --tp-color-surface-alt: #e5f3ff;
  --tp-color-border: #e5e7eb;
  --tp-color-ink: #1f2937;
  --tp-color-text: #1f2937;
  --tp-color-text-soft: #4b5563;

  /* Typography */
  --tp-font-sans: "Open Sans", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --tp-font-ui: "Poppins", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --tp-font-heading: "Montserrat", "Avenir Next", "Helvetica Neue", Arial, sans-serif;
  --tp-font-size-xs: 0.75rem;
  --tp-font-size-sm: 0.875rem;
  --tp-font-size-md: 1rem;
  --tp-font-size-lg: 1.125rem;
  --tp-font-size-xl: 1.375rem;
  --tp-font-size-2xl: 1.75rem;
  --tp-line-height: 1.5;

  /* Radius */
  --tp-radius-sm: 0.5rem;
  --tp-radius-md: 0.75rem;
  --tp-radius-lg: 1rem;
  --tp-radius-pill: 999px;

  /* Shadow */
  --tp-shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.06);
  --tp-shadow-md: 0 10px 25px rgba(15, 23, 42, 0.08);
  --tp-shadow-focus: 0 0 0 3px rgba(10, 78, 255, 0.25);

  /* Spacing scale */
  --tp-space-1: 0.25rem;
  --tp-space-2: 0.5rem;
  --tp-space-3: 0.75rem;
  --tp-space-4: 1rem;
  --tp-space-5: 1.25rem;
  --tp-space-6: 1.5rem;
  --tp-space-8: 2rem;
  --tp-space-10: 2.5rem;
  --tp-shell-max: 1240px;
  --tp-shell-gutter: clamp(0.9rem, 2.2vw, 1.5rem);
}

/* ===============================
   2) Base / Layout
   =============================== */
html {
  font-size: 16px;
  margin: 0;
  padding: 0;
}

body {
  margin: 0;
  padding: 0;
  font-family: var(--tp-font-sans);
  font-size: var(--tp-font-size-md);
  line-height: var(--tp-line-height);
  color: var(--tp-color-text);
  background: var(--tp-color-bg);
}

.home #page,
.home .site {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}

.preview-shell {
  width: min(var(--tp-shell-max), 100%);
  padding-left: var(--tp-shell-gutter);
  padding-right: var(--tp-shell-gutter);
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
}

h1,
h2,
h3,
h4 {
  font-family: var(--tp-font-heading);
  color: var(--tp-color-text);
  line-height: 1.2;
  letter-spacing: -0.02em;
}

h1 {
  font-size: var(--tp-font-size-2xl);
}

h2 {
  font-size: var(--tp-font-size-xl);
}

p,
.woocommerce .woocommerce-result-count {
  color: var(--tp-color-text-soft);
}

.site-main,
.ast-container {
  padding-top: var(--tp-space-4);
  padding-bottom: var(--tp-space-6);
}

/* ===============================
   3) Buttons
   =============================== */
button,
input[type="button"],
input[type="submit"],
.button,
.wp-element-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--tp-space-2);
  min-height: 44px;
  padding: 0.62rem 1rem;
  border-radius: 0.72rem;
  border: 1px solid transparent;
  font-weight: 700;
  font-size: var(--tp-font-size-sm);
  line-height: 1;
  letter-spacing: 0.01em;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease,
    transform 0.2s ease;
}

.button,
.wp-element-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.single_add_to_cart_button {
  font-family: var(--tp-font-ui);
  color: #fff;
  border-color: #1f4ec2;
  background: linear-gradient(180deg, #2f66e8, #2458d5);
  box-shadow: 0 8px 16px rgba(37, 99, 235, 0.23);
}

.button:hover,
.wp-element-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.single_add_to_cart_button:hover {
  background: linear-gradient(180deg, #2b5fdc, #1f4ec2);
  transform: translateY(-1px);
}

.button:focus-visible,
.wp-element-button:focus-visible,
.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce input.button:focus-visible,
.single_add_to_cart_button:focus-visible {
  outline: 0;
  box-shadow: var(--tp-shadow-focus);
}

/* Secondary button utility */
.tp-btn-secondary,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  color: #244f9d;
  background: #ffffff;
  border-color: #c8d9ef;
}

.tp-btn-secondary:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
  color: #1d4ed8;
  border-color: #9fbbe2;
  background: #f7fbff;
}

/* ===============================
   4) Cards (sections + WooCommerce products)
   =============================== */
.tp-card,
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.woocommerce div.product,
.widget,
.woocommerce-cart .cart_totals,
.woocommerce-checkout-review-order {
  background: var(--tp-color-surface);
  border: 1px solid var(--tp-color-border);
  border-radius: var(--tp-radius-lg);
  box-shadow: var(--tp-shadow-sm);
}

.tp-card {
  padding: var(--tp-space-5);
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  position: relative;
  padding: var(--tp-space-4);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover {
  transform: translateY(-4px);
  box-shadow: var(--tp-shadow-md);
}

.woocommerce ul.products li.product img {
  border-radius: var(--tp-radius-md);
  margin-bottom: var(--tp-space-4);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: var(--tp-font-size-lg);
  color: var(--tp-color-text);
  margin-bottom: var(--tp-space-2);
}

.woocommerce ul.products li.product .price {
  color: var(--tp-color-primary);
  font-weight: 700;
  font-size: var(--tp-font-size-md);
}

.woocommerce .star-rating {
  color: #f59e0b;
}

.tp-wishlist-loop-btn {
  position: absolute;
  top: 0.6rem;
  right: 0.6rem;
  z-index: 25;
  pointer-events: auto;
}

.tp-wishlist-single-btn {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  margin: 0.4rem 0 0.75rem;
}

.tp-wishlist-trigger .tinv-wraper,
.tp-wishlist-trigger .tinv-wishlist,
.tp-wishlist-trigger .yith-wcwl-add-to-wishlist {
  margin: 0 !important;
}

.tp-wishlist-trigger .tinvwl_add_to_wishlist_button,
.tp-wishlist-trigger .yith-wcwl-add-button > a,
.tp-wishlist-trigger .yith-wcwl-wishlistaddedbrowse a,
.tp-wishlist-trigger .yith-wcwl-wishlistexistsbrowse a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  aspect-ratio: 1 / 1;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 999px;
  border: 1px solid #c9dbf2;
  background: #ffffff;
  color: #35557c;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(15, 34, 59, 0.08);
  transition: all 0.2s ease;
}

.tp-wishlist-trigger .tinvwl_add_to_wishlist_button {
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: hidden;
  white-space: nowrap;
}

.tp-wishlist-trigger .tinvwl_add_to_wishlist_button:hover,
.tp-wishlist-trigger .yith-wcwl-add-button > a:hover,
.tp-wishlist-trigger .yith-wcwl-wishlistaddedbrowse a:hover,
.tp-wishlist-trigger .yith-wcwl-wishlistexistsbrowse a:hover {
  border-color: #a9c3e5;
  background: #f4f9ff;
  color: #1d4ed8;
}

.tp-wishlist-trigger .tinvwl_add_to_wishlist_button.tinvwl-product-in-list,
.tp-wishlist-trigger .yith-wcwl-wishlistaddedbrowse a,
.tp-wishlist-trigger .yith-wcwl-wishlistexistsbrowse a {
  border-color: #9cb8e5;
  background: #edf4ff;
  color: #1d4ed8;
}

.tp-wishlist-trigger .tinvwl_add_to_wishlist_button:before {
  content: "♡" !important;
  font-family: var(--tp-font-ui) !important;
  font-weight: 700 !important;
  margin: 0 !important;
  font-size: 15px !important;
  line-height: 1 !important;
  text-indent: 0;
}

.tp-wishlist-trigger .tinvwl_add_to_wishlist_button.tinvwl-product-in-list:before {
  content: "♥" !important;
}

.tp-wishlist-trigger .yith-wcwl-add-button i,
.tp-wishlist-trigger .yith-wcwl-wishlistaddedbrowse i,
.tp-wishlist-trigger .yith-wcwl-wishlistexistsbrowse i {
  font-size: 15px;
  line-height: 1;
  margin: 0;
}

.tp-wishlist-trigger .tinvwl_add_to_wishlist-text,
.tp-wishlist-trigger .tinvwl_remove_from_wishlist-text,
.tp-wishlist-trigger .tinvwl_already_on_wishlist-text,
.tp-wishlist-trigger .yith-wcwl-add-button span,
.tp-wishlist-trigger .yith-wcwl-wishlistaddedbrowse span,
.tp-wishlist-trigger .yith-wcwl-wishlistexistsbrowse span,
.tp-wishlist-trigger .feedback {
  display: none !important;
}

.tp-wishlist-trigger .tinvwl-tooltip,
.tp-wishlist-trigger .tinv-wishlist-clear {
  display: none !important;
}

/* Keep only one wishlist control rendered by theme wrappers. */
.single-product .summary .tinv-wraper,
.single-product .summary .tinv-wishlist,
.single-product .summary .yith-wcwl-add-to-wishlist,
.single-product .summary .tinvwl_add_to_wishlist_button,
.woocommerce ul.products li.product .tinv-wraper,
.woocommerce ul.products li.product .tinv-wishlist,
.woocommerce ul.products li.product .yith-wcwl-add-to-wishlist,
.woocommerce ul.products li.product .tinvwl_add_to_wishlist_button {
  display: none !important;
}

.woocommerce ul.products li.product .tp-wishlist-loop-btn .tinv-wraper,
.woocommerce ul.products li.product .tp-wishlist-loop-btn .tinv-wishlist,
.woocommerce ul.products li.product .tp-wishlist-loop-btn .yith-wcwl-add-to-wishlist,
.woocommerce ul.products li.product .tp-wishlist-loop-btn .tinvwl_add_to_wishlist_button {
  display: inline-flex !important;
}

/* Single product: hide wishlist trigger near meta/related block (keep loop hearts). */
.single-product .tp-wishlist-single-btn,
.single-product .summary > .tinv-wraper,
.single-product .summary > .tinv-wishlist,
.single-product .summary > .yith-wcwl-add-to-wishlist,
.single-product .summary > .tinvwl_add_to_wishlist_button,
.single-product .summary .tinvwl-after-add-to-cart,
.single-product .summary .tinvwl_add_to_wishlist_button {
  display: none !important;
}

.tinv-wishlist .tinv-modal .tinvwl-buttons-group button,
.tinv-wishlist .tinv-modal .tinvwl-buttons-group button.tinvwl_button_view,
.tinv-wishlist .tinv-modal .tinvwl-buttons-group button.tinvwl_button_close {
  color: #1d4ed8 !important;
  background: #ffffff !important;
  border: 1px solid #9cbce8 !important;
}

.tinv-wishlist .tinv-modal .tinvwl-buttons-group button:hover,
.tinv-wishlist .tinv-modal .tinvwl-buttons-group button.tinvwl_button_view:hover,
.tinv-wishlist .tinv-modal .tinvwl-buttons-group button.tinvwl_button_close:hover {
  color: #1e40af !important;
  background: #eff6ff !important;
  border-color: #7ea7df !important;
}

/* TI Wishlist: force quote-first flow (no add-to-cart actions from wishlist). */
.tinv-wishlist .tinvwl_add_to_cart_button,
.tinv-wishlist [name="tinvwl-add-to-cart"],
.tinv-wishlist [name="tinvwl-add-all-to-cart"],
.tinv-wishlist [name*="tinvwl"][name*="add-to-cart"],
.tinv-wishlist [class*="tinvwl"][class*="add_to_cart"],
.tinv-wishlist [class*="tinvwl"][class*="add-to-cart"],
.tinv-wishlist .wishlist_item .product-action a.button,
.tinv-wishlist .wishlist_item .product-action button,
.tinv-wishlist .wishlist_item .product-action input[type="submit"] {
  display: none !important;
}

/* Hide bulk action controls only (keep wishlist items visible). */
.tinv-wishlist select[name*="product_actions"],
.tinv-wishlist select[name*="product-actions"],
.tinv-wishlist button[name*="tinvwl-manage"],
.tinv-wishlist input[name*="tinvwl-manage"] {
  display: none !important;
}

/* ===============================
   5) Badges
   =============================== */
.tp-badge,
.woocommerce span.onsale {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.35rem 0.65rem;
  border-radius: var(--tp-radius-pill);
  font-size: var(--tp-font-size-xs);
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  white-space: nowrap;
}

.woocommerce span.onsale {
  background: var(--tp-color-primary-soft);
  color: var(--tp-color-primary);
  border: 1px solid rgba(10, 78, 255, 0.25);
}

.tp-badge-moq {
  background: #e0f2fe;
  color: #075985;
}

.tp-badge-fast {
  background: #dcfce7;
  color: #166534;
}

.tp-badge-customizable {
  background: #fff3c4;
  color: #854d0e;
}

/* ===============================
   6) Header (search + WhatsApp CTA)
   =============================== */
.site-header {
  background: var(--tp-color-surface);
  border-bottom: 1px solid var(--tp-color-border);
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04);
}

/* Search form (Astra + native search widget) */
.ast-builder-layout-element .search-form,
.site-header .search-form,
.site-header .woocommerce-product-search {
  display: flex;
  align-items: center;
  gap: var(--tp-space-2);
  background: rgba(229, 243, 255, 0.78);
  border: 1px solid transparent;
  border-radius: var(--tp-radius-pill);
  padding: var(--tp-space-2);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.ast-builder-layout-element .search-form:focus-within,
.site-header .search-form:focus-within,
.site-header .woocommerce-product-search:focus-within {
  border-color: var(--tp-color-primary);
  box-shadow: var(--tp-shadow-focus);
}

.site-header .search-field,
.site-header .woocommerce-product-search .search-field {
  width: 100%;
  min-width: 140px;
  border: 0;
  background: transparent;
  color: var(--tp-color-text);
  font-size: var(--tp-font-size-sm);
}

.site-header .search-field:focus {
  outline: 0;
}

/* WhatsApp button: assign class `tp-whatsapp-button` to menu item/link/widget */
.tp-whatsapp-button,
.tp-whatsapp-button a {
  font-family: var(--tp-font-ui);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  min-height: 42px;
  padding: 0.58rem 0.92rem;
  border-radius: 0.58rem;
  border: 0;
  background: linear-gradient(180deg, rgba(34, 197, 94, 0.18), rgba(21, 128, 61, 0.16));
  color: #0f6437;
  font-size: 0.81rem;
  font-weight: 650;
  letter-spacing: 0.01em;
  text-decoration: none;
  backdrop-filter: blur(8px) saturate(130%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75), 0 8px 16px rgba(15, 86, 42, 0.14);
  transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.tp-whatsapp-button::before,
.tp-whatsapp-button a::before {
  content: none;
}

.tp-whatsapp-button:hover,
.tp-whatsapp-button a:hover {
  background: linear-gradient(180deg, rgba(34, 197, 94, 0.24), rgba(21, 128, 61, 0.2));
  color: #0d5a31;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72), 0 10px 18px rgba(15, 86, 42, 0.18);
  transform: translateY(-1px);
  text-decoration: none;
}

.tp-whatsapp-button:focus-visible,
.tp-whatsapp-button a:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 10px 18px rgba(15, 86, 42, 0.18);
  text-decoration: none;
}

/* Pro header: two-row commerce navigation */
.tp-site-header-pro .preview-shell {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.tp-header-main {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.65rem;
}

.tp-header-main > * {
  min-width: 0;
}

.tp-header-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  text-decoration: none;
  min-width: 0;
}

.tp-header-brand.has-logo {
  gap: 0;
  min-width: clamp(190px, 18vw, 300px);
}

.tp-brand-logo {
  display: block;
  height: 64px;
  width: auto;
  max-width: min(380px, 34vw);
  object-fit: contain;
  object-position: left center;
}

.tp-brand-mark {
  width: 2rem;
  height: 2rem;
  border-radius: 0.45rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(155deg, #2563eb, #0ea5a4);
  color: #ffffff;
  font-family: var(--tp-font-ui);
  font-size: 0.68rem;
  font-weight: 700;
}

.tp-brand-text {
  display: inline-flex;
  align-items: baseline;
  gap: 0.22rem;
  font-family: var(--tp-font-heading);
  color: var(--tp-color-ink);
  line-height: 1;
}

.tp-brand-text strong {
  font-size: 1.26rem;
}

.tp-brand-text span {
  font-size: 1.26rem;
  font-weight: 700;
  color: #2f6ed9;
}

.tp-header-search {
  border-radius: 0.7rem;
  background: rgba(229, 243, 255, 0.78);
  border-color: #d8e3f2;
  min-width: 0;
}

.tp-header-search .search-field {
  min-width: 0;
}

.tp-site-header-pro .tp-header-search .search-field,
.tp-site-header-pro .tp-header-search input[type="search"] {
  appearance: none;
  -webkit-appearance: none;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  background-color: transparent;
  box-shadow: none;
  outline: 0;
}

.tp-site-header-pro .tp-header-search .search-field:focus,
.tp-site-header-pro .tp-header-search .search-field:focus-visible,
.tp-site-header-pro .tp-header-search input[type="search"]:focus,
.tp-site-header-pro .tp-header-search input[type="search"]:focus-visible {
  border: 0;
  background: transparent;
  background-color: transparent;
  box-shadow: none;
  outline: 0;
}

.tp-site-header-pro .tp-header-search input[type="search"]::-webkit-search-decoration,
.tp-site-header-pro .tp-header-search input[type="search"]::-webkit-search-cancel-button,
.tp-site-header-pro .tp-header-search input[type="search"]::-webkit-search-results-button,
.tp-site-header-pro .tp-header-search input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance: none;
  appearance: none;
}

.tp-search-submit {
  width: 2rem;
  height: 2rem;
  min-height: 0;
  padding: 0;
  border-radius: 999px;
  border: 1px solid #c8d7ea;
  background: #ffffff;
  color: #2e476b;
}

.tp-search-submit svg {
  width: 1rem;
  height: 1rem;
  stroke: currentColor;
}

.tp-header-tools {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.25rem 0.32rem;
  overflow-x: auto;
  min-width: 0;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.tp-header-tools::-webkit-scrollbar {
  height: 6px;
}

.tp-header-tools::-webkit-scrollbar-thumb {
  background: #c4d3e6;
  border-radius: 999px;
}

.tp-tool-link {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.12rem 0.34rem;
  border-radius: 0.35rem;
  border: 0;
  color: #3c536f;
  text-decoration: none;
  font-family: var(--tp-font-ui);
  font-size: 0.79rem;
  font-weight: 600;
  white-space: nowrap;
  transition: color 0.2s ease, opacity 0.2s ease;
}

.tp-tool-link svg {
  width: 1.12rem;
  height: 1.12rem;
  flex: 0 0 auto;
  stroke: currentColor;
  opacity: 0.9;
}

.tp-tool-link span {
  display: inline-block;
  line-height: 1.1;
}

.tp-tool-link.is-help span {
  display: grid;
  gap: 0.05rem;
}

.tp-tool-link.is-help strong {
  font-size: 0.76rem;
  color: #10243e;
}

.tp-tool-link.is-help small {
  font-size: 0.66rem;
  font-weight: 600;
  color: #607691;
}

.tp-tool-link:hover {
  color: #1f3856;
  opacity: 0.88;
}

.tp-tool-link:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.18);
}

.tp-tool-count {
  min-width: 1rem;
  height: 1rem;
  padding: 0 0.2rem;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #2a56c1;
  color: #ffffff;
  font-size: 0.62rem;
  line-height: 1;
  font-weight: 700;
}

.tp-header-nav-wrap {
  border-top: 1px solid #e2eaf5;
}

.tp-header-nav-wrap .preview-shell {
  padding-top: 0.35rem;
  padding-bottom: 0.42rem;
}

.tp-cat-nav {
  position: relative;
}

.tp-cat-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 0.25rem;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
}

.tp-cat-menu li {
  flex: 0 0 auto;
}

.tp-cat-menu a,
.tp-cat-menu .tp-cat-menu-label {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 0.26rem 0.68rem;
  border-radius: 0.5rem;
  color: #263a58;
  text-decoration: none;
  font-family: var(--tp-font-ui);
  font-size: 0.82rem;
  font-weight: 600;
}

.tp-cat-menu li.is-open > a,
.tp-cat-menu li.is-open > .tp-cat-menu-label,
.tp-cat-menu a:hover {
  background: #eef4fc;
  color: #1d4ed8;
}

.tp-scroll-cue {
  position: relative;
}

.tp-mega-panel {
  display: none;
}

@media (min-width: 768px) {
  .tp-header-main {
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.8rem;
  }

  .tp-header-tools {
    justify-content: flex-end;
    overflow: visible;
  }

  .tp-cat-menu {
    overflow-x: auto;
    overflow-y: hidden;
    justify-content: flex-start;
    flex-wrap: nowrap;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .tp-cat-menu::-webkit-scrollbar {
    display: none;
  }

  .tp-header-nav-wrap .tp-cat-nav {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .tp-header-nav-wrap .tp-cat-nav::-webkit-scrollbar {
    display: none;
  }

  .tp-header-nav-wrap .tp-cat-nav .tp-cat-menu {
    display: flex !important;
    flex-wrap: nowrap !important;
    white-space: nowrap;
    width: max-content;
    min-width: 100%;
  }

  .tp-header-nav-wrap .tp-cat-nav .tp-cat-menu > li {
    flex: 0 0 auto !important;
  }

  .tp-header-nav-wrap .tp-cat-nav .tp-cat-menu > li > a,
  .tp-header-nav-wrap .tp-cat-nav .tp-cat-menu > li > .tp-cat-menu-label {
    white-space: nowrap;
  }
}

@media (min-width: 768px) and (max-width: 1320px) {
  .tp-header-brand.has-logo {
    min-width: clamp(150px, 17vw, 250px);
  }

  .tp-brand-logo {
    height: 52px;
    max-width: min(300px, 28vw);
  }

  .tp-tool-link {
    padding: 0.1rem 0.24rem;
    font-size: 0.75rem;
    gap: 0.24rem;
  }

  .tp-tool-link.is-help small {
    display: none;
  }
}

@media (min-width: 768px) and (max-width: 1180px) {
  .tp-header-main {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.52rem;
  }

  .tp-brand-logo {
    height: 46px;
    max-width: min(250px, 32vw);
  }

  .tp-header-tools {
    gap: 0.12rem;
  }

  .tp-header-tools .tp-tool-link span {
    display: none;
  }

  .tp-tool-link {
    width: 2.24rem;
    min-height: 2.18rem;
    justify-content: center;
    padding: 0;
  }

  .tp-tool-link.is-help strong,
  .tp-tool-link.is-help small {
    display: none;
  }

  .tp-tool-link.is-cart,
  .tp-tool-link.is-favorites {
    position: relative;
  }

  .tp-tool-link.is-cart .tp-tool-count,
  .tp-tool-link.is-favorites .tp-tool-count {
    position: absolute;
    top: -0.2rem;
    right: -0.2rem;
    margin-left: 0;
  }
}

@media (min-width: 1024px) {
  .tp-cat-nav {
    padding-bottom: 0.08rem;
  }

  .tp-cat-nav::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 0.38rem;
  }

  .tp-mega-panel {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 0.02rem);
    z-index: 30;
    margin-top: 0;
    padding: 0.85rem;
    border: 1px solid #d8e4f2;
    border-radius: 0.9rem;
    background: #ffffff;
    box-shadow: 0 16px 28px rgba(10, 25, 44, 0.1);
    display: none;
  }

  .tp-cat-nav:hover .tp-mega-panel,
  .tp-cat-nav:focus-within .tp-mega-panel {
    display: block;
  }

  .tp-cat-nav:hover .tp-mega-panel.is-empty-active,
  .tp-cat-nav:focus-within .tp-mega-panel.is-empty-active {
    display: none;
  }

  .tp-mega-panel-pane {
    display: none;
    gap: 0.9rem;
  }

  .tp-mega-panel-pane.is-active {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) 220px;
  }

  .tp-mega-panel-pane.is-no-feature {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .tp-mega-col {
    display: grid;
    align-content: start;
    gap: 0.4rem;
  }

  .tp-mega-col h4 {
    margin: 0;
    font-size: 0.9rem;
  }

  .tp-mega-col a {
    color: #3b5270;
    text-decoration: none;
    font-size: 0.82rem;
  }

  .tp-mega-link-label {
    color: #3b5270;
    font-size: 0.82rem;
  }

  .tp-mega-col a:hover {
    color: #1d4ed8;
  }

  .tp-mega-feature {
    display: grid;
    gap: 0.3rem;
    text-decoration: none;
    color: var(--tp-color-ink);
  }

  .tp-mega-feature img {
    width: 100%;
    height: 120px;
    object-fit: cover;
    border-radius: 0.65rem;
    border: 1px solid #dbe7f4;
  }

  .tp-mega-feature strong {
    font-size: 0.88rem;
  }

  .tp-mega-feature span {
    font-size: 0.8rem;
    color: #1d4ed8;
    font-weight: 700;
  }

  .tp-mega-feature-text {
    margin: 0;
    font-size: 0.78rem;
    line-height: 1.35;
    color: #536b87;
  }
}

/* ===============================
   7) Responsive Enhancements
   =============================== */
@media (min-width: 768px) {
  :root {
    --tp-font-size-xl: 1.5rem;
    --tp-font-size-2xl: 2rem;
  }

  .site-main,
  .ast-container {
    padding-top: var(--tp-space-6);
    padding-bottom: var(--tp-space-8);
  }

  .woocommerce ul.products {
    column-gap: var(--tp-space-5);
    row-gap: var(--tp-space-5);
  }

  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product {
    padding: var(--tp-space-5);
  }
}

@media (min-width: 1024px) {
  .site-header .search-field,
  .site-header .woocommerce-product-search .search-field {
    min-width: 260px;
  }

  .tp-card {
    padding: var(--tp-space-6);
  }
}

/* ===============================
   8) VistaPrint-Inspired Utilities
   =============================== */
.tp-announcement {
  margin: 0;
  background: var(--tp-color-ink);
  color: #ffffff;
  text-align: center;
  font-size: var(--tp-font-size-xs);
  font-weight: 600;
  padding: 0.45rem var(--tp-space-4);
}

.tp-utility-bar {
  background: #ffffff;
  border-bottom: 1px solid var(--tp-color-border);
}

.tp-utility-inner {
  display: flex;
  flex-wrap: wrap;
  gap: var(--tp-space-2) var(--tp-space-4);
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  font-size: var(--tp-font-size-xs);
  color: #365071;
}

.tp-utility-inner strong {
  color: var(--tp-color-ink);
}

.tp-hero {
  position: relative;
  overflow: hidden;
  border-radius: 1.15rem;
  background: radial-gradient(circle at 20% 20%, #3b82f6 0%, #2563eb 40%, #1d4ed8 100%);
  border: 1px solid #2f64d3;
  box-shadow: var(--tp-shadow-md);
}

.tp-hero::before {
  content: "";
  position: absolute;
  right: -120px;
  top: -120px;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.14);
}

.tp-hero-inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-5);
  padding: var(--tp-space-6);
}

.tp-hero-copy h1,
.tp-hero-copy p {
  color: #ffffff;
}

.tp-hero-copy p {
  max-width: 32ch;
}

.tp-hero-side {
  background: #ffffff;
  border-radius: 0.95rem;
  padding: var(--tp-space-4);
  border: 1px solid #dbe3f0;
  box-shadow: 0 14px 24px rgba(6, 34, 70, 0.16);
}

.tp-hero-side h3 {
  margin: 0 0 var(--tp-space-2);
  color: var(--tp-color-ink);
}

.tp-hero-side p {
  margin: 0;
}

.tp-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--tp-space-2);
  margin: var(--tp-space-4) 0;
}

.tp-chip {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0.45rem 0.8rem;
  border-radius: var(--tp-radius-pill);
  border: 1px solid var(--tp-color-border);
  background: rgba(255, 255, 255, 0.95);
  color: #1f3758;
  font-size: var(--tp-font-size-xs);
  font-weight: 600;
  text-decoration: none;
  transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.tp-chip:hover {
  border-color: #b8c8e8;
  background: #f9fbff;
  transform: translateY(-1px);
}

.tp-chip.is-active {
  color: #1d4ed8;
  border-color: rgba(255, 255, 255, 0.5);
  background: #ffffff;
}

.tp-trust-strip {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-3);
  margin-top: var(--tp-space-6);
}

.tp-trust-item {
  background: #ffffff;
  border: 1px solid var(--tp-color-border);
  border-radius: var(--tp-radius-md);
  padding: var(--tp-space-4);
  font-size: var(--tp-font-size-sm);
  color: var(--tp-color-text-soft);
  box-shadow: 0 8px 16px rgba(12, 34, 63, 0.06);
}

.tp-trust-item strong {
  display: block;
  color: var(--tp-color-text);
  margin-bottom: 0.1rem;
}

.tp-category-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--tp-space-3);
  margin-top: var(--tp-space-5);
}

.tp-category-card {
  display: block;
  background: linear-gradient(160deg, #ffffff, #f7fbff);
  border: 1px solid var(--tp-color-border);
  border-radius: var(--tp-radius-md);
  padding: var(--tp-space-4);
  box-shadow: var(--tp-shadow-sm);
  color: var(--tp-color-text);
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.tp-category-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 28px rgba(7, 40, 80, 0.12);
  border-color: #b9cfee;
}

.tp-category-card small {
  color: var(--tp-color-text-soft);
}

.tp-eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  margin-bottom: var(--tp-space-2);
  padding: 0.12rem 0.52rem;
  border-radius: var(--tp-radius-pill);
  background: #e8f3ff;
  color: #0058b1;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.tp-mini-stat {
  margin-top: var(--tp-space-2);
  font-size: var(--tp-font-size-xs);
  color: #3b5678;
}

.tp-mini-stat strong {
  color: var(--tp-color-ink);
}

.tp-inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--tp-space-2);
  margin-top: var(--tp-space-4);
}

.tp-hero-proof {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--tp-space-2);
  margin-top: var(--tp-space-3);
}

.tp-hero-proof div {
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: var(--tp-radius-md);
  padding: 0.45rem 0.6rem;
  color: #ffffff;
  font-size: var(--tp-font-size-xs);
  font-weight: 600;
}

@media (min-width: 768px) {
  .tp-hero-inner {
    grid-template-columns: 1.3fr 1fr;
    padding: var(--tp-space-8);
  }

  .tp-chip-row {
    gap: var(--tp-space-3);
  }

  .tp-trust-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--tp-space-4);
  }

  .tp-category-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--tp-space-4);
  }
}

/* ===============================
   9) MX Catalog + Seasonal Campaigns
   =============================== */
.tp-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--tp-space-3);
  margin-bottom: var(--tp-space-3);
}

.tp-kicker {
  margin: 0;
  color: var(--tp-color-primary);
  font-size: var(--tp-font-size-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.tp-category-rail {
  display: flex;
  align-items: stretch;
  gap: var(--tp-space-2);
  overflow-x: auto;
  padding: 0 0 var(--tp-space-2);
  scrollbar-width: thin;
}

.tp-category-pill {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0.55rem 0.85rem;
  border: 1px solid var(--tp-color-border);
  border-radius: var(--tp-radius-pill);
  background: #ffffff;
  color: var(--tp-color-text);
  font-size: var(--tp-font-size-sm);
  font-weight: 600;
  text-decoration: none;
  transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.tp-category-pill:hover {
  border-color: #bfd0f1;
  background: #fbfdff;
  transform: translateY(-1px);
}

.tp-category-pill.is-hot {
  color: var(--tp-color-primary);
  border-color: rgba(10, 78, 255, 0.3);
  background: var(--tp-color-primary-soft);
}

.tp-season-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-3);
}

.tp-season-banner {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: var(--tp-radius-lg);
  border: 1px solid transparent;
  padding: var(--tp-space-5);
  min-height: 170px;
  color: #ffffff;
  text-decoration: none;
  box-shadow: var(--tp-shadow-sm);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.tp-season-banner:hover {
  transform: translateY(-3px);
  box-shadow: var(--tp-shadow-md);
}

.tp-season-banner h3 {
  margin: 0 0 var(--tp-space-2);
  color: inherit;
}

.tp-season-banner p {
  margin: 0;
  max-width: 28ch;
  color: rgba(255, 255, 255, 0.92);
}

.tp-season-tag {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  margin-bottom: var(--tp-space-3);
  padding: 0.2rem 0.65rem;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: var(--tp-radius-pill);
  font-size: var(--tp-font-size-xs);
  font-weight: 700;
  text-transform: uppercase;
}

.tp-season-banner.is-navidad {
  background: linear-gradient(135deg, #0f8f53, #0a6d3f);
}

.tp-season-banner.is-mundial {
  background: linear-gradient(135deg, #0055cc, #002f73);
}

.tp-season-banner.is-regreso {
  background: linear-gradient(135deg, #e57814, #c95300);
}

@media (min-width: 768px) {
  .tp-section-head {
    margin-bottom: var(--tp-space-4);
  }

  .tp-category-rail {
    gap: var(--tp-space-3);
  }

  .tp-season-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--tp-space-4);
  }

  .tp-season-banner {
    min-height: 220px;
    padding: var(--tp-space-6);
  }
}

/* ===============================
   10) PLP / Catalog Experience (VistaPrint-inspired)
   =============================== */
.tp-plp-shell {
  margin-top: var(--tp-space-5);
  overflow-x: clip;
  max-width: 100%;
}

.tp-plp-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--tp-space-5);
  align-items: start;
  min-width: 0;
}

.tp-plp-main {
  min-width: 0;
  display: grid;
  gap: var(--tp-space-4);
  overflow-x: clip;
  max-width: 100%;
}

.tp-plp-main > .tp-home-section {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  min-width: 0;
}

.tp-plp-sidebar,
.tp-plp-topbar {
  position: relative;
  background: #ffffff;
  border: 1px solid #dbe6f4;
  border-radius: 1.35rem;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.07);
}

.tp-plp-topbar {
  overflow: hidden;
  padding: clamp(1.35rem, 2.3vw, 1.85rem);
  background: linear-gradient(135deg, rgba(237, 241, 255, 0.96) 0%, rgba(248, 250, 255, 0.98) 50%, rgba(238, 249, 246, 0.92) 100%);
}

.tp-plp-topbar::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  background: linear-gradient(90deg, #2f66e8 0%, #12a8c7 65%, #bad80d 100%);
}

.tp-plp-title-block {
  position: relative;
  z-index: 1;
  max-width: 760px;
}

.tp-plp-topbar h1 {
  margin: 0.35rem 0 0.75rem;
  font-size: clamp(2rem, 3.4vw, 3rem);
  letter-spacing: -0.04em;
}

.tp-plp-description {
  margin: 0;
  max-width: 60ch;
  font-size: clamp(0.98rem, 1.35vw, 1.08rem);
  line-height: 1.72;
  color: #4f6580;
}

.tp-plp-active-filters {
  position: relative;
  z-index: 1;
  margin-top: var(--tp-space-4);
  padding-top: var(--tp-space-4);
  border-top: 1px solid rgba(154, 174, 208, 0.26);
  display: grid;
  gap: 0.75rem;
}

.tp-plp-active-label {
  font-family: var(--tp-font-ui);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #4867a5;
}

.tp-plp-active-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}

.tp-plp-active-chip,
.tp-plp-clear-link {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-height: 38px;
  padding: 0.5rem 0.8rem;
  border-radius: 999px;
  border: 1px solid #cfe0f4;
  background: rgba(255, 255, 255, 0.88);
  color: #233b5d;
  text-decoration: none;
  font-family: var(--tp-font-ui);
  font-size: 0.86rem;
  font-weight: 600;
}

.tp-plp-active-chip:hover,
.tp-plp-clear-link:hover {
  border-color: #a8c5ea;
  color: #1d4ed8;
}

.tp-plp-clear-link {
  background: transparent;
}

.tp-plp-category-rail {
  margin-top: 0.1rem;
  background: transparent;
  max-width: 100%;
  min-width: 0;
}

.tp-plp-category-rail .tp-home-head {
  margin-bottom: var(--tp-space-2);
}

.tp-plp-category-rail h2 {
  font-size: clamp(1.7rem, 2.6vw, 2.25rem);
}

.tp-plp-category-rail .tp-cat-rail {
  gap: 0.8rem;
  margin: 0;
  max-width: 100%;
  padding-left: 0.35rem;
  padding-right: 0.35rem;
  padding-top: 0.45rem;
  padding-bottom: 0.6rem;
}

.tp-plp-category-rail .tp-cat-rail-wrap {
  padding-top: 0.08rem;
  max-width: 100%;
  overflow: hidden;
}

.tp-plp-category-rail .tp-cat-link {
  width: clamp(94px, 16vw, 122px);
}

.tp-plp-category-rail .tp-cat-thumb {
  background: radial-gradient(circle at 30% 25%, #ffffff, #eef5ff 72%);
}

.tp-plp-category-rail .tp-cat-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tp-plp-loop-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--tp-space-3);
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.tp-plp-main .woocommerce-result-count,
.tp-plp-main .woocommerce-ordering {
  margin: 0;
}

.tp-plp-main .woocommerce-result-count {
  color: #415a78;
  font-size: var(--tp-font-size-md);
}

.tp-plp-main .woocommerce-ordering {
  margin-left: auto;
}

.tp-plp-main .woocommerce-ordering select {
  min-height: 52px;
  padding: 0 0.95rem;
  border-radius: 999px;
  border: 1px solid #d2deef;
  background: #ffffff;
  color: #21324b;
  font-family: var(--tp-font-ui);
  font-weight: 600;
  box-shadow: 0 8px 18px rgba(16, 24, 40, 0.04);
}

.tp-plp-filter-trigger {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 0.7rem;
  min-height: 52px;
  padding: 0 1.05rem;
  border-radius: 1rem;
  border: 1px solid #cfdced;
  background: #ffffff;
  color: #172a46;
  font-family: var(--tp-font-ui);
  font-size: 0.98rem;
  font-weight: 700;
  box-shadow: 0 10px 18px rgba(17, 24, 39, 0.05);
  cursor: pointer;
}

.tp-plp-filter-actions-mobile {
  display: none;
  align-items: center;
  gap: 0.55rem;
}

.tp-plp-filter-reset-mobile {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 0.95rem;
  border-radius: 1rem;
  border: 1px solid #cfdced;
  background: #ffffff;
  color: #2458d5;
  text-decoration: none;
  font-family: var(--tp-font-ui);
  font-size: 0.92rem;
  font-weight: 700;
  box-shadow: 0 10px 18px rgba(17, 24, 39, 0.05);
  white-space: nowrap;
}

.tp-plp-filter-reset-mobile:hover {
  color: #1d4ed8;
  border-color: #b9ceea;
}

.tp-plp-filter-trigger svg {
  width: 1.15rem;
  height: 1.15rem;
}

.tp-plp-filter-overlay {
  pointer-events: none;
}

.tp-plp-sidebar {
  padding: 1.1rem 1rem 1.2rem;
  min-width: 0;
  overflow-wrap: anywhere;
}

.tp-plp-sidebar-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.tp-plp-sidebar-kicker {
  display: block;
  margin-bottom: 0.15rem;
  color: #4b68a5;
  font-family: var(--tp-font-ui);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.tp-plp-sidebar-head strong {
  display: block;
  color: #1f2f47;
  font-family: var(--tp-font-heading);
  font-size: 1.35rem;
  line-height: 1.1;
}

.tp-plp-sidebar-actions {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.tp-plp-sidebar-clear {
  color: #2458d5;
  font-family: var(--tp-font-ui);
  font-size: 0.84rem;
  font-weight: 700;
  text-decoration: none;
}

.tp-plp-sidebar-clear:hover {
  color: #1d4ed8;
}

.tp-plp-sidebar-close {
  display: none;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  padding: 0;
  border-radius: 999px;
  border: 1px solid #d5e0ef;
  background: #ffffff;
  color: #1f2f47;
  box-shadow: none;
}

.tp-plp-sidebar-note {
  margin: 0.6rem 0 0;
  color: #5d7089;
  font-size: 0.93rem;
}

.tp-plp-sidebar-body {
  margin-top: var(--tp-space-4);
}

.tp-filter-group {
  border-top: 1px solid #e5edf7;
}

.tp-filter-group:first-child {
  border-top: 0;
}

.tp-filter-group + .tp-filter-group {
  margin-top: 0;
  padding-top: 0;
}

.tp-filter-group summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.95rem 0;
  cursor: pointer;
  color: #22324a;
  font-family: var(--tp-font-ui);
  font-size: 0.98rem;
  font-weight: 700;
}

.tp-filter-group summary::-webkit-details-marker {
  display: none;
}

.tp-filter-group-caret {
  width: 0.85rem;
  height: 0.85rem;
  border-right: 2px solid #4d6483;
  border-bottom: 2px solid #4d6483;
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}

.tp-filter-group[open] .tp-filter-group-caret {
  transform: rotate(225deg) translateY(-1px);
}

.tp-filter-group-body {
  padding: 0 0 1rem;
}

.tp-filter-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.5rem;
}

.tp-filter-option {
  display: flex;
  align-items: flex-start;
  gap: 0.72rem;
  padding: 0.55rem 0.15rem;
  border-radius: 0.85rem;
  color: #32465f;
  text-decoration: none;
  font-family: var(--tp-font-ui);
  font-size: 0.92rem;
  font-weight: 600;
  transition: background-color 0.18s ease, color 0.18s ease;
}

.tp-filter-option-label {
  flex: 1 1 auto;
  min-width: 0;
}

.tp-filter-option:hover {
  color: #1d4ed8;
  background: #f7fbff;
}

.tp-filter-option small {
  flex: 0 0 auto;
  margin-left: auto;
  color: #6a7f99;
  font-size: 0.78rem;
  white-space: nowrap;
  line-height: 1.15;
  padding-left: 0.35rem;
}

.tp-filter-option-ui {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 1rem;
}

.tp-filter-check {
  position: relative;
  width: 0.95rem;
  height: 0.95rem;
  border-radius: 0.24rem;
  border: 1.5px solid #bfd0e4;
  background: #ffffff;
}

.tp-filter-option.is-active {
  color: #1d4ed8;
}

.tp-filter-option.is-active .tp-filter-check::after {
  content: "";
  position: absolute;
  inset: 0.15rem;
  border-radius: 0.14rem;
  background: linear-gradient(180deg, #2f66e8, #2458d5);
}

.tp-filter-swatch {
  width: 1rem;
  height: 1rem;
  border-radius: 999px;
  border: 1.5px solid rgba(15, 23, 42, 0.14);
  background: var(--tp-filter-swatch, #ffffff);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55);
}

.tp-filter-option.is-active .tp-filter-swatch {
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.16), inset 0 0 0 1px rgba(255, 255, 255, 0.65);
}

.tp-filter-price-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
}

.tp-filter-price-grid label {
  display: grid;
  gap: 0.35rem;
  color: #4a6382;
  font-family: var(--tp-font-ui);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.tp-filter-price-grid input {
  min-height: 48px;
  width: 100%;
  max-width: 100%;
  padding: 0 0.8rem;
  border-radius: 0.85rem;
  border: 1px solid #d2deef;
  background: #ffffff;
  color: #1f2937;
  font-family: var(--tp-font-ui);
  box-sizing: border-box;
}

.tp-filter-apply {
  margin-top: 0.8rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  border-radius: 0.95rem;
}

.tp-filter-price-form {
  width: 100%;
}

.tp-plp-main .products,
.tp-plp-main ul.products {
  margin-top: 0;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--tp-space-4);
  box-sizing: border-box;
  padding: 0;
  list-style: none;
}

.tp-plp-main .woocommerce {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.tp-plp-main ul.products li.product,
.tp-plp-main.woocommerce-page ul.products li.product {
  width: auto !important;
  margin: 0 !important;
  min-width: 0;
  float: none !important;
  clear: none !important;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  padding: 1rem;
  border-color: #dbe6f4;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.06);
}

.tp-plp-main ul.products li.product img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: #f6f8fb;
  padding: 0.65rem;
}

.tp-plp-main ul.products li.product .ast-woo-product-category {
  display: inline-flex;
  margin-bottom: var(--tp-space-2);
  padding: 0.2rem 0.55rem;
  border-radius: var(--tp-radius-pill);
  background: var(--tp-color-surface-alt);
  color: var(--tp-color-text-soft);
  font-size: var(--tp-font-size-xs);
  font-weight: 600;
}

.tp-plp-main ul.products li.product h2.woocommerce-loop-product__title,
.tp-plp-main ul.products li.product h3.woocommerce-loop-product__title {
  margin-bottom: var(--tp-space-2);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.tp-plp-main ul.products li.product .price {
  display: block;
  margin-bottom: 0.9rem;
}

.tp-plp-main ul.products li.product a.button {
  width: 100%;
}

.tp-plp-main ul.products li.product .ast-shop-product-out-of-stock {
  border-radius: var(--tp-radius-pill);
  background: rgba(15, 23, 42, 0.78);
  font-size: var(--tp-font-size-xs);
  font-weight: 700;
  padding: 0.3rem 0.65rem;
}

.tp-plp-main ul.products li.product img[src*="woocommerce-placeholder"] {
  background: linear-gradient(135deg, #edf2ff, #f8faff);
}

.tp-plp-main .woocommerce-info {
  margin-top: 0;
  border: 1px solid #dbe6f4;
  border-radius: 1rem;
  background: #ffffff;
  box-shadow: var(--tp-shadow-sm);
}

.tp-plp-main .woocommerce-pagination {
  margin-top: var(--tp-space-5);
}

@media (min-width: 1024px) {
  .tp-plp-layout {
    grid-template-columns: minmax(260px, 280px) minmax(0, 1fr);
  }

  .tp-plp-main ul.products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .tp-plp-sidebar {
    position: sticky;
    top: 110px;
  }
}

@media (max-width: 1023.98px) {
  body.tp-plp-filters-open {
    overflow: hidden;
  }

  .tp-plp-shell {
    margin-top: var(--tp-space-4);
  }

  .tp-plp-layout {
    gap: var(--tp-space-4);
    overflow-x: clip;
  }

  .tp-plp-category-rail .tp-home-kicker {
    margin-bottom: 0.25rem;
  }

  .tp-plp-category-rail .tp-home-head h2 {
    font-size: 1.95rem;
  }

  .tp-plp-category-rail .tp-cat-rail {
    gap: 0.7rem;
    margin: 0;
    padding-left: 1.1rem;
    padding-right: 1.1rem;
    padding-bottom: 0.35rem;
  }

  .tp-plp-category-rail .tp-cat-link {
    width: clamp(92px, 26vw, 108px);
  }

  .tp-plp-category-rail .tp-cat-name {
    margin-top: 0.5rem;
    font-size: 0.92rem;
    line-height: 1.2;
  }

  .tp-plp-category-rail .tp-cat-rail-control {
    position: absolute;
    top: 50%;
    transform: translateY(-72%);
    z-index: 6;
    width: 2rem;
    height: 2.45rem;
    border-radius: 0.8rem;
    border: 1px solid #d2deef;
    background: rgba(255, 255, 255, 0.96);
    color: #315985;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 20px rgba(17, 38, 64, 0.12);
  }

  .tp-plp-category-rail .tp-cat-rail-control.is-prev {
    left: 0;
  }

  .tp-plp-category-rail .tp-cat-rail-control.is-next {
    right: 0;
  }

  .tp-plp-loop-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.85rem;
  }

  .tp-plp-main .woocommerce-result-count {
    order: 0;
    min-width: 0;
    font-size: 1rem;
  }

  .tp-plp-filter-trigger {
    order: 0;
    display: inline-flex;
    justify-self: auto;
    min-height: 3.25rem;
    padding: 0 1rem;
    font-size: 0.95rem;
  }

  .tp-plp-filter-actions-mobile {
    order: 0;
    display: inline-flex;
    justify-self: end;
  }

  .tp-plp-main .woocommerce-ordering {
    grid-column: 1 / -1;
    margin-left: 0;
    width: 100%;
    max-width: 100%;
  }

  .tp-plp-main .woocommerce-ordering select {
    width: 100%;
  }

  .tp-plp-filter-overlay {
    position: fixed;
    inset: 0;
    z-index: 9995;
    background: rgba(15, 23, 42, 0.44);
  }

  .tp-plp-filter-overlay[hidden] {
    display: none !important;
  }

  body.tp-plp-filters-open .tp-plp-filter-overlay {
    display: block;
    pointer-events: auto;
  }

  .tp-plp-sidebar {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 9996;
    width: min(88vw, 360px);
    max-width: 360px;
    padding: 1.1rem 1rem 1.3rem;
    border-radius: 0 1.25rem 1.25rem 0;
    overflow: auto;
    box-shadow: 0 22px 44px rgba(15, 23, 42, 0.24);
    transform: translateX(-108%);
    transition: transform 0.26s ease;
    box-sizing: border-box;
  }

  body.tp-plp-filters-open .tp-plp-sidebar {
    transform: translateX(0);
  }

  .tp-plp-sidebar-close {
    display: inline-flex;
  }
}

@media (max-width: 767.98px) {
  html,
  body,
  body.tp-commerce-template,
  body.tp-commerce-template #page,
  body.tp-commerce-template .site,
  body.tp-commerce-template #content.site-content,
  body.tp-commerce-template .tp-commerce-main,
  body.tp-commerce-template .tp-plp-shell,
  body.tp-commerce-template .tp-plp-layout,
  body.tp-commerce-template .tp-plp-main {
    overflow-x: clip;
  }

  .tp-plp-topbar {
    padding: 1.15rem 1rem 1rem;
  }

  .tp-plp-main ul.products li.product h2.woocommerce-loop-product__title,
  .tp-plp-main ul.products li.product h3.woocommerce-loop-product__title {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.15;
    min-height: 3.45em;
    font-size: 1.5rem;
  }

  .tp-plp-topbar h1 {
    margin-top: 0.3rem;
    margin-bottom: 0.6rem;
    font-size: 2rem;
  }

  .tp-plp-description {
    font-size: 0.98rem;
    line-height: 1.6;
  }

  .tp-plp-category-rail .tp-home-head {
    margin-bottom: 0.35rem;
  }

  .tp-plp-category-rail .tp-home-kicker,
  .tp-plp-category-rail .tp-home-head h2 {
    display: block;
  }

  .tp-plp-category-rail .tp-cat-rail-wrap::before,
  .tp-plp-category-rail .tp-cat-rail-wrap::after {
    bottom: 1.85rem;
    width: 1.65rem;
  }

  .tp-plp-category-rail .tp-cat-rail {
    gap: 0.65rem;
    padding-top: 0.28rem;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-bottom: 0.2rem;
    margin: 0;
  }

  .tp-plp-category-rail .tp-cat-link {
    width: 84px;
  }

  .tp-plp-category-rail .tp-home-head h2 {
    font-size: clamp(1.42rem, 6vw, 1.78rem);
  }

  .tp-plp-category-rail .tp-cat-thumb {
    border-radius: 999px;
  }

  .tp-plp-category-rail .tp-cat-name {
    margin-top: 0.45rem;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1.18;
  }

  .tp-plp-category-rail .tp-cat-rail-control {
    width: 1.8rem;
    height: 2.2rem;
    border-radius: 0.75rem;
    box-shadow: 0 10px 18px rgba(17, 38, 64, 0.1);
  }

  .tp-plp-loop-toolbar {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.75rem;
  }

  .tp-plp-main .woocommerce-result-count {
    font-size: 0.95rem;
  }

  .tp-plp-filter-trigger {
    min-height: 3rem;
    padding: 0 0.9rem;
    border-radius: 0.9rem;
    white-space: nowrap;
  }

  .tp-plp-filter-reset-mobile {
    min-height: 3rem;
    padding: 0 0.8rem;
    border-radius: 0.9rem;
    font-size: 0.86rem;
  }

  .tp-filter-price-grid {
    grid-template-columns: 1fr;
  }

  .tp-plp-main ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--tp-space-3);
  }

  .tp-plp-main ul.products li.product {
    width: 100% !important;
    max-width: 100%;
  }
}

@media (max-width: 479.98px) {
  .tp-plp-main ul.products {
    grid-template-columns: minmax(0, 1fr);
  }

  .tp-plp-main ul.products li.product {
    width: 100% !important;
    max-width: 100%;
    padding: 0.9rem;
  }

  .tp-plp-main ul.products li.product h2.woocommerce-loop-product__title,
  .tp-plp-main ul.products li.product h3.woocommerce-loop-product__title {
    font-size: 1.25rem;
    min-height: 3.3em;
  }
}

/* ===============================
   11) Phase 1 - Homepage Composition
   =============================== */
.tp-home-section {
  width: min(var(--tp-shell-max), calc(100% - (var(--tp-shell-gutter) * 2)));
  margin-left: auto;
  margin-right: auto;
  margin-top: var(--tp-space-8);
}

.tp-home-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: var(--tp-space-3);
  margin-bottom: var(--tp-space-4);
}

.tp-home-head h2 {
  margin: 0;
}

.tp-home-kicker {
  margin: 0 0 var(--tp-space-2);
  color: var(--tp-color-primary-hover);
  font-size: var(--tp-font-size-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.tp-home-trust {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-3);
  margin-top: var(--tp-space-5);
}

.tp-home-trust-item {
  background: #ffffff;
  border: 1px solid var(--tp-color-border);
  border-radius: var(--tp-radius-md);
  padding: var(--tp-space-4);
  box-shadow: var(--tp-shadow-sm);
}

.tp-home-trust-item strong {
  display: block;
  margin-bottom: 0.12rem;
  color: var(--tp-color-ink);
}

.tp-explore-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--tp-space-3);
}

.tp-explore-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.55rem;
  background: #ffffff;
  border: 1px solid var(--tp-color-border);
  border-radius: 0.9rem;
  padding: 0.8rem 0.65rem;
  text-decoration: none;
  color: var(--tp-color-text);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.tp-explore-card:hover {
  transform: translateY(-2px);
  border-color: #bad1ef;
  box-shadow: 0 12px 22px rgba(12, 40, 75, 0.1);
}

.tp-explore-card img {
  width: 56px;
  height: 56px;
  border-radius: 999px;
  border: 1px solid #d7e2f0;
  object-fit: cover;
  background: #eff5fe;
}

.tp-explore-card span {
  font-size: var(--tp-font-size-sm);
  font-weight: 700;
}

.tp-collection-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-4);
}

.tp-collection-card {
  display: block;
  background: #ffffff;
  border: 1px solid var(--tp-color-border);
  border-radius: 1rem;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  box-shadow: var(--tp-shadow-sm);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.tp-collection-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 28px rgba(11, 35, 69, 0.13);
}

.tp-collection-media {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #dae8fb;
}

.tp-collection-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.tp-collection-body {
  padding: var(--tp-space-4);
}

.tp-collection-body h3 {
  margin: 0 0 0.35rem;
  font-size: 1.05rem;
}

.tp-collection-body p {
  margin: 0;
  font-size: var(--tp-font-size-sm);
}

.tp-seasonal-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--tp-space-3);
}

.tp-seasonal-card {
  display: block;
  text-decoration: none;
  color: inherit;
  border-radius: 0.95rem;
  overflow: hidden;
  border: 1px solid var(--tp-color-border);
  background: #ffffff;
  box-shadow: var(--tp-shadow-sm);
}

.tp-seasonal-card img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
}

.tp-seasonal-card span {
  display: block;
  padding: 0.6rem 0.75rem;
  font-size: var(--tp-font-size-sm);
  font-weight: 700;
}

.tp-launch-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-4);
}

.tp-launch-card {
  border-radius: 1rem;
  padding: var(--tp-space-5);
  border: 1px solid var(--tp-color-border);
}

.tp-launch-card h3 {
  margin: 0 0 0.4rem;
}

.tp-launch-card p {
  margin: 0;
}

.tp-launch-card.is-primary {
  background: var(--tp-color-ink);
  border-color: #18365f;
  color: #dbe7f7;
}

.tp-launch-card.is-primary h3 {
  color: #ffffff;
}

.tp-launch-card.is-secondary {
  background: #ffffff;
}

.tp-launch-code {
  margin-top: var(--tp-space-3);
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0.2rem 0.7rem;
  border: 1px dashed rgba(250, 204, 21, 0.65);
  border-radius: var(--tp-radius-pill);
  font-weight: 700;
  color: #fde68a;
}

.tp-btn-accent {
  font-family: var(--tp-font-ui);
  color: #111827;
  background: var(--tp-color-accent);
  border-color: #f0c000;
}

.tp-btn-accent:hover {
  background: #eab308;
  color: #0f172a;
}

.tp-tools-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-3);
}

.tp-tool-card {
  background: #ffffff;
  border: 1px solid var(--tp-color-border);
  border-radius: 0.95rem;
  padding: var(--tp-space-4);
  box-shadow: var(--tp-shadow-sm);
}

.tp-tool-card h4 {
  margin: 0 0 0.35rem;
  font-size: 1rem;
}

.tp-tool-card p {
  margin: 0;
  font-size: var(--tp-font-size-sm);
}

@media (min-width: 768px) {
  .tp-home-trust {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .tp-explore-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .tp-collection-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .tp-seasonal-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .tp-launch-grid {
    grid-template-columns: 1.1fr 0.9fr;
  }

  .tp-tools-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* ===============================
   12) Conversion Blocks
   =============================== */
.tp-kpi-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--tp-space-3);
}

.tp-kpi-card {
  background: #ffffff;
  border: 1px solid var(--tp-color-border);
  border-radius: 0.85rem;
  padding: 0.9rem 0.8rem;
  box-shadow: var(--tp-shadow-sm);
}

.tp-kpi-card strong {
  display: block;
  font-family: var(--tp-font-heading);
  font-size: 1.35rem;
  line-height: 1;
  color: var(--tp-color-primary);
  margin-bottom: 0.2rem;
}

.tp-kpi-card span {
  font-size: var(--tp-font-size-xs);
  color: var(--tp-color-text-soft);
}

.tp-logo-cloud {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--tp-space-2);
}

.tp-logo-item {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  border-radius: 0.75rem;
  border: 1px solid var(--tp-color-border);
  background: #ffffff;
  color: #667085;
  font-family: var(--tp-font-ui);
  font-size: var(--tp-font-size-sm);
  font-weight: 700;
  letter-spacing: 0.01em;
}

.tp-how-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-3);
}

.tp-how-card {
  background: #ffffff;
  border: 1px solid var(--tp-color-border);
  border-radius: 0.95rem;
  padding: var(--tp-space-4);
  box-shadow: var(--tp-shadow-sm);
}

.tp-how-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  margin-bottom: var(--tp-space-2);
  background: var(--tp-color-primary-soft);
  color: var(--tp-color-primary-hover);
  font-family: var(--tp-font-heading);
  font-size: 0.85rem;
  font-weight: 700;
}

.tp-how-card h3 {
  margin: 0 0 0.35rem;
  font-size: 1rem;
}

.tp-how-card p {
  margin: 0;
  font-size: var(--tp-font-size-sm);
}

.tp-reviews-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-3);
}

.tp-review-card {
  background: #ffffff;
  border: 1px solid var(--tp-color-border);
  border-radius: 0.95rem;
  padding: var(--tp-space-4);
  box-shadow: var(--tp-shadow-sm);
}

.tp-stars {
  color: #f59e0b;
  font-size: 0.9rem;
  letter-spacing: 0.12em;
  margin-bottom: 0.45rem;
}

.tp-review-card p {
  margin: 0 0 0.45rem;
  font-size: var(--tp-font-size-sm);
}

.tp-review-card cite {
  font-style: normal;
  color: var(--tp-color-text-soft);
  font-size: var(--tp-font-size-xs);
}

.tp-faq {
  background: #ffffff;
  border: 1px solid var(--tp-color-border);
  border-radius: 1rem;
  box-shadow: var(--tp-shadow-sm);
}

.tp-faq details + details {
  border-top: 1px solid var(--tp-color-border);
}

.tp-faq summary {
  cursor: pointer;
  list-style: none;
  padding: var(--tp-space-4);
  font-family: var(--tp-font-ui);
  font-weight: 700;
  color: var(--tp-color-ink);
}

.tp-faq summary::-webkit-details-marker {
  display: none;
}

.tp-faq p {
  margin: 0;
  padding: 0 var(--tp-space-4) var(--tp-space-4);
  font-size: var(--tp-font-size-sm);
}

.tp-mobile-sticky {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  display: flex;
  gap: var(--tp-space-2);
  padding: 0.6rem 0.75rem calc(0.6rem + env(safe-area-inset-bottom));
  background: rgba(248, 250, 252, 0.95);
  border-top: 1px solid var(--tp-color-border);
  backdrop-filter: blur(8px);
}

.tp-mobile-sticky a {
  flex: 1;
  min-height: 44px;
}

@media (min-width: 768px) {
  .tp-kpi-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .tp-logo-cloud {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: var(--tp-space-3);
  }

  .tp-how-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .tp-reviews-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .tp-mobile-sticky {
    display: none;
  }
}

/* ===============================
   13) Phase 1.1 - Professional Refresh
   =============================== */
body {
  background: radial-gradient(circle at 12% -10%, rgba(37, 99, 235, 0.08), transparent 34%),
    radial-gradient(circle at 100% 0%, rgba(14, 165, 164, 0.06), transparent 28%), var(--tp-color-bg);
}

.site-main {
  padding-bottom: 5.5rem;
}

.tp-home-section {
  margin-top: clamp(2rem, 3.8vw, 3rem);
}

.tp-home-head {
  margin-bottom: var(--tp-space-5);
}

.tp-home-head h2 {
  font-size: clamp(1.4rem, 2.5vw, 1.95rem);
  letter-spacing: -0.025em;
}

.tp-btn-accent {
  box-shadow: 0 8px 16px rgba(250, 204, 21, 0.34);
}

.tp-home-trust--bar {
  margin-top: var(--tp-space-4);
  gap: var(--tp-space-2);
}

.tp-home-trust--bar .tp-home-trust-item {
  border-radius: 0.85rem;
  box-shadow: none;
  background: #ffffff;
  padding: 0.85rem 0.9rem;
}

.tp-shop-quick-nav {
  margin-top: var(--tp-space-4);
}

.tp-shop-chip-row {
  display: flex;
  gap: 0.55rem;
  overflow-x: auto;
  padding: 0.15rem 0 0.2rem;
  scrollbar-width: thin;
}

.tp-shop-chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 0.35rem 0.8rem;
  border-radius: var(--tp-radius-pill);
  border: 1px solid #d9e5f4;
  background: #ffffff;
  color: #2d4e72;
  text-decoration: none;
  font-size: 0.82rem;
  font-weight: 700;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.tp-shop-chip:hover {
  border-color: #bfd3ee;
  background: #f8fbff;
}

.tp-shop-chip.is-active {
  border-color: #b6cced;
  background: #edf4ff;
  color: #1d4ed8;
}

.tp-product-rail {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-3);
}

.tp-product-tile {
  position: relative;
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  align-items: start;
  gap: var(--tp-space-3);
  border: 1px solid #dbe6f3;
  border-radius: 1rem;
  background: #ffffff;
  box-shadow: 0 8px 18px rgba(14, 33, 58, 0.06);
  padding: 0.75rem;
}

.tp-card-clickable {
  cursor: pointer;
}

.tp-card-clickable:focus-visible {
  outline: 2px solid #3b82f6;
  outline-offset: 2px;
}

.tp-product-favorite {
  position: absolute;
  top: 0.6rem;
  right: 0.6rem;
  z-index: 7;
}

.tp-product-media {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  padding: 0.42rem;
  border-radius: 0.8rem;
  overflow: hidden;
  background: #eff5fe;
}

.tp-product-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  display: block;
}

.tp-product-body h3 {
  margin: 0;
  font-size: 1rem;
  line-height: 1.2;
}

.tp-product-body h3 a {
  color: var(--tp-color-ink);
  text-decoration: none;
}

.tp-product-body h3 a:hover {
  color: var(--tp-color-primary);
}

.tp-product-meta {
  margin: 0.2rem 0 0;
  font-size: 0.78rem;
  color: #617188;
}

.tp-product-price {
  margin: 0.45rem 0 0;
  font-size: 0.82rem;
  color: #526882;
}

.tp-product-price strong {
  font-family: var(--tp-font-ui);
  font-size: 1.02rem;
  color: var(--tp-color-ink);
}

.tp-product-footer {
  margin-top: 0.45rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem;
}

.tp-product-footer .tp-stars {
  margin: 0;
  font-size: 0.76rem;
  letter-spacing: 0.08em;
}

.tp-product-footer a {
  color: var(--tp-color-primary);
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
}

.tp-product-footer a:hover {
  color: var(--tp-color-primary-hover);
}

.tp-section-cta {
  margin-top: var(--tp-space-4);
  display: flex;
  justify-content: center;
}

.tp-section-cta-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-height: 42px;
  padding: 0.5rem 1rem;
  border-radius: 0.8rem;
  border: 1px solid #bfd3ee;
  background: linear-gradient(180deg, #ffffff, #f6faff);
  color: #214f9e;
  text-decoration: none;
  font-family: var(--tp-font-ui);
  font-size: 0.85rem;
  font-weight: 700;
  transition: transform 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
}

.tp-section-cta-link:hover {
  transform: translateY(-1px);
  border-color: #96b4dc;
  background: #ffffff;
}

.tp-category-rail-pro .tp-home-head {
  margin-bottom: var(--tp-space-3);
}

.tp-category-rail-pro.is-primary {
  margin-top: var(--tp-space-5);
}

.tp-cat-rail-wrap {
  position: relative;
}

.tp-cat-rail-wrap::before,
.tp-cat-rail-wrap::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 2.1rem;
  width: 2.35rem;
  pointer-events: none;
  z-index: 3;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.tp-cat-rail-wrap::before {
  left: -0.15rem;
  background: linear-gradient(90deg, var(--tp-color-bg) 22%, rgba(248, 250, 252, 0));
}

.tp-cat-rail-wrap::after {
  right: -0.15rem;
  background: linear-gradient(270deg, var(--tp-color-bg) 22%, rgba(248, 250, 252, 0));
}

.tp-cat-rail-wrap.is-scrollable.can-left::before {
  opacity: 0.95;
}

.tp-cat-rail-wrap.is-scrollable.can-right::after {
  opacity: 0.95;
}

.tp-cat-rail-hint {
  position: absolute;
  right: 0.2rem;
  bottom: 0.04rem;
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  min-height: 1.25rem;
  padding: 0.08rem 0.46rem;
  border-radius: 999px;
  border: 1px solid #d6e3f2;
  background: rgba(255, 255, 255, 0.82);
  color: #406187;
  font-family: var(--tp-font-ui);
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  pointer-events: none;
  backdrop-filter: blur(2px);
  opacity: 0;
  transform: translateY(2px);
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 4;
}

.tp-cat-rail-hint::after {
  content: "›";
  font-size: 0.78rem;
  line-height: 1;
}

.tp-cat-rail-wrap.is-scrollable.can-right .tp-cat-rail-hint {
  opacity: 0.9;
  transform: translateY(0);
}

.tp-cat-rail {
  display: flex;
  gap: 0.85rem;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0.3rem 0.8rem 0.65rem 0.15rem;
  margin: 0 -0.15rem;
  scroll-snap-type: x proximity;
  scroll-padding-inline: 0.15rem;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  touch-action: pan-x;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.tp-cat-rail-control {
  display: none;
}

.tp-cat-rail.is-desktop-scroll {
  cursor: grab;
  scroll-behavior: auto;
  scroll-snap-type: x proximity;
}

.tp-cat-rail.is-desktop-scroll.is-dragging {
  cursor: grabbing;
  user-select: none;
}

@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
  .tp-cat-rail-wrap .tp-cat-rail {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .tp-cat-rail-control {
    position: absolute;
    top: 50%;
    transform: translateY(-72%);
    z-index: 6;
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 999px;
    border: 1px solid #c8d9ef;
    background: rgba(255, 255, 255, 0.94);
    color: #315985;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--tp-font-ui);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 8px 16px rgba(17, 38, 64, 0.15);
    transition: transform 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease, border-color 0.18s ease;
    cursor: pointer;
  }

  .tp-cat-rail-control.is-prev {
    left: -0.08rem;
  }

  .tp-cat-rail-control.is-next {
    right: -0.08rem;
  }

  .tp-cat-rail-control:hover:not(:disabled) {
    transform: translateY(-72%) scale(1.02);
    border-color: #a7c1e2;
    box-shadow: 0 10px 18px rgba(17, 38, 64, 0.2);
  }

  .tp-cat-rail-control:disabled {
    opacity: 0.35;
    cursor: default;
    box-shadow: none;
  }

  .tp-cat-rail-wrap:not(.is-scrollable) .tp-cat-rail-control {
    opacity: 0;
    pointer-events: none;
  }

  .tp-cat-rail-wrap:not(.can-left) .tp-cat-rail-control.is-prev {
    opacity: 0;
    pointer-events: none;
    transform: translateY(-72%) scale(0.92);
  }

  .tp-cat-rail-wrap:not(.can-right) .tp-cat-rail-control.is-next {
    opacity: 0;
    pointer-events: none;
    transform: translateY(-72%) scale(0.92);
  }

  .tp-cat-rail-wrap .tp-cat-rail-hint {
    display: none;
  }
}

.tp-cat-link {
  flex: 0 0 auto;
  width: clamp(112px, 13.5vw, 134px);
  text-decoration: none;
  color: var(--tp-color-ink);
  text-align: center;
  scroll-snap-align: start;
}

.tp-cat-thumb {
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 999px;
  border: 1px solid #dbe6f4;
  background: radial-gradient(circle at 30% 25%, #ffffff, #eef5ff 72%);
  box-shadow: 0 10px 18px rgba(13, 33, 57, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.tp-cat-link:hover .tp-cat-thumb {
  transform: translateY(-2px);
  border-color: #b7cdec;
  box-shadow: 0 14px 24px rgba(13, 33, 57, 0.12);
}

.tp-cat-link.is-active .tp-cat-thumb {
  transform: translateY(-2px);
  border-color: rgba(37, 99, 235, 0.35);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12), 0 14px 24px rgba(13, 33, 57, 0.12);
}

.tp-cat-thumb img {
  width: 72%;
  height: 72%;
  object-fit: cover;
  border-radius: 999px;
}

.tp-category-rail-pro.is-fill-circle-images .tp-cat-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.tp-cat-rail::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.tp-cat-name-fallback {
  font-family: var(--tp-font-heading);
  font-size: 2rem;
  color: #7f93ac;
  font-weight: 700;
}

.tp-cat-name {
  margin-top: 0.65rem;
  display: block;
  font-family: var(--tp-font-ui);
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.25;
}

.tp-cat-link.is-active .tp-cat-name {
  color: var(--tp-color-primary);
}

.tp-explore-grid--pro {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--tp-space-3);
}

.tp-explore-grid--pro .tp-explore-card {
  align-items: stretch;
  text-align: left;
  border-radius: 1rem;
  padding: 0.6rem;
  box-shadow: 0 8px 16px rgba(13, 35, 62, 0.05);
}

.tp-explore-grid--pro .tp-explore-card img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 10;
  border-radius: 0.7rem;
  border-color: #deebf7;
}

.tp-explore-grid--pro .tp-explore-card span {
  padding: 0.12rem 0.25rem 0.25rem;
  font-size: 0.88rem;
}

.tp-featured-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-4);
}

.tp-featured-card {
  position: relative;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--tp-color-border);
  border-radius: 1rem;
  background: #ffffff;
  box-shadow: var(--tp-shadow-sm);
  overflow: hidden;
}

.tp-featured-favorite {
  position: absolute;
  top: 0.6rem;
  right: 0.6rem;
  z-index: 7;
}

.tp-featured-media {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  background: #ebf3fd;
}

.tp-featured-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  padding: 0.8rem;
  display: block;
}

.tp-featured-body {
  display: flex;
  flex-direction: column;
  padding: var(--tp-space-4);
}

.tp-badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-bottom: 0.55rem;
}

.tp-featured-body h3 {
  margin: 0 0 0.35rem;
  font-size: 1rem;
}

.tp-featured-body p {
  margin: 0 0 0.8rem;
  min-height: 3em;
  font-size: var(--tp-font-size-sm);
}

.tp-featured-link {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 0;
  min-height: 34px;
  width: fit-content;
  padding: 0.22rem 0;
  border: 0;
  background: transparent;
  color: #214f9e;
  text-decoration: none;
  font-family: var(--tp-font-ui);
  font-size: 0.86rem;
  font-weight: 700;
  transition: color 0.2s ease;
}

.tp-featured-link:hover {
  color: #1d4ed8;
}

.tp-product-body h3 a,
.tp-product-body h3 a:visited,
.tp-product-body h3 a:hover,
.tp-product-body h3 a:focus,
.tp-product-footer a,
.tp-product-footer a:visited,
.tp-product-footer a:hover,
.tp-product-footer a:focus,
.tp-featured-link,
.tp-featured-link:visited,
.tp-featured-link:hover,
.tp-featured-link:focus {
  text-decoration: none;
}

.tp-campaign-layout {
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  gap: var(--tp-space-3);
}

.tp-campaign-stack {
  display: grid;
  grid-template-columns: 1fr;
  align-content: start;
  gap: var(--tp-space-3);
}

.tp-campaign-hero,
.tp-campaign-mini {
  position: relative;
  display: block;
  border-radius: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.28);
  padding: clamp(1rem, 2.6vw, 1.5rem);
  text-decoration: none;
  color: #ffffff;
  overflow: hidden;
}

.tp-campaign-hero,
.tp-campaign-hero:visited,
.tp-campaign-hero:hover,
.tp-campaign-hero:focus,
.tp-campaign-hero:focus-visible,
.tp-campaign-mini,
.tp-campaign-mini:visited,
.tp-campaign-mini:hover,
.tp-campaign-mini:focus,
.tp-campaign-mini:focus-visible {
  color: #ffffff;
  text-decoration: none;
}

.tp-campaign-hero {
  min-height: 190px;
  background: linear-gradient(130deg, #1e3a8a, #2563eb 46%, #0ea5a4);
  box-shadow: 0 18px 30px rgba(19, 41, 84, 0.2);
}

.tp-campaign-mini {
  min-height: 96px;
  box-shadow: 0 12px 22px rgba(19, 41, 84, 0.14);
}

.tp-home-season-highlight .tp-home-head {
  margin-bottom: var(--tp-space-3);
}

.tp-head-micro-cta {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0.16rem 0;
  color: #1e4f9a;
  text-decoration: none;
  font-family: var(--tp-font-ui);
  font-size: 0.84rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1.1;
  transition: color 0.2s ease, opacity 0.2s ease;
}

.tp-head-micro-cta::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, rgba(30, 79, 154, 0.72), rgba(14, 165, 164, 0.4));
}

.tp-head-micro-cta:hover {
  color: #163f7d;
  opacity: 0.92;
  text-decoration: none;
}

.tp-head-micro-cta:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.16);
  border-radius: 0.3rem;
}

.tp-home-season-highlight .tp-campaign-hero p {
  max-width: 35ch;
}

.tp-campaign-mini.is-worldcup {
  background: linear-gradient(140deg, #0d2f6e, #1558c0);
}

.tp-campaign-mini.is-back2school {
  background: linear-gradient(140deg, #065f8d, #0f766e);
}

.tp-campaign-hero h3,
.tp-campaign-mini h3 {
  margin: 0;
  color: #ffffff;
  max-width: 22ch;
}

.tp-campaign-hero p {
  margin: 0.5rem 0 0;
  max-width: 38ch;
  color: rgba(255, 255, 255, 0.94);
}

.tp-campaign-tag {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  margin-bottom: 0.65rem;
  padding: 0.2rem 0.6rem;
  border-radius: var(--tp-radius-pill);
  border: 1px solid rgba(255, 255, 255, 0.38);
  font-size: var(--tp-font-size-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.tp-how-grid--pro .tp-how-card {
  position: relative;
  border-radius: 1rem;
  border: 1px solid #dce7f3;
  border-top: 3px solid #d7e4f3;
  background: linear-gradient(170deg, #ffffff, #f8fbff);
  padding: 1rem 1rem 1.05rem;
  box-shadow: 0 8px 18px rgba(17, 38, 66, 0.06);
}

.tp-how-grid--pro .tp-how-card:hover {
  border-top-color: var(--tp-color-primary);
}

.tp-how-visual {
  width: 86px;
  height: 86px;
  border-radius: 1rem;
  margin-bottom: 0.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d9e6f5;
  box-shadow: 0 10px 18px rgba(15, 35, 60, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.tp-how-visual svg {
  width: 74px;
  height: 74px;
}

.tp-how-visual.has-image {
  padding: 0;
  overflow: hidden;
}

.tp-how-visual.has-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}

.tp-how-visual.is-discover {
  background: linear-gradient(150deg, #f5f9ff, #e8f1ff);
}

.tp-how-visual.is-customize {
  background: linear-gradient(150deg, #f2f8ff, #e8f1ff);
}

.tp-how-visual.is-deliver {
  background: linear-gradient(150deg, #f8fbff, #eef5fe);
}

.tp-how-grid--pro .tp-how-step {
  position: absolute;
  top: 0.95rem;
  right: 0.95rem;
  margin: 0;
  width: 2rem;
  height: 2rem;
  font-size: 0.8rem;
}

.tp-how-grid--pro .tp-how-card h3 {
  margin: 0.12rem 0 0.3rem;
}

.tp-how-grid--pro .tp-how-card p {
  margin: 0;
  min-height: 3em;
}

.tp-proof-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-4);
}

.tp-reviews-grid--compact {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0.9rem;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0.08rem 0.04rem 0.48rem;
  scroll-snap-type: x proximity;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.tp-reviews-grid--compact::-webkit-scrollbar {
  display: none;
}

.tp-reviews-grid--compact .tp-review-card {
  flex: 0 0 clamp(272px, 34vw, 360px);
  min-width: clamp(272px, 34vw, 360px);
  scroll-snap-align: start;
}

.tp-reviews-marquee {
  width: 100%;
  overflow: hidden;
  padding: 0.08rem 0.04rem 0.48rem;
}

.tp-reviews-grid--compact.is-marquee-track {
  overflow: visible;
  width: max-content;
  min-width: max-content;
  padding: 0;
  scroll-snap-type: none;
  animation: none;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  will-change: transform;
}

.tp-reviews-grid--compact.is-marquee-track .tp-review-card.is-clone {
  pointer-events: none;
}

.tp-review-card {
  position: relative;
  border-radius: 1rem;
  border: 1px solid #dbe4f0;
  background: linear-gradient(160deg, #ffffff, #f9fcff);
  box-shadow: 0 10px 20px rgba(17, 36, 62, 0.06);
}

.tp-review-top {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin-bottom: 0.35rem;
}

.tp-review-avatar {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(150deg, #2563eb, #0ea5a4);
  color: #ffffff;
  font-size: 0.75rem;
  font-weight: 700;
}

.tp-review-avatar.is-image {
  background: #ffffff;
  border: 1px solid #d3e0f1;
  overflow: hidden;
}

.tp-review-avatar.is-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.tp-review-top strong {
  display: block;
  color: var(--tp-color-ink);
  font-family: var(--tp-font-ui);
  font-size: var(--tp-font-size-sm);
}

.tp-review-top cite {
  display: block;
  margin-top: 0.05rem;
}

.tp-logo-marquee-wrap {
  margin-top: var(--tp-space-4);
}

.tp-proof-title {
  margin: 0;
  font-family: var(--tp-font-ui);
  font-size: var(--tp-font-size-sm);
  color: var(--tp-color-ink);
  font-weight: 700;
}

.tp-proof-sub {
  margin: 0;
  color: #5a6d86;
  font-size: 0.8rem;
}

.tp-proof-headline {
  margin-bottom: var(--tp-space-2);
  display: grid;
  gap: 0.2rem;
}

.tp-logo-marquee-wrap--pro {
  margin-top: var(--tp-space-3);
  border-radius: 1rem;
  padding: 0.9rem;
  border: 1px solid #1f3757;
  background: linear-gradient(155deg, #0f172a, #10243f);
  box-shadow: 0 16px 28px rgba(9, 21, 38, 0.24);
}

.tp-industry-wrap {
  margin-top: var(--tp-space-3);
  border-radius: 1rem;
  padding: 0.95rem;
  border: 1px solid #d7e4f3;
  background: linear-gradient(165deg, #ffffff, #f6faff);
  box-shadow: 0 12px 22px rgba(12, 32, 57, 0.07);
}

.tp-industry-grid {
  margin-top: 0.25rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
}

.tp-industry-item {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.4rem 0.65rem;
  border-radius: 0.68rem;
  border: 1px solid #d6e3f2;
  background: #ffffff;
  color: #2b4c70;
  text-decoration: none;
  font-family: var(--tp-font-ui);
  font-size: 0.8rem;
  font-weight: 700;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.tp-industry-item i {
  width: 0.46rem;
  height: 0.46rem;
  border-radius: 999px;
  background: linear-gradient(145deg, #2563eb, #0ea5a4);
}

.tp-industry-item:hover {
  border-color: #b8cde9;
  box-shadow: 0 8px 14px rgba(16, 35, 58, 0.08);
  transform: translateY(-1px);
}

.tp-logo-marquee {
  position: relative;
  overflow: hidden;
  border: 1px solid #27415f;
  border-radius: 0.8rem;
  background: rgba(13, 26, 45, 0.62);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.tp-logo-marquee::before,
.tp-logo-marquee::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 42px;
  z-index: 2;
  pointer-events: none;
}

.tp-logo-marquee::before {
  left: 0;
  background: linear-gradient(90deg, #10243e, rgba(16, 36, 62, 0));
}

.tp-logo-marquee::after {
  right: 0;
  background: linear-gradient(270deg, #10243e, rgba(16, 36, 62, 0));
}

.tp-logo-track {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  width: max-content;
  padding: 0.6rem;
  animation: tp-logo-scroll 24s linear infinite;
}

.tp-logo-marquee:hover .tp-logo-track {
  animation-play-state: paused;
}

.tp-logo-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 116px;
  min-height: 40px;
  padding: 0.35rem 0.7rem;
  border-radius: 0.6rem;
  border: 1px solid #2a425f;
  background: rgba(255, 255, 255, 0.03);
  color: #d7e3f6;
  font-family: var(--tp-font-ui);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

@keyframes tp-logo-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .tp-logo-track {
    animation: none;
  }
}

.tp-faq {
  box-shadow: 0 14px 24px rgba(14, 33, 58, 0.08);
}

.tp-faq-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-3);
}

.tp-faq-aside {
  border-radius: 1rem;
  border: 1px solid #d9e5f4;
  background: linear-gradient(160deg, #ffffff, #f4f9ff);
  padding: var(--tp-space-4);
  box-shadow: var(--tp-shadow-sm);
}

.tp-faq-aside h3 {
  margin: 0 0 0.25rem;
  font-size: 1.05rem;
}

.tp-faq-aside p {
  margin: 0 0 0.6rem;
  font-size: var(--tp-font-size-sm);
}

.tp-faq-points {
  margin: 0 0 0.85rem;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.38rem;
}

.tp-faq-points li {
  position: relative;
  padding-left: 1rem;
  font-size: 0.82rem;
  color: #445d7d;
}

.tp-faq-points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.43rem;
  width: 0.38rem;
  height: 0.38rem;
  border-radius: 999px;
  background: #2563eb;
}

.tp-faq--pro {
  border-radius: 1rem;
  border: 1px solid #d6e3f2;
  background: linear-gradient(160deg, #ffffff, #f9fcff);
}

.tp-faq summary {
  position: relative;
  padding-right: 2.35rem;
}

.tp-faq summary::after {
  content: "+";
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.1rem;
  color: #7a8ea8;
}

.tp-faq details[open] summary::after {
  content: "-";
}

/* ===============================
   14) Footer
   =============================== */
.tp-footer {
  margin-top: clamp(2.5rem, 4vw, 4rem);
  border-top: 1px solid #1f2a3d;
  background: radial-gradient(circle at 8% -20%, rgba(37, 99, 235, 0.2), transparent 38%),
    linear-gradient(180deg, #0a0f18, #060b14);
}

.tp-footer .preview-shell {
  padding-top: 1.6rem;
  padding-bottom: 1.1rem;
}

.tp-footer-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: 1.05rem;
  border: 1px solid rgba(121, 171, 219, 0.38);
  background: linear-gradient(
    124deg,
    rgba(37, 99, 235, 0.72) 0%,
    rgba(42, 120, 232, 0.66) 44%,
    rgba(14, 165, 164, 0.62) 100%
  );
  padding: 1.12rem 1.2rem;
  display: grid;
  gap: 0.95rem;
  box-shadow: 0 12px 22px rgba(3, 10, 22, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.tp-footer-cta::after {
  content: none;
}

.tp-footer-cta::before {
  content: none;
}

.tp-footer-cta > * {
  position: relative;
  z-index: 1;
}

.tp-footer-cta-copy {
  max-width: 60ch;
}

.tp-footer-kicker {
  margin: 0;
  font-size: 0.71rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #95bfff;
}

.tp-footer-cta h3 {
  margin: 0.25rem 0 0;
  font-size: 1.48rem;
  line-height: 1.14;
  color: #f3f7ff;
  letter-spacing: -0.018em;
}

.tp-footer-cta-meta {
  margin: 0.42rem 0 0;
  color: #a9bdd8;
  font-size: 0.82rem;
  line-height: 1.35;
}

.tp-footer-cta-actions {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
}

.tp-footer-cta .tp-footer-cta-main {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-height: 41px;
  min-width: 144px;
  padding: 0.52rem 0.92rem;
  border-radius: 0.5rem;
  border: 1px solid rgba(173, 205, 242, 0.48);
  background: linear-gradient(180deg, rgba(67, 124, 191, 0.88), rgba(45, 94, 152, 0.92));
  color: #e8f2ff;
  font-family: var(--tp-font-ui);
  font-size: 0.83rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-decoration: none;
  backdrop-filter: blur(6px) saturate(120%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.19), 0 5px 14px rgba(4, 16, 34, 0.2);
}

.tp-footer-cta .tp-footer-cta-main:hover {
  background: linear-gradient(180deg, rgba(77, 139, 210, 0.9), rgba(51, 105, 168, 0.94));
  border-color: rgba(191, 219, 254, 0.62);
  color: #f5f9ff;
  transform: translateY(-0.5px);
  text-decoration: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24), 0 6px 14px rgba(4, 18, 42, 0.22);
}

.tp-footer-cta .tp-footer-cta-main:focus-visible {
  outline: 0;
  text-decoration: none;
  box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.tp-whatsapp-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 34px;
  padding: 0.15rem 0;
  border: 0;
  background: transparent;
  color: #145f3a;
  text-decoration: none;
  font-family: var(--tp-font-ui);
  font-size: 0.84rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.tp-whatsapp-link::before {
  content: "";
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 999px;
  background: linear-gradient(145deg, #25b660, #1d944b);
  box-shadow: 0 0 0 3px rgba(37, 182, 96, 0.13);
}

.tp-whatsapp-link:hover {
  color: #0f4f2f;
  text-decoration: none;
}

.tp-whatsapp-link:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(37, 182, 96, 0.16);
  border-radius: 0.35rem;
}

.tp-footer-links-block {
  margin-top: 1rem;
}

.tp-footer-grid {
  margin-top: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem 1.1rem;
}

.tp-footer-col {
  min-width: 0;
}

.tp-footer-grid h4 {
  margin: 0 0 0.45rem;
  font-size: 0.98rem;
  color: #f1f6ff;
}

.tp-footer-grid p {
  margin: 0;
  font-size: 0.86rem;
  max-width: 36ch;
  color: #b8c6da;
}

.tp-footer-list,
.tp-footer-links {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.35rem;
}

.tp-footer-list li,
.tp-footer-links li {
  font-size: 0.84rem;
  color: #aab8cd;
}

.tp-footer-links a {
  color: #c8d4e6;
  text-decoration: none;
}

.tp-footer-link-label {
  color: #c8d4e6;
}

.tp-footer-links a:hover {
  color: #ffffff;
}

.tp-footer-payments {
  margin-top: 1rem;
  padding-top: 0.95rem;
  border-top: 1px solid #1f2d43;
}

.tp-pay-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.45rem 0.9rem;
}

.tp-footer-pay-title {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 700;
  color: #e3ecfb;
}

.tp-pay-sub {
  margin: 0;
  font-size: 0.73rem;
  color: #91a7c4;
}

.tp-payments-panel {
  margin-top: 0.58rem;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.tp-payments-row {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.28rem;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0.06rem 0.02rem 0.2rem;
  scrollbar-width: thin;
  scroll-snap-type: x proximity;
}

.tp-payments-row::-webkit-scrollbar {
  height: 6px;
}

.tp-payments-row::-webkit-scrollbar-thumb {
  background: #2b3f5e;
  border-radius: 999px;
}

.tp-payments-row::-webkit-scrollbar-track {
  background: #122035;
}

.tp-pay-method {
  flex: 0 0 auto;
  min-width: 56px;
  min-height: 32px;
  padding: 0.2rem 0.3rem;
  border-radius: 0.34rem;
  border: 0;
  background: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  box-shadow: none;
  scroll-snap-align: start;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.tp-pay-method:hover {
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(2, 6, 14, 0.18);
}

.tp-pay-logo {
  width: 38px;
  height: 14px;
  display: block;
  object-fit: contain;
  object-position: center;
}

.tp-pay-method.is-mp .tp-pay-logo {
  width: 44px;
  height: 16px;
  transform: scale(var(--tp-mp-logo-scale, 1.8));
  transform-origin: center;
}

.tp-pay-method.is-mastercard .tp-pay-logo {
  width: 28px;
}

.tp-pay-method.is-visa .tp-pay-logo {
  width: 34px;
}

.tp-pay-note {
  margin: 0.4rem 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 0.9rem;
}

.tp-pay-note span {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: #9db1cd;
  font-size: 0.7rem;
  font-weight: 600;
}

.tp-pay-note i {
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 999px;
  background: linear-gradient(145deg, #2563eb, #0ea5a4);
}

.tp-footer-bottom {
  margin-top: 1.1rem;
  padding-top: 0.85rem;
  border-top: 1px solid #1f2d43;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  font-size: 0.78rem;
  color: #9fb0c8;
}

.tp-footer-bottom div {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
}

.tp-footer-bottom a {
  color: #b8c8de;
  text-decoration: none;
}

.tp-footer-bottom .tp-footer-bottom-label {
  color: #b8c8de;
}

.tp-footer-bottom a:hover {
  color: #ffffff;
}

.tp-tool-link.is-static,
.tp-whatsapp-link.is-static,
.tp-section-cta-link.is-static,
.tp-footer-cta-main.is-static {
  cursor: default;
}

@media (min-width: 768px) {
  .site-main {
    padding-bottom: var(--tp-space-8);
  }

  .tp-home-trust--bar {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .tp-product-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tp-cat-link {
    width: clamp(118px, 11vw, 140px);
  }

  .tp-explore-grid--pro {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .tp-featured-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tp-campaign-layout {
    grid-template-columns: 1.1fr 0.9fr;
    align-items: stretch;
  }

  .tp-campaign-stack {
    grid-template-rows: 1fr 1fr;
  }

  .tp-campaign-hero,
  .tp-campaign-mini {
    min-height: 0;
  }

  .tp-how-grid--pro {
    position: relative;
    gap: var(--tp-space-4);
  }

  .tp-how-grid--pro::before {
    content: "";
    position: absolute;
    left: 16%;
    right: 16%;
    top: 3.1rem;
    border-top: 1px dashed #c5d5ea;
    z-index: 0;
  }

  .tp-how-grid--pro .tp-how-card {
    z-index: 1;
  }

  .tp-reviews-grid--compact .tp-review-card {
    flex-basis: clamp(300px, 36vw, 390px);
    min-width: clamp(300px, 36vw, 390px);
  }

  .tp-faq-layout {
    grid-template-columns: 0.34fr 0.66fr;
    align-items: start;
  }

  .tp-industry-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .tp-footer-cta {
    grid-template-columns: 1fr auto;
    align-items: center;
    padding: 1.15rem 1.25rem;
  }

  .tp-footer-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.25rem;
  }

  .tp-footer-bottom {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
}

@media (min-width: 1024px) {
  .tp-product-rail {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .tp-featured-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .tp-payments-row {
    justify-content: flex-start;
    overflow-x: visible;
    padding-right: 0;
  }
}

/* ===============================
   15) Mobile Optimization (VistaPrint-inspired)
   =============================== */
@media (max-width: 767px) {
  body {
    background: radial-gradient(circle at 12% -18%, rgba(37, 99, 235, 0.09), transparent 40%), var(--tp-color-bg);
  }

  .tp-announcement {
    font-size: 0.68rem;
    line-height: 1.25;
    padding: 0.35rem 0.75rem;
  }

  .tp-utility-bar {
    display: none;
  }

  .tp-site-header-pro {
    position: sticky;
    top: 0;
    z-index: 60;
    border-bottom: 1px solid #dce7f4;
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(8px);
  }

  .tp-site-header-pro .preview-shell {
    padding-top: 0.62rem;
    padding-bottom: 0.62rem;
  }

  .tp-header-main {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.5rem 0.48rem;
  }

  .tp-header-brand {
    min-width: 0;
    gap: 0.58rem;
    white-space: nowrap;
  }

  .tp-brand-logo {
    height: 50px;
    max-width: min(290px, 66vw);
  }

  .tp-brand-mark {
    width: 2.04rem;
    height: 2.04rem;
    font-size: 0.7rem;
  }

  .tp-brand-text strong,
  .tp-brand-text span {
    font-size: 1.16rem;
  }

  .tp-header-search {
    order: 3;
    grid-column: 1 / -1;
    min-height: 44px;
    padding: 0.35rem 0.45rem;
  }

  .tp-header-search .search-field {
    font-size: 0.9rem;
  }

  .tp-search-submit {
    width: 2.1rem;
    height: 2.1rem;
  }

  .tp-header-tools {
    order: 2;
    justify-content: flex-end;
    gap: 0.14rem;
    max-width: 100%;
    padding-bottom: 0;
    overflow-x: visible;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .tp-header-tools::-webkit-scrollbar {
    display: none;
  }

  .tp-tool-link {
    min-height: 2.04rem;
    padding: 0.1rem 0.26rem;
    border-radius: 0.46rem;
    font-size: 0.72rem;
  }

  .tp-tool-link svg {
    width: 1.12rem;
    height: 1.12rem;
  }

  .tp-tool-link span {
    font-size: 0.72rem;
  }

  .tp-tool-link.is-help span {
    display: inline-flex;
    align-items: center;
  }

  .tp-tool-link.is-help small {
    display: none;
  }

  .tp-whatsapp-button,
  .tp-whatsapp-button a {
    min-height: 34px;
    padding: 0.42rem 0.58rem;
    border-radius: 0.54rem;
    font-size: 0.68rem;
  }

  .tp-header-nav-wrap {
    border-top: 0;
    border-bottom: 1px solid #e3ebf6;
  }

  .tp-header-nav-wrap .preview-shell {
    padding-top: 0.24rem;
    padding-bottom: 0.3rem;
  }

  .tp-cat-menu {
    gap: 0.2rem;
    padding-bottom: 0.1rem;
    scroll-snap-type: x proximity;
  }

  .tp-cat-menu li {
    scroll-snap-align: start;
  }

  .tp-cat-menu a,
  .tp-cat-menu .tp-cat-menu-label {
    min-height: 32px;
    padding: 0.22rem 0.56rem;
    border: 1px solid transparent;
    border-radius: 0.56rem;
    font-size: 0.76rem;
  }

  .tp-cat-menu li.is-open > a,
  .tp-cat-menu li.is-open > .tp-cat-menu-label,
  .tp-cat-menu a:hover {
    border-color: #d9e5f4;
  }

  .tp-home-section {
    margin-top: 1.8rem;
  }

  .tp-home-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.55rem;
    margin-bottom: 0.95rem;
  }

  .tp-home-head h2 {
    font-size: clamp(1.42rem, 6vw, 1.78rem);
  }

  .tp-scroll-cue::before,
  .tp-scroll-cue::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 1.1rem;
    height: 1.1rem;
    margin-top: -0.55rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(157, 181, 208, 0.56);
    background: rgba(250, 253, 255, 0.76);
    color: #3d5e86;
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 3px 10px rgba(16, 34, 56, 0.12);
    backdrop-filter: blur(2px);
    pointer-events: none;
    opacity: 0;
    transform: scale(0.94);
    transition: opacity 0.18s ease, transform 0.18s ease;
    z-index: 5;
  }

  .tp-scroll-cue::before {
    content: "‹";
    left: 0.12rem;
  }

  .tp-scroll-cue::after {
    content: "›";
    right: 0.12rem;
  }

  .tp-scroll-cue.can-left::before,
  .tp-scroll-cue.can-right::after {
    opacity: 0.78;
    transform: scale(1);
  }

  .tp-scroll-cue--hero::before,
  .tp-scroll-cue--hero::after {
    display: none;
  }

  .tp-shop-chip-row {
    padding-bottom: 0.35rem;
    scroll-snap-type: x proximity;
  }

  .tp-shop-chip {
    scroll-snap-align: start;
  }

  .tp-cat-rail {
    gap: 0.66rem;
    margin: 0;
    padding: 0.2rem 0 0.7rem;
    scroll-padding-inline: 0;
  }

  .tp-cat-rail-wrap::before,
  .tp-cat-rail-wrap::after {
    bottom: 1.9rem;
    width: 1.95rem;
  }

  .tp-cat-rail-hint {
    right: 0.02rem;
    bottom: 0.02rem;
    font-size: 0.62rem;
    padding: 0.05rem 0.36rem;
  }

  .tp-cat-link {
    width: 98px;
  }

  .tp-cat-name {
    margin-top: 0.5rem;
    font-size: 0.84rem;
  }

  .tp-featured-grid {
    grid-auto-flow: column;
    grid-auto-columns: minmax(88%, 1fr);
    overflow-x: auto;
    gap: 0.58rem;
    padding-bottom: 0.35rem;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .tp-featured-grid::-webkit-scrollbar {
    display: none;
  }

  .tp-featured-card {
    display: grid;
    grid-template-columns: 108px minmax(0, 1fr);
    align-items: stretch;
    min-height: 178px;
    border-radius: 0.92rem;
    scroll-snap-align: start;
  }

  .tp-featured-media {
    aspect-ratio: auto;
    min-height: 100%;
    border-right: 1px solid #dee8f5;
    background: #eef4fd;
  }

  .tp-featured-media img {
    object-fit: contain;
    object-position: center center;
    padding: 0.56rem;
    background: #f3f7fd;
  }

  .tp-featured-body {
    min-width: 0;
    padding: 0.72rem 0.74rem;
  }

  .tp-featured-body .tp-badge-row {
    gap: 0.28rem;
    margin-bottom: 0.42rem;
  }

  .tp-featured-body h3 {
    margin: 0 0 0.3rem;
    font-size: 0.96rem;
    line-height: 1.2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }

  .tp-featured-body p {
    min-height: 0;
    margin-bottom: 0.44rem;
    line-height: 1.34;
    font-size: 0.82rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }

  .tp-featured-link {
    margin-top: auto;
    min-height: 0;
    padding: 0.08rem 0;
    font-size: 0.8rem;
  }

  .tp-campaign-layout {
    gap: 0.75rem;
  }

  .tp-campaign-hero {
    min-height: 176px;
  }

  .tp-campaign-mini {
    min-height: 110px;
  }

  .tp-how-grid--pro .tp-how-card {
    padding: 0.9rem;
  }

  .tp-how-visual {
    width: 72px;
    height: 72px;
  }

  .tp-how-visual svg {
    width: 62px;
    height: 62px;
  }

  .tp-how-grid--pro .tp-how-card p {
    min-height: 0;
  }

  .tp-proof-layout {
    gap: 0.75rem;
  }

  .tp-reviews-grid--compact .tp-review-card {
    flex-basis: clamp(246px, 86vw, 312px);
    min-width: clamp(246px, 86vw, 312px);
    scroll-snap-align: start;
  }

  .tp-review-card {
    padding: 0.95rem;
  }

  .tp-review-top {
    align-items: flex-start;
  }

  .tp-review-top > div {
    min-width: 0;
  }

  .tp-industry-wrap {
    padding: 0.8rem;
  }

  .tp-industry-grid {
    grid-template-columns: 1fr;
    gap: 0.45rem;
  }

  .tp-faq-layout {
    gap: 0.75rem;
  }

  .tp-faq summary {
    padding: 0.9rem 2.1rem 0.9rem 0.9rem;
  }

  .tp-faq p {
    padding: 0 0.9rem 0.9rem;
  }

  .tp-section-cta {
    margin-top: 0.95rem;
  }

  .tp-section-cta-link {
    width: 100%;
    max-width: 340px;
    min-height: 44px;
  }

  .tp-footer {
    margin-top: 2rem;
  }

  .tp-footer .preview-shell {
    padding-top: 1.2rem;
    padding-bottom: calc(1rem + env(safe-area-inset-bottom));
  }

  .tp-footer-cta h3 {
    font-size: 1.16rem;
  }

  .tp-footer-cta-meta {
    font-size: 0.78rem;
  }

  .tp-footer-cta-actions > a,
  .tp-footer-cta-actions > button {
    flex: 0 0 auto;
  }

  .tp-footer-cta-actions {
    flex-wrap: nowrap;
    justify-content: flex-start;
  }

  .tp-footer-grid {
    grid-template-columns: 1fr;
    gap: 0.9rem;
  }

  .tp-payments-row {
    padding-bottom: 0.35rem;
    scroll-snap-type: x mandatory;
  }

  .tp-pay-method {
    min-width: 54px;
    min-height: 31px;
  }

  .tp-pay-logo {
    width: 34px;
    height: 13px;
  }
}

@media (max-width: 480px) {
  .tp-header-main {
    gap: 0.42rem;
  }

  .tp-brand-mark {
    width: 1.96rem;
    height: 1.96rem;
    font-size: 0.68rem;
  }

  .tp-brand-logo {
    height: 44px;
    max-width: min(230px, 74vw);
  }

  .tp-brand-text strong,
  .tp-brand-text span {
    font-size: 1.12rem;
  }

  .tp-header-tools {
    gap: 0.1rem;
  }

  .tp-header-tools .tp-tool-link span {
    display: none;
  }

  .tp-tool-link {
    width: 2.35rem;
    min-height: 2.18rem;
    justify-content: center;
    padding: 0;
  }

  .tp-tool-link svg {
    width: 1.22rem;
    height: 1.22rem;
  }

  .tp-tool-link svg * {
    stroke-width: 1.95;
  }

  .tp-tool-link.is-cart {
    position: relative;
  }

  .tp-tool-link.is-favorites {
    position: relative;
  }

  .tp-tool-link.is-cart .tp-tool-count {
    position: absolute;
    top: -0.25rem;
    right: -0.25rem;
    margin-left: 0;
  }

  .tp-tool-link.is-favorites .tp-tool-count {
    position: absolute;
    top: -0.25rem;
    right: -0.25rem;
    margin-left: 0;
  }

  .tp-whatsapp-button,
  .tp-whatsapp-button a {
    padding: 0.4rem 0.5rem;
    min-width: 2.9rem;
  }

  .tp-home-cta-row {
    grid-template-columns: 1fr;
  }

  .tp-featured-grid {
    grid-auto-columns: minmax(92%, 1fr);
  }

  .tp-featured-card {
    grid-template-columns: 96px minmax(0, 1fr);
    min-height: 168px;
  }

  .tp-featured-body {
    padding: 0.64rem 0.66rem;
  }

  .tp-featured-body h3 {
    font-size: 0.92rem;
  }

  .tp-featured-body p {
    font-size: 0.79rem;
  }
}

@media (max-width: 390px) {
  .tp-tool-link.is-help {
    display: none;
  }
}

/* ===============================
   16) Internal Pages (VistaPrint-inspired system)
   =============================== */
body.tp-internal-page-template .ast-normal-title-enabled .entry-header,
body.tp-internal-page-template .entry-header.ast-no-thumbnail {
  display: none !important;
}

body.tp-internal-page-template #content.site-content,
body.tp-internal-page-template #content .ast-container,
body.tp-internal-page-template #primary.content-area,
body.tp-internal-page-template .site-main,
body.tp-internal-page-template .entry-content {
  width: 100%;
  max-width: 100%;
  margin: 0 !important;
}

body.tp-internal-page-template #secondary,
body.tp-internal-page-template .widget-area,
body.tp-internal-page-template .ast-sidebar-main {
  display: none !important;
}

body.tp-internal-page-template #page,
body.tp-internal-page-template .site,
body.tp-internal-page-template #content.site-content,
body.tp-internal-page-template #content .ast-container,
body.tp-internal-page-template #primary.content-area,
body.tp-internal-page-template #main.site-main,
body.tp-internal-page-template article.page,
body.tp-internal-page-template .entry-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.tp-internal-page-template #content .ast-container {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body.tp-internal-page-template .site-main {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.tp-internal-page-template .site-content {
  overflow: visible;
}

body.tp-internal-page-template .entry-content > .tp-announcement {
  margin-top: 0 !important;
}

body.tp-internal-page-template .ast-article-single,
body.tp-internal-page-template article.page {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.tp-internal-page-template.tp-internal-page-hide-theme-header #masthead,
body.tp-internal-page-template.tp-internal-page-hide-theme-header #ast-desktop-header,
body.tp-internal-page-template.tp-internal-page-hide-theme-header #ast-mobile-header,
body.tp-internal-page-template.tp-internal-page-hide-theme-header .ast-above-header-wrap,
body.tp-internal-page-template.tp-internal-page-hide-theme-header .ast-below-header-wrap {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.tp-internal-page-template.tp-internal-page-hide-theme-footer #colophon {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.tp-internal-page-template #page,
body.tp-internal-page-template .site,
body.tp-internal-page-template #content,
body.tp-internal-page-template #main {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

body.tp-internal-page-template .tp-footer {
  margin-bottom: 0 !important;
}

body.tp-internal-page-template .tp-footer .preview-shell {
  padding-bottom: max(1rem, env(safe-area-inset-bottom));
}

.tp-subpage-main {
  position: relative;
  padding-bottom: var(--tp-space-10);
}

.tp-subpage-main::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 340px;
  pointer-events: none;
  background: radial-gradient(65% 120% at 12% 0%, rgba(37, 99, 235, 0.1), transparent 70%),
    radial-gradient(42% 100% at 100% 0%, rgba(14, 165, 164, 0.1), transparent 72%);
}

.tp-subpage-main > .tp-home-section {
  position: relative;
  z-index: 1;
}

.tp-subpage-hero {
  margin-top: clamp(1rem, 2.1vw, 1.5rem);
}

body.tp-internal-page-template .tp-subpage-main > .tp-home-section:first-child,
body.tp-internal-page-template .tp-subpage-main > .tp-subpage-hero:first-child {
  margin-top: 0 !important;
}

body.tp-internal-page-template .tp-subpage-main > .tp-subpage-hero {
  margin-top: 0.45rem;
}

.tp-subpage-hero-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1rem, 2.2vw, 1.45rem);
  background: linear-gradient(156deg, #f8fbff, #edf4ff);
  border: 1px solid #cfdef1;
  border-radius: 1.15rem;
  padding: clamp(1rem, 2.5vw, 1.85rem);
  box-shadow: 0 12px 28px rgba(14, 36, 63, 0.08);
}

.tp-subpage-hero-grid > div {
  max-width: 76ch;
}

.tp-subpage-hero h1 {
  margin: 0 0 var(--tp-space-3);
  max-width: 19ch;
  font-size: clamp(1.75rem, 4.2vw, 2.45rem);
  line-height: 1.1;
  color: var(--tp-color-ink);
  letter-spacing: -0.026em;
}

.tp-subpage-lead {
  margin: 0;
  color: #3a5b7f;
  font-size: clamp(0.96rem, 2.2vw, 1.06rem);
  line-height: 1.62;
  max-width: 70ch;
}

.tp-subpage-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: var(--tp-space-4);
}

.tp-subpage-hero-side {
  display: grid;
  gap: var(--tp-space-3);
  align-content: start;
}

.tp-subpage-hero-media {
  margin: 0;
  border-radius: 0.9rem;
  border: 1px solid #cddcf0;
  background: #f7fbff;
  overflow: hidden;
  box-shadow: 0 8px 18px rgba(17, 44, 76, 0.08);
}

.tp-subpage-hero-media img {
  display: block;
  width: 100%;
  height: auto;
}

.tp-subpage-chip-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.48rem;
}

.tp-subpage-chip-list li {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  width: fit-content;
  padding: 0.2rem 0.72rem;
  border-radius: 999px;
  border: 1px solid #cddcf0;
  background: rgba(255, 255, 255, 0.95);
  color: #244766;
  font-size: 0.79rem;
  font-weight: 700;
}

.tp-subpage-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--tp-space-3);
}

.tp-subpage-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.62rem;
  border-radius: 1rem;
  border-color: #d6e3f3;
  box-shadow: 0 10px 24px rgba(17, 44, 76, 0.055);
}

.tp-subpage-card h3 {
  margin: 0;
  font-size: clamp(1rem, 2.5vw, 1.18rem);
  line-height: 1.24;
  color: var(--tp-color-ink);
}

.tp-subpage-card p {
  margin: 0;
  color: var(--tp-color-text-soft);
  line-height: 1.58;
}

.tp-subpage-card .button,
.tp-subpage-card .tp-btn-secondary {
  margin-top: auto;
  width: fit-content;
}

.tp-subpage-post .tp-subpage-meta {
  margin: 0;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #5a7697;
}

.tp-subpage-post .tp-subpage-post-tax {
  display: inline-flex;
  margin-left: 0.42rem;
  padding: 0.12rem 0.5rem;
  border-radius: 999px;
  border: 1px solid #d2e1f2;
  background: #f7fbff;
  color: #3d6388;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
}

.tp-subpage-blog-head {
  margin-bottom: 0.8rem;
}

.tp-subpage-blog-lead {
  max-width: 82ch;
}

.tp-subpage-blog-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.6rem;
  margin-bottom: var(--tp-space-4);
}

.tp-subpage-blog-search input[type="search"] {
  width: 100%;
  min-height: 44px;
  padding: 0.6rem 0.82rem;
  border-radius: 0.78rem;
  border: 1px solid #c7d9ee;
  background: #ffffff;
  color: #213b59;
  font-size: 0.95rem;
}

.tp-subpage-blog-search input[type="search"]:focus {
  outline: 0;
  border-color: #8eb1de;
  box-shadow: 0 0 0 3px rgba(46, 99, 255, 0.14);
}

.tp-subpage-blog-search .button,
.tp-subpage-blog-search button.button,
.tp-subpage-blog-search input[type="submit"] {
  min-width: 112px;
  min-height: 44px;
  padding: 0.62rem 1rem;
  border-radius: 0.78rem;
  border: 1px solid #1f4ec2 !important;
  background: linear-gradient(180deg, #2f66e8, #2458d5) !important;
  color: #ffffff !important;
  font-size: 0.9rem;
  font-weight: 700;
  white-space: nowrap;
  opacity: 1 !important;
  box-shadow: 0 8px 16px rgba(37, 99, 235, 0.23) !important;
  text-indent: 0 !important;
  background-color: #2458d5 !important;
  background-image: linear-gradient(180deg, #2f66e8, #2458d5) !important;
}

.tp-subpage-blog-search button.button,
.tp-subpage-blog-search .button,
.tp-subpage-blog-search input[type="submit"] {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff;
  text-indent: 0 !important;
  font-size: 0.92rem !important;
  line-height: 1 !important;
}

.tp-subpage-blog-search button.button span {
  display: inline-block !important;
  color: inherit;
  opacity: 1 !important;
  visibility: visible !important;
  font-size: inherit !important;
  line-height: 1 !important;
}

#tp-blog-results .tp-subpage-blog-search button.button,
#tp-blog-results .tp-subpage-blog-search .button,
#tp-blog-results .tp-subpage-blog-search input[type="submit"] {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.tp-subpage-blog-search .button:hover,
.tp-subpage-blog-search button.button:hover,
.tp-subpage-blog-search input[type="submit"]:hover {
  background: linear-gradient(180deg, #2b5fdc, #1f4ec2);
}

#tp-blog-results {
  scroll-margin-top: 110px;
}

.tp-subpage-blog-search-meta {
  margin: -0.25rem 0 var(--tp-space-4);
  color: #486789;
  font-size: 0.9rem;
}

.tp-subpage-blog-search-meta a {
  margin-left: 0.5rem;
  font-weight: 700;
  text-decoration: none;
}

.tp-subpage-blog-topics .tp-subpage-topic-card h3 {
  margin-bottom: 0.2rem;
}

.tp-subpage-topic-card .tp-subpage-actions {
  margin-top: 0.32rem;
}

.tp-subpage-topic-card .tp-subpage-actions .button {
  min-height: 38px;
  font-size: 0.78rem;
  padding: 0.48rem 0.75rem;
}

.tp-subpage-richtext .tp-card {
  padding: clamp(1rem, 2.4vw, 1.5rem);
  border-color: #d3e1f1;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
}

.tp-subpage-richtext h2,
.tp-subpage-richtext h3,
.tp-subpage-richtext h4 {
  color: var(--tp-color-ink);
}

.tp-subpage-richtext p,
.tp-subpage-richtext li {
  color: #3b5879;
  line-height: 1.7;
}

.tp-subpage-seo .tp-home-head {
  margin-bottom: var(--tp-space-3);
}

.tp-subpage-seo-lead {
  margin: 0;
  max-width: 76ch;
  color: #365779;
  line-height: 1.66;
}

.tp-subpage-seo-grid {
  gap: var(--tp-space-4);
}

.tp-subpage-seo-card {
  border: 1px solid #d2e1f3;
  background: linear-gradient(172deg, #ffffff, #f2f8ff);
  box-shadow: 0 11px 24px rgba(17, 44, 76, 0.06);
}

.tp-subpage-seo-card-media {
  margin: -0.2rem -0.2rem 0.22rem;
  border-radius: 0.82rem;
  border: 1px solid #d8e5f4;
  background: #ffffff;
  overflow: hidden;
}

.tp-subpage-seo-card-media img {
  display: block;
  width: 100%;
  height: auto;
}

.tp-subpage-seo-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.46rem;
}

.tp-subpage-seo-list li {
  position: relative;
  padding-left: 0.92rem;
  color: #38597b;
  line-height: 1.58;
}

.tp-subpage-seo-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.57em;
  width: 0.36rem;
  height: 0.36rem;
  border-radius: 999px;
  background: #2e63ff;
  box-shadow: 0 0 0 3px rgba(46, 99, 255, 0.14);
}

@media (min-width: 768px) {
  .tp-subpage-grid--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tp-subpage-grid--three {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tp-subpage-topic-card .tp-subpage-actions .button {
    width: fit-content;
  }
}

@media (min-width: 1024px) {
  .tp-subpage-hero-grid {
    grid-template-columns: minmax(0, 1.95fr) minmax(300px, 1fr);
    align-items: center;
  }

  .tp-subpage-hero-grid.is-single {
    grid-template-columns: 1fr;
  }

  .tp-subpage-chip-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-self: stretch;
  }

  .tp-subpage-chip-list li {
    width: 100%;
    justify-content: center;
  }

  .tp-subpage-grid--three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .tp-subpage-blog-search {
    grid-template-columns: 1fr;
  }

  .tp-subpage-blog-search .button {
    width: 100%;
  }
}

/* ===============================
   17) Commerce Flow (Product/Cart/Checkout/Account)
   =============================== */
[data-tp-commerce-header="1"],
[data-tp-commerce-footer="1"] {
  width: 100%;
  min-width: 100%;
  display: block !important;
  clear: both;
  flex: 1 0 100%;
}

[data-tp-commerce-header="1"] > .tp-announcement,
[data-tp-commerce-header="1"] > .tp-utility-bar,
[data-tp-commerce-header="1"] > .tp-site-header-pro,
[data-tp-commerce-footer="1"] > .tp-footer {
  width: 100%;
  max-width: 100%;
  display: block;
  clear: both;
  float: none;
}

[data-tp-commerce-header="1"] .tp-utility-inner {
  width: 100%;
  justify-content: center;
}

body.tp-commerce-template .ast-normal-title-enabled .entry-header,
body.tp-commerce-template .entry-header.ast-no-thumbnail {
  display: none !important;
}

body.tp-commerce-template #content.site-content,
body.tp-commerce-template #content .ast-container,
body.tp-commerce-template #primary.content-area,
body.tp-commerce-template .site-main,
body.tp-commerce-template .entry-content {
  width: 100%;
  max-width: 100%;
  margin: 0 !important;
}

body.tp-commerce-template #page,
body.tp-commerce-template .site,
body.tp-commerce-template #content.site-content,
body.tp-commerce-template #content .ast-container,
body.tp-commerce-template #primary.content-area,
body.tp-commerce-template #main.site-main,
body.tp-commerce-template article.page,
body.tp-commerce-template .entry-content {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.tp-commerce-template #content .ast-container {
  display: block !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body.tp-commerce-template .tp-commerce-header-stack,
body.tp-commerce-template .tp-commerce-main,
body.tp-commerce-template .tp-commerce-footer-stack,
body.tp-commerce-template #primary.content-area,
body.tp-commerce-template #main.site-main,
body.tp-commerce-template .ast-woocommerce-container {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

body.tp-commerce-template .site-main {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.tp-commerce-template .site-content {
  overflow: visible;
}

body.tp-commerce-template .entry-content > .tp-announcement {
  margin-top: 0 !important;
}

body.tp-commerce-template .ast-article-single,
body.tp-commerce-template article.page {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.tp-commerce-template.tp-commerce-hide-theme-header #masthead,
body.tp-commerce-template.tp-commerce-hide-theme-header #ast-desktop-header,
body.tp-commerce-template.tp-commerce-hide-theme-header #ast-mobile-header,
body.tp-commerce-template.tp-commerce-hide-theme-header .ast-above-header-wrap,
body.tp-commerce-template.tp-commerce-hide-theme-header .ast-below-header-wrap {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.tp-commerce-template.tp-commerce-hide-theme-footer #colophon {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

/* Blog single can reuse pro header/footer without inheriting full Woo layout rules. */
body.tp-blog-pro-template.tp-commerce-hide-theme-header #masthead,
body.tp-blog-pro-template.tp-commerce-hide-theme-header #ast-desktop-header,
body.tp-blog-pro-template.tp-commerce-hide-theme-header #ast-mobile-header,
body.tp-blog-pro-template.tp-commerce-hide-theme-header .ast-above-header-wrap,
body.tp-blog-pro-template.tp-commerce-hide-theme-header .ast-below-header-wrap {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.tp-blog-pro-template.tp-commerce-hide-theme-footer #colophon {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.tp-commerce-template #page,
body.tp-commerce-template .site,
body.tp-commerce-template #content,
body.tp-commerce-template #main {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Wider shell for commerce pages so PLP doesn't look clipped on the right. */
body.tp-commerce-template {
  --tp-shell-max: 1580px;
  --tp-shell-gutter: clamp(0.75rem, 1.15vw, 1rem);
  --tp-product-max: 1360px;
}

@media (max-width: 1400px) {
  body.tp-commerce-template {
    --tp-shell-max: 1360px;
    --tp-product-max: 1240px;
  }
}

@media (max-width: 1024px) {
  body.tp-commerce-template {
    --tp-shell-max: 1200px;
    --tp-shell-gutter: clamp(0.55rem, 1.3vw, 0.85rem);
  }
}

body.tp-commerce-template .tp-footer {
  margin-bottom: 0 !important;
}

body.tp-commerce-template .tp-footer .preview-shell {
  padding-bottom: max(1rem, env(safe-area-inset-bottom));
}

.tp-commerce-main {
  padding-bottom: var(--tp-space-8);
}

.tp-commerce-main::after {
  content: "";
  display: block;
  clear: both;
}

.tp-commerce-main .woocommerce {
  width: min(var(--tp-shell-max), calc(100% - (var(--tp-shell-gutter) * 2)));
  margin-left: auto;
  margin-right: auto;
}

.tp-commerce-main .woocommerce-breadcrumb {
  width: min(var(--tp-shell-max), calc(100% - (var(--tp-shell-gutter) * 2)));
  margin-left: auto;
  margin-right: auto;
  margin-top: var(--tp-space-5);
  margin-bottom: var(--tp-space-4);
  color: #5f7795;
  font-size: 0.8rem;
  overflow-wrap: anywhere;
}

/* Limit only single-product content width, keeping header/footer full width. */
body.tp-commerce-template.single-product .tp-commerce-main .woocommerce,
body.tp-commerce-template.single-product .tp-commerce-main .woocommerce-breadcrumb {
  width: min(var(--tp-product-max), calc(100% - (var(--tp-shell-gutter) * 2)));
}

.tp-commerce-main .woocommerce-breadcrumb a {
  color: #466687;
}

.tp-commerce-main .woocommerce-notices-wrapper,
.tp-commerce-main .woocommerce-message,
.tp-commerce-main .woocommerce-error,
.tp-commerce-main .woocommerce-info {
  border-radius: 0.82rem;
}

.tp-commerce-main .woocommerce-error,
.tp-commerce-main .woocommerce-info,
.tp-commerce-main .woocommerce-message {
  margin-bottom: var(--tp-space-4);
}

.tp-commerce-main .quantity .qty {
  min-height: 42px;
  border: 1px solid #c9d9ee;
  border-radius: 0.65rem;
}

.tp-commerce-main .input-text,
.tp-commerce-main select,
.tp-commerce-main textarea {
  min-height: 44px;
  border: 1px solid #c9d9ee;
  border-radius: 0.68rem;
  background: #ffffff;
}

.tp-commerce-main .input-text:focus,
.tp-commerce-main select:focus,
.tp-commerce-main textarea:focus {
  border-color: #8ab3e9;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
  outline: 0;
}

.tp-commerce-main .woocommerce div.product {
  padding: clamp(0.85rem, 2.2vw, 1.3rem);
  margin-top: var(--tp-space-5);
}

.tp-commerce-main .woocommerce div.product div.images,
.tp-commerce-main .woocommerce div.product div.summary {
  float: none !important;
  width: 100% !important;
}

.tp-commerce-main .woocommerce div.product .product_title {
  margin-top: 0;
  margin-bottom: var(--tp-space-3);
  font-size: clamp(1.4rem, 3.8vw, 2rem);
  line-height: 1.12;
  overflow-wrap: anywhere;
}

.tp-commerce-main .woocommerce div.product p.price,
.tp-commerce-main .woocommerce div.product span.price {
  color: var(--tp-color-primary);
  font-weight: 800;
  font-size: clamp(1.2rem, 2.6vw, 1.5rem);
}

.tp-commerce-main .woocommerce-product-details__short-description {
  color: #3d5978;
  line-height: 1.66;
  overflow-wrap: anywhere;
}

.tp-commerce-main .woocommerce div.product form.cart {
  margin-top: var(--tp-space-4);
  margin-bottom: var(--tp-space-4);
  display: flex;
  flex-wrap: wrap;
  gap: 0.62rem;
  align-items: center;
}

.tp-commerce-main .woocommerce div.product .product_meta {
  border-top: 1px solid #d9e6f5;
  padding-top: var(--tp-space-3);
  font-size: 0.84rem;
  color: #5d7593;
  overflow-wrap: anywhere;
}

.tp-commerce-main .woocommerce-tabs {
  margin-top: var(--tp-space-5);
}

.tp-commerce-main .woocommerce-tabs ul.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: 0 0 0.85rem !important;
  padding: 0 !important;
  border: 0 !important;
}

.tp-commerce-main .woocommerce-tabs ul.tabs::before {
  display: none !important;
  border: 0 !important;
}

.tp-commerce-main .woocommerce-tabs ul.tabs li::before,
.tp-commerce-main .woocommerce-tabs ul.tabs li::after {
  display: none !important;
  content: none !important;
}

.tp-commerce-main .woocommerce-tabs ul.tabs li {
  border: 1px solid #c9d9ee !important;
  border-radius: 999px !important;
  background: #f9fbff !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
}

.tp-commerce-main .woocommerce-tabs ul.tabs li.active {
  border-color: #9eb9dd !important;
  background: #ffffff !important;
  box-shadow: 0 1px 2px rgba(19, 45, 77, 0.06);
}

.tp-commerce-main .woocommerce-tabs ul.tabs li a {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0.56rem 1rem !important;
  font-size: 0.95rem !important;
  line-height: 1.2;
  font-weight: 700 !important;
  color: #3a5b7f !important;
  white-space: normal;
  text-decoration: none !important;
}

.tp-commerce-main .shop_table {
  border-radius: 0.85rem;
  overflow: hidden;
  border: 1px solid #d8e4f3;
}

.tp-commerce-main .shop_table th {
  background: #f3f8ff;
  color: #2a4e74;
  font-weight: 700;
}

.tp-commerce-main .shop_table td {
  border-top: 1px solid #e2ebf7;
}

.tp-commerce-main .cart_totals,
.tp-commerce-main .woocommerce-checkout-review-order,
.tp-commerce-main .woocommerce-checkout #customer_details,
.tp-commerce-main .woocommerce-account .woocommerce-MyAccount-navigation,
.tp-commerce-main .woocommerce-account .woocommerce-MyAccount-content {
  padding: clamp(0.8rem, 2vw, 1.2rem);
}

.tp-commerce-main .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.tp-commerce-main #place_order {
  width: 100%;
  min-height: 46px;
}

.tp-commerce-main .woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.42rem;
}

.tp-commerce-main .woocommerce-account .woocommerce-MyAccount-navigation a {
  display: block;
  padding: 0.44rem 0.62rem;
  border: 1px solid #d4e2f4;
  border-radius: 0.58rem;
  color: #2d5278;
  text-decoration: none;
  font-weight: 600;
}

.tp-commerce-main .woocommerce-account .woocommerce-MyAccount-navigation .is-active a,
.tp-commerce-main .woocommerce-account .woocommerce-MyAccount-navigation a:hover {
  color: #1d4ed8;
  border-color: #aac5e8;
  background: #f4f9ff;
}

.tp-commerce-main .woocommerce-Address-title h3 {
  margin-bottom: var(--tp-space-2);
}

@media (min-width: 768px) {
  .tp-commerce-main .woocommerce-checkout #customer_details {
    margin-bottom: var(--tp-space-4);
  }

  .tp-commerce-main .woocommerce-account .woocommerce {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: var(--tp-space-4);
    align-items: start;
  }
}

@media (max-width: 767.98px) {
  .tp-commerce-main .woocommerce {
    width: calc(100% - 1.5rem);
    margin-left: auto;
    margin-right: auto;
  }

  .tp-commerce-main .woocommerce-breadcrumb {
    width: calc(100% - 1.5rem);
    margin-left: auto;
    margin-right: auto;
    margin-top: 1rem;
    margin-bottom: 0.85rem;
    padding-left: 0.15rem;
    padding-right: 0.15rem;
    font-size: 0.9rem;
    line-height: 1.45;
  }

  .tp-commerce-main .woocommerce div.product {
    padding: 0.3rem 0.15rem 0.9rem;
    margin-top: 0.2rem;
  }

  .tp-commerce-main .woocommerce div.product .summary,
  .tp-commerce-main .woocommerce div.product .images,
  .tp-commerce-main .woocommerce div.product .woocommerce-tabs,
  .tp-commerce-main .woocommerce div.product .related,
  .tp-commerce-main .woocommerce div.product .upsells {
    padding-left: 0.15rem;
    padding-right: 0.15rem;
  }

  .tp-commerce-main .woocommerce div.product .product_title {
    margin-bottom: 0.75rem;
    font-size: 2.1rem;
  }

  .tp-commerce-main .woocommerce div.product p.price,
  .tp-commerce-main .woocommerce div.product span.price {
    font-size: 1.45rem;
  }

  .tp-commerce-main .woocommerce-product-details__short-description,
  .tp-commerce-main .woocommerce div.product .product_meta {
    font-size: 0.98rem;
    line-height: 1.6;
  }

  .tp-commerce-main .woocommerce-tabs ul.tabs {
    gap: 0.48rem;
  }

  .tp-commerce-main .woocommerce-tabs ul.tabs li {
    max-width: 100%;
  }

  .tp-commerce-main .woocommerce-tabs ul.tabs li a {
    display: inline-flex;
    min-height: 38px;
    padding: 0.48rem 0.82rem !important;
    font-size: 0.88rem !important;
    line-height: 1.2;
  }
}

@media (min-width: 1024px) {
  .tp-commerce-main .woocommerce div.product {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--tp-space-5);
    align-items: start;
  }

  .tp-commerce-main .woocommerce div.product .woocommerce-tabs,
  .tp-commerce-main .woocommerce div.product .related,
  .tp-commerce-main .woocommerce div.product .upsells {
    grid-column: 1 / -1;
  }

  .tp-commerce-main .woocommerce div.product div.images {
    position: sticky;
    top: 96px;
  }

  .tp-commerce-main .woocommerce-checkout .col2-set {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--tp-space-4);
  }
}

/* ===============================
   18) Home Shell + Hero V11 (clean isolated source)
   =============================== */
body:is(.home, .front-page) {
  --tp-shell-max: 1620px !important;
  --tp-shell-gutter: clamp(0.65rem, 1.05vw, 0.95rem);
}

@media (max-width: 1400px) {
  body:is(.home, .front-page) {
    --tp-shell-max: 1380px !important;
  }
}

@media (max-width: 1024px) {
  body:is(.home, .front-page) {
    --tp-shell-max: 1200px !important;
    --tp-shell-gutter: clamp(0.55rem, 1.3vw, 0.85rem);
  }
}

body:is(.home, .front-page) .tp-home-hero-v11 {
  width: min(var(--tp-shell-max), calc(100% - (var(--tp-shell-gutter) * 2)));
  margin: clamp(0.9rem, 1.7vw, 1.25rem) auto 0;
  position: relative;
  overflow: hidden;
  border-radius: 1.25rem;
  border: 1px solid #d3deec;
  background: linear-gradient(135deg, #eef5ff 0%, #ffffff 40%, #f5f8fc 100%);
  box-shadow: 0 16px 30px rgba(15, 35, 63, 0.08);
}

body:is(.home, .front-page) .tp-home-hero-v11::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
  background: linear-gradient(90deg, #2f6ef4 0%, #12b0c9 62%, #e8ce35 100%);
  z-index: 3;
  pointer-events: none;
}

body:is(.home, .front-page) .tp-home-hero-v11::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(148, 163, 184, 0.34) 0.6px, transparent 0.6px);
  background-size: 24px 24px;
  opacity: 0.14;
  pointer-events: none;
  z-index: 0;
  mask-image: radial-gradient(ellipse 64% 82% at 22% 52%, #000 0%, transparent 61%);
  -webkit-mask-image: radial-gradient(ellipse 64% 82% at 22% 52%, #000 0%, transparent 61%);
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 0.96fr) minmax(0, 1.04fr);
  min-height: clamp(340px, 28vw, 400px);
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-copy {
  padding: clamp(1.75rem, 2.2vw, 2.6rem) clamp(1rem, 1.35vw, 1.45rem) clamp(1.75rem, 2.2vw, 2.6rem)
    clamp(1.6rem, 2vw, 2.4rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-kicker {
  margin: 0 0 1rem;
  display: inline-flex;
  align-items: center;
  gap: 0.48rem;
  width: fit-content;
  padding: 0.38rem 1rem 0.38rem 0.48rem;
  border: 1px solid #cfd9e8;
  border-radius: 999px;
  background: #ffffff;
  color: #344963;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1;
  box-shadow: 0 1px 2px rgba(12, 29, 53, 0.06);
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-kicker-icon {
  width: 1.06rem;
  height: 1.06rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #2f6ef4;
  color: #ffffff;
  font-size: 0.58rem;
  font-weight: 700;
  line-height: 1;
  flex-shrink: 0;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-kicker-text {
  display: inline-flex;
  align-items: center;
  line-height: 1.08;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-title {
  margin: 0 0 0.74rem;
  font-size: clamp(1.75rem, 2.5vw, 2.32rem);
  line-height: 1.1;
  letter-spacing: -0.028em;
  color: #1f2937;
  max-width: none;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-title .tp-hero-title-emphasis {
  color: #2a5fe8;
  font-family: "Times New Roman", Georgia, serif;
  font-style: italic;
  font-weight: 500;
  text-decoration: none !important;
  text-decoration-line: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-desc {
  margin: 0;
  margin-inline-start: 0.55rem;
  max-width: 58ch;
  font-size: 0.88rem;
  line-height: 1.6;
  color: #4b5d75;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-cta-row {
  margin-top: 0.95rem;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-btn,
body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-btn.is-static {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  min-width: 0;
  padding: 0.66rem 1.48rem;
  border-radius: 0.72rem;
  border: 1px solid rgba(28, 78, 184, 0.72);
  background: linear-gradient(140deg, #2563eb 0%, #2c6be6 45%, #0ea5a4 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28), inset 0 -1px 0 rgba(8, 27, 56, 0.22),
    0 8px 18px rgba(19, 57, 130, 0.24);
  color: #ffffff;
  text-decoration: none;
  font-size: 1.03rem;
  font-weight: 700;
  letter-spacing: 0;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-btn.is-static {
  cursor: default;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-steps {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.24rem;
  margin-top: 0.88rem;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-step {
  display: inline-flex;
  align-items: center;
  gap: 0.36rem;
  padding: 0.28rem 0.62rem 0.28rem 0.4rem;
  border: 1px solid #d5deec;
  border-radius: 999px;
  background: #ffffff;
  color: #6b7c96;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-step-num {
  width: 0.98rem;
  height: 0.98rem;
  border-radius: 0.25rem;
  background: #eef4ff;
  border: 1px solid #d4e2ff;
  color: #2a5ce6;
  font-size: 0.6rem;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-step-sep {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #c1cedf;
  font-size: 0.74rem;
  font-weight: 700;
  line-height: 1;
  margin: 0 0.05rem;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-media {
  padding: 0.75rem 0.75rem 0.75rem 0.25rem;
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.56rem;
  align-items: start;
  align-content: center;
  justify-items: stretch;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-media.is-count-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-media.is-count-1 {
  grid-template-columns: minmax(0, 1fr);
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-media.is-spread {
  gap: 0.78rem;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-card {
  margin: 0;
  width: 100% !important;
  height: auto !important;
  min-width: 0 !important;
  position: relative;
  transform: none !important;
  inset: auto !important;
  border: 1px solid #d6e0ed;
  border-radius: 0.78rem;
  background: #ffffff;
  box-shadow: 0 8px 18px rgba(15, 34, 63, 0.08);
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-card-img {
  width: 100% !important;
  height: 100% !important;
  display: block;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  padding: 0 !important;
  margin: 0 !important;
  background: #f7f8fb;
  transform: none !important;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-media.is-fit-cover .tp-h11-card-img {
  object-fit: cover !important;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-media.is-fit-contain .tp-h11-card-img {
  object-fit: contain !important;
}

body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-media .tp-h11-card--3 .tp-h11-card-img {
  object-fit: fill !important;
  object-position: center center !important;
  background: #f3f2f3;
}

@media (max-width: 1199px) {
  body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-grid {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-copy {
    padding: 1.12rem 1.05rem 0.95rem;
  }

  body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-title {
    font-size: clamp(1.72rem, 5vw, 2.16rem);
    line-height: 1.08;
    margin-bottom: 0.56rem;
  }

  body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-desc {
    margin-inline-start: 0;
    max-width: 100%;
    font-size: 0.95rem;
  }

  body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-media {
    padding: 0 0.62rem 0.62rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.52rem;
  }

  body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-media.is-count-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-media.is-count-1 {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 700px) {
  body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-media {
    grid-template-columns: 1fr;
    gap: 0.5rem;
  }

  body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-card {
    aspect-ratio: 1 / 1;
  }

  body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-step-sep {
    display: none;
  }

  body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-step {
    font-size: 0.8rem;
    gap: 0.4rem;
    padding: 0.28rem 0.62rem 0.28rem 0.4rem;
  }

  body:is(.home, .front-page) .tp-home-hero-v11 .tp-h11-step-num {
    width: 0.94rem;
    height: 0.94rem;
  }
}
