.search-input-group {
  position: relative;
  display: flex;
  align-items: center;
}
.search-input {
  border: 2px solid #eee;
  border-radius: 30px;
  padding: 10px 25px;
  padding-right: 50px;
  width: 100%;
  transition: all 0.3s ease;
}
.search-input:focus {
  border-color: #C6C9CF;
  box-shadow: none;
}
.search-icon {
  position: absolute;
  right: 20px;
  color: #11181C;
}
.icon {
  width: 2rem;
  height: 2rem;
  color: #11181C;
}
.icon-header:hover { color: #657676; }
.icon-menu {
  width: 48px;
  height: 48px;
  color: #11181C;
}
.icon-menu:hover {
  color: #657676;
}
.icon-header {
  width: 2.4rem;
  height: 2.4rem;
  color: #11181C;
}
.icon-small {
  width: 26px;
  height: 26px;
  color: #11181C;
}
.cart-badge {
  position: absolute;
  top: -10px;
  right: -10px;
  background: rgba(220, 53, 69, 0.8);
  color: #fff;
  font-size: 0.80rem;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
}
.bg-header {
	background-color: #f6f7f9;
}
.bg-glass {
  background: rgba(255, 255, 255, 0.9); /* branco translúcido */
  backdrop-filter: blur(10px);            /* efeito vidro */
  -webkit-backdrop-filter: blur(10px);    /* suporte Safari */
}
.bg-animated {
  position: relative;
  overflow: hidden;
  border-radius: 1rem;
  z-index: 0;
}
.bg-animated::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(220, 225, 230, 0.9), rgba(180, 190, 200, 0.9), rgba(210, 220, 235, 0.9));
  background-size: 300% 300%;
  animation: bgShift 6s ease-in-out infinite;
  border-radius: inherit;
  z-index: -1;
}
@keyframes bgShift {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
.link-opacity:hover { opacity: 0.8; }
#menu-content {
  transition: opacity 0.25s ease, transform 0.25s ease;
}
#menu-content.animating {
  opacity: 0;
  transform: translateX(-15px);
}

/* ================= FOOTER DEFAULT ================= */
.footer-default { color: #11181C; }
.footer-default a { color: inherit; text-decoration: none; transition: color .2s ease, opacity .2s ease; }
.footer-default a:hover { color: #657676; }

.footer-wave { display: block; width: 100%; height: 60px; color: #e4e6e9; }

.footer-top { background: #e4e6e9; padding: 3.5rem 0 2rem; }

.newsletter-card { padding: 2rem 2.25rem; border-radius: 1.25rem; }
.newsletter-card .search-input { border-color: rgba(255,255,255,.55); background: rgba(255,255,255,.85); }
.newsletter-card .search-input:focus { background: #fff; }
.newsletter-submit {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  border: none; border-radius: 30px; padding: .55rem 1.25rem;
  background: #11181C; color: #fff; font-weight: 600; font-size: .9rem;
  transition: background .2s ease;
}
.newsletter-submit:hover { background: #333d42; }

.footer-col-title {
  font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: #11181C; margin-bottom: 1rem; position: relative; padding-bottom: .5rem;
}
.footer-col-title::after {
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 28px; height: 2px; background: #11181C; border-radius: 2px;
  transition: width .25s ease;
}
.footer-col:hover .footer-col-title::after { width: 48px; }

.footer-links { list-style: none; padding: 0; margin: 0; }
.footer-links li { margin-bottom: .5rem; font-size: .92rem; }
.footer-links li a { position: relative; padding-left: 0; transition: padding-left .2s ease; }
.footer-links li a:hover { padding-left: .5rem; }
.footer-links li a::before {
  content: ""; position: absolute; left: 0; top: 50%;
  width: 0; height: 1px; background: currentColor; opacity: .6;
  transition: width .2s ease;
}
.footer-links li a:hover::before { width: .35rem; }

.footer-contact { font-size: .9rem; line-height: 1.6; color: #4a5458; }
.footer-contact strong { color: #11181C; font-weight: 600; }
.footer-contact-icon { width: 16px; height: 16px; }

.footer-logo { max-width: 150px; }

/* ================= LANDING PAGE ================= */

/* Section rhythm */
.section { padding: 3rem 0; }
@media (min-width: 992px) { .section { padding: 4.5rem 0; } }

.section-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.75rem; flex-wrap: wrap; }
.section-eyebrow { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: #657676; margin-bottom: .4rem; }
.section-title { font-size: 1.4rem; font-weight: 800; color: #11181C; margin: 0; letter-spacing: -.01em; position: relative; padding-bottom: .6rem; }
.section-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 36px; height: 3px; background: #11181C; border-radius: 3px; }
@media (min-width: 768px) { .section-title { font-size: 1.85rem; } }
.section-link { font-size: .9rem; font-weight: 600; color: #11181C; text-decoration: none; display: inline-flex; align-items: center; gap: .35rem; }
.section-link:hover { color: #657676; }
.section-link svg { width: 18px; height: 18px; margin-top: 6px;}

/* Hero */
.home-hero { position: relative; }
.home-hero .hero-main { border-radius: 1.25rem; overflow: hidden; position: relative; height: 100%; }
.home-hero .hero-main-media { height: 100%; }
.home-hero .hero-main img { width: 100%; height: auto; display: block; }
.home-hero .hero-badge {
	position: absolute; top: 1rem; left: 1rem;
	background: rgba(255,255,255,.92); backdrop-filter: blur(6px);
	padding: .35rem .85rem; border-radius: 999px;
	font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
	color: #11181C;
	z-index: 3;
}
.site-banner-link,
.site-banner-carousel,
.site-banner-carousel .carousel-inner { display: block; height: 100%; }
.site-banner-carousel .carousel-item { height: 100%; }
.site-banner-image { width: 100%; display: block; }
.site-banner-carousel .carousel-item > .site-banner-link,
.site-banner-carousel .carousel-item > .site-banner-image { height: 100%; }
.site-banner-carousel .carousel-item > .site-banner-link > .site-banner-image { height: 100%; }
.site-banner-indicators {
	left: 1rem;
	right: auto;
	bottom: 1rem;
	transform: none;
	margin: 0;
	padding: .35rem .45rem;
	gap: .35rem;
	width: max-content;
	border-radius: 999px;
	background: rgba(255,255,255,.6);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	z-index: 2;
}
.site-banner-indicators [data-bs-target] {
	width: .5rem;
	height: .5rem;
	margin: 0;
	border: 0;
	border-radius: 999px;
	background: rgba(17,24,28,.35);
	opacity: 1;
	transition: width .25s ease, background .25s ease, transform .25s ease;
}
.site-banner-indicators .active {
	width: 1.2rem;
	background: #11181C;
}
.hero-feature {
	display: flex; flex-direction: column; justify-content: space-between;
	padding: 1.5rem; border-radius: 1.25rem; height: 100%;
	min-height: 220px; color: #11181C;
}
.hero-feature-title { font-size: 1.15rem; font-weight: 800; line-height: 1.2; margin-bottom: .5rem; }
.hero-feature-text { font-size: .9rem; color: #4a5458; margin-bottom: 1rem; }
.hero-feature-btn {
	align-self: flex-start; background: #11181C; color: #fff;
	padding: .55rem 1.15rem; border-radius: 999px;
	font-size: .85rem; font-weight: 600; text-decoration: none;
	transition: background .2s ease, transform .2s ease;
}
.hero-feature-btn:hover { background: #333d42; color: #fff; transform: translateY(-1px); }
@media (min-width: 992px) {
	.home-hero,
	.home-hero .hero-main,
	.home-hero .hero-main-media,
	.home-hero .hero-main > a,
	.home-hero .hero-main > img,
	.home-hero .hero-main .carousel,
	.home-hero .hero-main .carousel-inner,
	.home-hero .hero-main .carousel-item {
		height: 100%;
	}
	.home-hero .hero-main > a,
	.home-hero .hero-main .site-banner-link {
		display: block;
	}
	.home-hero .hero-main img {
		height: 100%;
		object-fit: cover;
	}
}

/* Banner tiles row */
.banner-tile { position: relative; border-radius: 1rem; overflow: hidden; display: block; height: 100%; }
.banner-tile img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.banner-tile:hover img { transform: scale(1.04); }
.banner-tile-caption {
	position: absolute; inset: auto 0 0 0; padding: 1rem 1.15rem;
	background: linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0));
	color: #fff;
}
.banner-tile-caption .tile-eyebrow { font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; opacity: .9; }
.banner-tile-caption .tile-title { font-size: 1.05rem; font-weight: 700; margin: 0; }

/* USPs strip */
.usps-strip { background: #f6f7f9; border-radius: 1rem; padding: 1.25rem 1rem; }
.usps-item { display: flex; align-items: center; gap: .75rem; padding: .5rem .25rem; }
.usps-item-icon {
	flex-shrink: 0; width: 44px; height: 44px; border-radius: 12px;
	display: inline-flex; align-items: center; justify-content: center;
	background: #fff; border: 1px solid #eceef1; color: #11181C;
}
.usps-item-icon svg { width: 22px; height: 22px; }
.usps-item-title { font-size: .88rem; font-weight: 700; color: #11181C; line-height: 1.2; }
.usps-item-text { font-size: .78rem; color: #657676; line-height: 1.3; }

/* Horizontal scroll (products) */
.h-scroll-wrap { position: relative; }
.h-scroll {
	display: flex; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory;
	padding: .5rem .25rem 1rem; margin: 0 -.25rem;
	scrollbar-width: thin;
}
.h-scroll::-webkit-scrollbar { height: 6px; }
.h-scroll::-webkit-scrollbar-thumb { background: #dfe2e6; border-radius: 10px; }
.h-scroll > * { scroll-snap-align: start; flex: 0 0 auto; }
.h-scroll-nav {
	width: 40px; height: 40px; border-radius: 50%;
	border: 0px; background: #fff;
	display: none; align-items: center; justify-content: center;
	color: #11181C;
}
.h-scroll-nav:hover { color: red; transition: color 0.3s ease; }
.h-scroll-nav svg { width: 30px; height: 30px; margin-top: 3px; }

.h-scroll-nav[disabled] { opacity: .35; pointer-events: none; }
@media (min-width: 768px) { .h-scroll-nav { display: inline-flex; } }

/* Product card */
.product-card {
	width: 72vw; max-width: 260px;
	background: #fff; border: 1px solid #eceef1; border-radius: 1rem;
	overflow: hidden; display: flex; flex-direction: column;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
	position: relative;
}
@media (min-width: 576px) { .product-card { width: 240px; } }
@media (min-width: 992px) { .product-card { width: 250px; } }
.product-card:hover { border-color: #c1c5ca; }
.product-media { position: relative; aspect-ratio: 1/1; background: #ffffff; overflow: hidden; }
.product-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; padding: 10px; }
.product-card:hover .product-media img {  }
.product-badge {
	position: absolute; top: .6rem; left: .6rem; z-index: 2;
	padding: .25rem .55rem; border-radius: 999px;
	font-size: .7rem; font-weight: 700; letter-spacing: .03em;
	background: #11181C; color: #fff;
}

.product-fav {
	position: absolute; top: .5rem; right: .5rem; z-index: 2;
	width: 34px; height: 34px; border-radius: 50%;
	background: rgba(255,255,255,.9); border: 1px solid #eceef1;
	display: inline-flex; align-items: center; justify-content: center;
	color: #11181C; cursor: pointer; transition: color .2s ease, background .2s ease;
}
.product-fav:hover { color: #dc3545; background: #fff; }
.product-fav svg { width: 16px; height: 16px; }
.product-body { padding: .9rem 1rem 1rem; display: flex; flex-direction: column; gap: .35rem; flex: 1; }
.product-brand { font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #657676; }
.product-title { font-size: .92rem; font-weight: 600; color: #11181C; margin: 0; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.4em; }
.product-price { display: flex; align-items: baseline; gap: .5rem; margin-top: auto; }
.price-new { font-size: 1.05rem; font-weight: 800; color: #11181C; }
.price-old { font-size: .82rem; color: #9aa3a8; text-decoration: line-through; }
.btn-add-cart {
	margin-top: .6rem; border: none; border-radius: 999px;
	background: #11181C; color: #fff; padding: .5rem .9rem;
	font-size: .82rem; font-weight: 600; cursor: pointer;
	position: relative; z-index: 2;
	transition: background .2s ease;
}
.btn-add-cart:hover { background: #333d42; }

.section-eyebrow-light { color: #c6c9cf; }

/* Category grid */
.category-card { position: relative; display: block; border-radius: 1rem; overflow: hidden; aspect-ratio: 4/5; }
@media (min-width: 768px) { .category-card { aspect-ratio: 3/4; } }
.category-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.category-card:hover img { transform: scale(1.06); }
.category-card::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(to top, rgba(17,24,28,.72) 0%, rgba(17,24,28,.15) 55%, rgba(17,24,28,0) 100%);
}
.category-card-body { position: absolute; inset: auto 0 0 0; padding: 1rem 1.15rem; z-index: 1; }
.category-card-title { font-size: 1.05rem; font-weight: 700; margin: 0 0 .15rem; color: #fff; }
.category-card-meta { font-size: .78rem; opacity: .85; }

/* Brands strip */
.brand-strip { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
@media (min-width: 576px) { .brand-strip { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 768px) { .brand-strip { grid-template-columns: repeat(6, 1fr); } }
.brand-chip {
	display: flex; align-items: center; justify-content: center;
	aspect-ratio: 3/1; background: #fff; border: 1px solid #eceef1; border-radius: .75rem;
	padding: 1rem; font-weight: 800; color: #657676; letter-spacing: .05em;
	transition: border-color .2s ease, color .2s ease, transform .2s ease;
}
.brand-chip:hover { border-color: #11181C; color: #11181C; transform: translateY(-2px); }

/* Blog cards */
.blog-card { background: #fff; border: 1px solid #eceef1; border-radius: 1rem; overflow: hidden; height: 100%; display: flex; flex-direction: column; transition: transform .2s ease, box-shadow .2s ease; }
.blog-card:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(17,24,28,.08); }
.blog-media { aspect-ratio: 16/9; overflow: hidden; background: #f6f7f9; }
.blog-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.blog-card:hover .blog-media img { transform: scale(1.05); }
.blog-body { padding: 1.1rem 1.25rem 1.25rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.blog-tag { align-self: flex-start; font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #fff; background: #11181C; padding: .2rem .55rem; border-radius: 999px; }
.blog-title { font-size: 1.02rem; font-weight: 700; color: #11181C; margin: 0; line-height: 1.35; }
.blog-meta { font-size: .78rem; color: #657676; margin-top: auto; }

/* Split CTA */
.cta-split { background: #11181C; color: #fff; border-radius: 1.25rem; padding: 2rem 1.5rem; position: relative; overflow: hidden; }
@media (min-width: 768px) { .cta-split { padding: 3rem; } }
.cta-split::before {
	content: ""; position: absolute; right: -120px; top: -120px;
	width: 340px; height: 340px; border-radius: 50%;
	background: radial-gradient(circle, rgba(255,255,255,.08), rgba(255,255,255,0));
}
.cta-split h2 { font-size: 1.6rem; font-weight: 800; margin: 0 0 .5rem; color: #fff; }
@media (min-width: 768px) { .cta-split h2 { font-size: 2rem; } }
.cta-split p { color: #c6c9cf; margin: 0 0 1rem; }
.cta-btn-light {
	display: inline-flex; align-items: center; gap: .5rem;
	background: #fff; color: #11181C; padding: .65rem 1.3rem;
	border-radius: 999px; font-weight: 700; text-decoration: none;
	transition: background .2s ease, transform .2s ease;
}
.cta-btn-light:hover { background: #f6f7f9; transform: translateY(-2px); color: #11181C; }

.social-pill {
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 50%;
  background: #fff; border: 1px solid #e5e7ea; margin-right: .35rem;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.social-pill:hover { transform: translateY(-2px); background: #11181C; border-color: #11181C; color: #fff; }
.social-pill svg { width: 16px; height: 16px; }

.trust-row {
  display: flex; flex-wrap: wrap; gap: 1rem; align-items: center;
  padding: 1rem 1.25rem; background: #fff; border-radius: .75rem;
  border: 1px solid #eceef1;
}
.trust-item { display: flex; align-items: center; gap: .5rem; font-size: .82rem; color: #4a5458; }
.trust-item svg { width: 22px; height: 22px; color: #11181C; flex-shrink: 0; }

.footer-bottom {
  background: #11181C; color: #c6c9cf; padding: 1rem 0;
  font-size: .82rem;
}
.footer-bottom a { color: #c6c9cf; text-decoration: none; }
.footer-bottom a:hover { color: #fff; }

.payment-chip {
  display: inline-flex; align-items: center; justify-content: center;
  height: 26px; padding: 0 .55rem; margin-left: .35rem;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
  border-radius: .35rem; font-size: .7rem; font-weight: 700; letter-spacing: .05em;
  color: #fff;
}

.scroll-top {
  width: 38px; height: 38px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.15);
  color: #fff; transition: background .2s ease, transform .2s ease;
}
.scroll-top:hover { background: rgba(255,255,255,.18); transform: translateY(-2px); color: #fff; }
.scroll-top svg { width: 16px; height: 16px; transform: rotate(-90deg); }
