/* Template 1 (Zuricom) - Home + Footer styling
   Mobile-first, lightweight, and scoped where possible.
*/

/* Generic spacing */
.zuricom-template1 .zuri-section { padding: 56px 0; }
.zuricom-template1 .zuri-section--hero { padding-top: 28px; padding-bottom: 28px; }
.zuricom-template1 .zuri-section-head { margin: 0 0 26px; }
.zuricom-template1 .zuri-section-head--center { text-align: center; }
.zuricom-template1 .zuri-section-head h2 { font-size: 34px; font-weight: 700; margin: 0 0 10px; }
.zuricom-template1 .zuri-section-head p { margin: 0; opacity: .8; }

/* Section 1: Hero + side banners */
.main-kicker {
  padding-top: 64px;
}
.zuri-banner-grid { padding: 0; }
.zuri-banner-grid__inner { display:grid; grid-template-columns: 2fr 1fr; gap: 18px; }
.zuri-banner-grid__side { display:grid; grid-template-rows: 1fr 1fr; gap: 18px; }
.zuri-banner { border-radius: 14px; overflow:hidden; background-size: cover; background-position:center; position:relative; min-height: 220px; color:#fff; text-decoration:none; }
.zuri-banner--main { min-height: 458px; }
.zuri-banner:before { content:""; position:absolute; inset:0; background: rgba(0,0,0,.35); }
.zuri-banner__overlay { position:absolute; inset:0; padding: 26px; display:flex; flex-direction:column; justify-content:center; gap:10px; }
.zuri-banner__kicker { font-size: 13px; opacity:.95; text-transform: uppercase; letter-spacing: .08em; }
.zuri-banner__title { font-size: 44px; line-height:1.05; font-weight:700; margin: 0; }
.zuri-banner--side .zuri-banner__title { font-size: 22px; }
.zuri-banner__subtitle { margin:0; opacity:.9; }
.zuri-banner__cta { 
  display:inline-flex; 
  align-items:center; 
  gap:8px; 
  margin-top: 8px; 
  font-weight:600;
}

/* Tabs */
.zuri-tabs__nav { display:flex; gap: 26px; justify-content:center; align-items:center; flex-wrap:wrap; margin: 10px 0 28px; }
.zuri-tab { text-decoration:none; color: inherit; opacity:.75; font-weight: 500; position: relative; padding-bottom: 8px; }
.zuri-tab:hover { opacity:1; }
.zuri-tab.is-active { opacity: 1; color: var(--secondary-color); }
.zuri-tab.is-active:after { content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background: var(--secondary-color); }
.zuri-tabs__panel { animation: zuriFade .2s ease-in; }
@keyframes zuriFade { from { opacity:.35; transform: translateY(3px);} to { opacity:1; transform:none;} }

/* Section 2: Trendy products — force true grid, no carousel */
.home .zuri-section--trendy .zuri-carousel,
.home .zuri-trendy .zuri-carousel {
  position: relative;
}

.home .zuri-section--trendy .zuri-carousel__track,
.home .zuri-trendy .zuri-carousel__track {
  overflow: visible !important;
  scroll-snap-type: none !important;
}

.home .zuri-section--trendy .zuri-products-track,
.home .zuri-trendy .zuri-products-track,
.home .zuri-section--trendy ul.products.zuri-products-track,
.home .zuri-trendy ul.products.zuri-products-track {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 28px !important;
  padding: 10px 0 18px !important;
  margin: 0 !important;
  list-style: none !important;
  overflow: visible !important;
  width: 100% !important;
}

.home .zuri-section--trendy .zuri-products-track > li.product,
.home .zuri-trendy .zuri-products-track > li.product,
.home .zuri-section--trendy ul.products.zuri-products-track > li.product,
.home .zuri-trendy ul.products.zuri-products-track > li.product {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: unset !important;
  margin: 0 !important;
  text-align: center;
}

.home .zuri-section--trendy .zuri-products-track li.product a,
.home .zuri-trendy .zuri-products-track li.product a {
  text-decoration: none;
}

.home .zuri-section--trendy .zuri-products-track li.product img,
.home .zuri-trendy .zuri-products-track li.product img {
  width: 100% !important;
  height: 260px !important;
  object-fit: contain;
  margin: 0 auto 16px;
}

.home .zuri-section--trendy .zuri-products-track .woocommerce-loop-product__title,
.home .zuri-trendy .zuri-products-track .woocommerce-loop-product__title {
  font-size: 18px !important;
  font-weight: 500;
}

.home .zuri-section--trendy .zuri-products-track .price,
.home .zuri-trendy .zuri-products-track .price {
  font-size: 16px;
}

.home .zuri-section--trendy .zuri-carousel__nav,
.home .zuri-trendy .zuri-carousel__nav {
  display: none !important;
}

/* Kill any leftover carousel/flex behavior from theme/WooCommerce */
.home .zuri-section--trendy .zuri-products-track,
.home .zuri-trendy .zuri-products-track {
  display: grid !important;
}

.home .zuri-section--trendy .zuri-products-track > li.product,
.home .zuri-trendy .zuri-products-track > li.product {
  flex-basis: auto !important;
}

/* Section 3: Categories mosaic */
.zuri-catgrid__grid { display:grid; grid-template-columns: 1fr 1fr 1fr; gap: 18px; }
.zuri-catgrid__mid { display:grid; grid-template-rows: 1fr 1fr; gap: 18px; }
.zuri-catcard { border-radius: 14px; overflow:hidden; background-size: cover; background-position:center; position:relative; min-height: 220px; text-decoration:none; }
.zuri-catcard--tall { min-height: 458px; }
.zuri-catcard:before { content:""; position:absolute; inset:0; background: rgba(0,0,0,.22); }
.zuri-catcard__label { position:absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); text-align:center; color:#fff; font-weight:700; font-size: 20px; text-shadow: 0 10px 18px rgba(0,0,0,.25); }

/* Section 4: Recent arrivals grid */
.zuri-products-grid { margin: 0; list-style:none; display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 34px; }
.zuri-products-grid > li.product {
  text-align:center;
  /* Override WooCommerce float-based column rules (fixes ultra-narrow tall cards) */
  float:none !important;
  width:auto !important;
  margin:0 !important;
}
.zuri-products-grid li.product img { width: 100% !important; height: 240px !important; object-fit: contain; margin: 0 auto 14px; }
.zuri-products-grid .woocommerce-loop-product__title { font-size: 16px !important; font-weight: 500; }
.zuri-products-grid .price { font-size: 15px; }
.zuri-recent__cta { margin-top: 26px; text-align:center; }

/* Section 5: Services */
.zuri-services { padding-top: 30px; padding-bottom: 30px; border-top: 1px solid rgba(0,0,0,.06); border-bottom: 1px solid rgba(0,0,0,.06); }
.zuri-services__inner { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 24px; text-align:center; }
.zuri-service i { font-size: 34px; display:inline-block; margin-bottom: 10px; }
.zuri-service h4 { font-size: 20px; margin: 0 0 8px; font-weight: 700; }
.zuri-service p { margin: 0; opacity: .75; }

/* Section 6: Blog */
.zuri-blog__grid { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 26px; }
.zuri-post { text-align:center; }
.zuri-post__thumb { display:block; border-radius: 14px; overflow:hidden; }
.zuri-post__thumb img { width:100%; height: 240px; object-fit: cover; display:block; }
.zuri-post__meta { display:flex; justify-content:center; gap: 18px; font-size: 13px; opacity: .55; margin: 16px 0 10px; }
.zuri-post__title { font-size: 20px; font-weight: 700; margin: 0 0 10px; }
.zuri-post__title a { color: inherit; text-decoration:none; }
.zuri-post__excerpt { opacity: .7; margin: 0 0 16px; }
.zuri-post__more { color: var(--secondary-color); text-decoration:none; font-weight: 600; }
.zuri-blog__cta { margin-top: 26px; text-align:center; }

/* Subscribe banner above footer */
.zuri-subscribe { position: relative; background-size: cover; background-position:center; padding: 48px 0; color:#fff; }
.zuri-subscribe:before { content:""; position:absolute; inset:0; background: rgba(0,0,0,.35); }
.zuri-subscribe__inner { position:relative; display:flex; align-items:center; gap: 18px; justify-content: space-between; flex-wrap:wrap; }
.zuri-subscribe__title { font-size: 36px; font-weight: 800; margin: 0 0 6px; }
.zuri-subscribe__text { margin:0; opacity: .9; }
.zuri-subscribe__action .btn { padding: 12px 22px; border-radius: 0; }

/* Footer (dark) */
.zuri-footer .zuri-footer__widgets {
  background: var(--color-footer-bg);
  color: var(--color-footer-text);
  padding: 56px 0;
}

.zuri-footer .footer-widget h4,
.zuri-footer .widget-title {
  color: var(--color-footer-text);
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 14px;
}

.zuri-footer .footer-widget,
.zuri-footer .footer-widget p,
.zuri-footer .footer-widget li,
.zuri-footer .footer-widget span,
.zuri-footer .footer-widget div {
  color: var(--color-footer-text);
}

.zuri-footer .footer-widget ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.zuri-footer .footer-widget ul li {
  margin: 10px 0;
}

.zuri-footer .footer-widget a {
  color: var(--color-footer-link);
  text-decoration: none;
}

.zuri-footer .footer-widget a:hover {
  color: var(--color-footer-link-hover);
}

.zuri-footer .footer-widget--brand p {
  margin-top: 10px;
  opacity: 1;
}

.zuri-footer .zuri-footer__social {
  display: flex;
  gap: 10px;
  margin-top: 18px;
}

.zuri-footer .zuri-footer__social a {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid currentColor;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-footer-link);
}

.zuri-footer .zuri-footer__social a:hover {
  color: var(--color-footer-link-hover);
  border-color: currentColor;
}

.zuri-footer .zuri-footer__bottom {
  background: var(--color-footer-bg);
  color: var(--color-footer-text);
  padding: 20px 0;
  border-top: 1px solid rgba(255,255,255,.08);
}

.zuri-footer .zuri-footer__bottom,
.zuri-footer .zuri-footer__bottom * {
  color: var(--color-footer-text);
}

.zuri-footer .zuri-footer__bottom a {
  color: var(--color-footer-link);
}

.zuri-footer .zuri-footer__bottom a:hover {
  color: var(--color-footer-link-hover);
}

.zuri-footer .zuri-footer__bottom-inner {
  display: flex;
  align-items: center;
  gap: 18px;
  justify-content: space-between;
  flex-wrap: wrap;
}

.zuri-footer .zuri-footer__payments {
  opacity: .9;
  font-size: 13px;
}

.zuri-footer .zuri-footer__copy {
  font-size: 13px;
}

/* Responsive */
@media (max-width: 991px) {
  .zuri-banner-grid__inner { grid-template-columns: 1fr; }
  .zuri-banner--main { min-height: 340px; }
  .zuri-banner__title { font-size: 34px; }
  .zuri-catgrid__grid { grid-template-columns: 1fr; }
  .zuri-catcard--tall { min-height: 320px; }
  .zuri-products-grid { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 22px; }
  .zuri-services__inner { grid-template-columns: 1fr; }
  .zuri-blog__grid { grid-template-columns: 1fr; }

  /* Section 2 tablet */
  .home .zuri-section--trendy .zuri-products-track,
  .home .zuri-trendy .zuri-products-track,
  .home .zuri-section--trendy ul.products.zuri-products-track,
  .home .zuri-trendy ul.products.zuri-products-track {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
  }

  /* Section 4 tablet */
  .zuri-recent ul.products.zuri-products-grid,
  .home .zuri-recent ul.products.zuri-products-grid {
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    gap: 22px !important;
  }
}

@media (max-width: 575px) {
  .zuricom-template1 .zuri-section-head h2 {
    font-size: 28px;
  }

  /* Section 2 mobile */
  .home .zuri-section--trendy .zuri-products-track,
  .home .zuri-trendy .zuri-products-track,
  .home .zuri-section--trendy ul.products.zuri-products-track,
  .home .zuri-trendy ul.products.zuri-products-track {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
  }

  .home .zuri-section--trendy .zuri-products-track li.product img,
  .home .zuri-trendy .zuri-products-track li.product img {
    height: 220px !important;
  }
}

/* Template 1: buttons should be natural size (not full width) */
.zuricom-template1 .theme-btn,
.zuricom-template1 .btn,
.zuricom-template1 a.btn,
.zuricom-template1 .wp-element-button,
.zuricom-template1 .woocommerce a.button,
.zuricom-template1 .woocommerce button.button,
.zuricom-template1 .woocommerce input.button,
.zuricom-template1 .woocommerce #respond input#submit {
  width: auto !important;
  max-width: 100% !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

/* If any specific CTA containers were forcing full-width children */
.zuricom-template1 .zuri-recent__cta .theme-btn,
.zuricom-template1 .zuri-blog__cta .theme-btn,
.zuricom-template1 .zuri-subscribe__action .btn,
.zuricom-template1 .zuri-banner__cta {
  width: auto !important;
}

/* Optional: on very small screens, allow wrapping instead of overflow */
@media (max-width: 420px) {
  .zuricom-template1 .theme-btn,
  .zuricom-template1 .btn,
  .zuricom-template1 .wp-element-button {
    white-space: normal;
  }
}

/* Banner overlay stacking safety */
.zuri-banner:before { z-index: 0; }
.zuri-banner__overlay { position: relative; z-index: 1; }

/* Make banner CTA look like a normal button (shrink-wrap) */
.zuricom-template1 .zuri-banner__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto !important;
  max-width: 100%;
  padding: 10px 22px;
  border-radius: 4px;
  border: 1px solid rgba(255,255,255,.75);
  background: transparent;
  color: #fff !important;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

/* Hover */
.zuricom-template1 .zuri-banner__cta:hover,
.zuricom-template1 a.zuri-banner__cta:hover {
  background: #fff;
  color: var(--secondary-color) !important;
  border-color: #fff;
}

/* Ensure links inside banners stay white by default */
.zuricom-template1 .zuri-banner,
.zuricom-template1 .zuri-banner a {
  color: #fff;
}

/* ==============================
   Banner CTA – compact centered buttons
   ============================== */
.zuricom-template1 .zuri-banner__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto !important;
  min-width: 140px;          /* keeps button shape consistent */
  padding: 8px 18px;         /* smaller button */
  border-radius: 4px;
  border: 1px solid rgba(255,255,255,.75);
  background: transparent;
  color: #fff !important;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: .02em;
  text-decoration: none;
  white-space: nowrap;
  text-align: center;
}

/* Center inside overlay */
.zuri-banner__overlay {
  align-items: flex-start;
}
.zuri-banner__overlay .zuri-banner__cta {
  align-self: center;       /* centers button horizontally */
}

/* Hover */
.zuricom-template1 .zuri-banner__cta:hover {
  background: #fff;
  color: var(--secondary-color) !important;
  border-color: #fff;
}

/* Optional: tighten arrow spacing */
.zuricom-template1 .zuri-banner__cta::after {
  margin-left: 6px;
}


/* ==============================
   Main Hero Banner Layout Fix
   ============================== */

/* Stronger gradient overlay for readability */
.zuri-banner--main::before {
  background: linear-gradient(
    90deg,
    rgba(15,10,30,.78) 0%,
    rgba(15,10,30,.55) 40%,
    rgba(15,10,30,.30) 75%,
    rgba(15,10,30,.15) 100%
  );
}

/* Overlay layout */
.zuri-banner--main .zuri-banner__overlay {
  justify-content: center;      /* vertical center */
  align-items: flex-start;      /* left align */
  text-align: left;
  padding-left: 70px;           /* space for arrows */
  padding-right: 70px;          /* space for arrows */
  max-width: 640px;             /* keeps text readable */
}

/* Title readability */
.zuri-banner--main .zuri-banner__title {
  font-size: 48px;
  line-height: 1.1;
  letter-spacing: -.01em;
  text-shadow: 0 6px 18px rgba(0,0,0,.45);
}

/* Eyebrow */
.zuri-banner--main .zuri-banner__kicker {
  opacity: .9;
  letter-spacing: .12em;
}

/* Button spacing */
.zuri-banner--main .zuri-banner__cta {
  margin-top: 18px;
}

@media (max-width: 991px) {
  .zuri-banner--main .zuri-banner__overlay {
    padding-left: 40px;
    padding-right: 40px;
    max-width: 520px;
  }

  .zuri-banner--main .zuri-banner__title {
    font-size: 36px;
  }
}

/* Force Recent Arrivals (section-4) to 4 columns on desktop */
.zuri-recent ul.products.zuri-products-grid{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 34px !important;
}

.zuri-recent ul.products.zuri-products-grid > li.product{
  float: none !important;
  width: auto !important;
  margin: 0 !important;
}

/* Responsive */
@media (max-width: 575px){
  .zuri-recent ul.products.zuri-products-grid,
  .home .zuri-recent ul.products.zuri-products-grid{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 16px !important;
  }
}

/* =========================================
   GLOBAL HORIZONTAL PAGE SPACING
========================================= */

.site-content,
.home .site-content {
    padding-left: 40px;
    padding-right: 40px;
}

/* Larger screens */
@media (min-width: 1440px) {
    .site-content,
    .home .site-content {
        padding-left: 80px;
        padding-right: 80px;
    }
}

/* Tablets */
@media (max-width: 1024px) {
    .site-content,
    .home .site-content {
        padding-left: 24px;
        padding-right: 24px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .site-content,
    .home .site-content {
        padding-left: 16px;
        padding-right: 16px;
    }
}

/* =========================================================
   Shared product-card harmony layer.
   Keeps home sections visually aligned with the refined shop card.
========================================================= */
.home .zuri-product-card.zuri-card--t4 .zuri-card-title,
.home .zuri-product-card.zuri-card--t4 .zuri-card-price{
  text-align:center;
}

.home .zuri-product-card.zuri-card--t4 .zuri-card-actions{
  margin-left:auto;
  margin-right:auto;
}