/*
Theme Name: Kymi Store Light Mode
Theme URI: https://kymistore.com.br
Author: Bruno Cominotti
Description: Tema oficial Claro da Kymi Store.
Version: 3.6 (FIX FINAL - Logo Maior + Lupa Centralizada)
*/

*{margin:0;padding:0;box-sizing:border-box}
:root{
  --kymi-hot:#E8145A;
  --kymi-violet:#7B1FD4;
  --kymi-cyan:#008FC4;
  --kymi-gold:#D4900A;
  --kymi-light:#FAFAF8;
  --kymi-light2:#F4F2EE;
  --kymi-surface:#FFFFFF;
  --kymi-surface2:#F0EDE8;
  --kymi-border:rgba(0,0,0,0.09);
  --kymi-border2:rgba(0,0,0,0.15);
  --kymi-text:#141210;
  --kymi-muted:#7A746E;
  --grad1:linear-gradient(135deg,#E8145A,#7B1FD4,#008FC4);
  --grad2:linear-gradient(135deg,#E8145A 0%,#D4900A 50%,#008FC4 100%);
  --kymi-container: 1080px; 
}
html{scroll-behavior:smooth}
body{font-family:'Jost',sans-serif;background:var(--kymi-light);color:var(--kymi-text);min-height:100vh;overflow-x:hidden;}

/* ===== HEADER ===== */
.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(255, 255, 255, 0.98);backdrop-filter:blur(20px);border-bottom:0.5px solid var(--kymi-border);}
.header-top, .site-nav {max-width: var(--kymi-container);margin: 0 auto;width: 100%;}

/* 1. TRAVANDO O CABEÇALHO FINO MAS COM ESPAÇO PRA LOGO */
.header-top{
  display:grid;
  grid-template-columns: 240px 1fr 240px;
  align-items:center;
  padding: 0 24px; 
  height: 55px; /* Aumentado para acomodar a logo grande */
  gap:24px;
}

/* 2. LOGO BEM MAIOR E SEM LINHAS FANTASMAS */
.site-header .header-top > a:first-child {
  display: flex;
  align-items: center;
  justify-content: flex-start; 
  height: 100%;
  border: none !important;
  outline: none !important;
  text-decoration: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

.logo-img {
  height: 80px; 
  width: auto;
  max-width: 100%;
  object-fit: contain;
  margin: 0;
  
  /* 1. O ZOOM VOLTOU! (Pode aumentar o 1.6 para 1.8 se quiser ainda maior) */
  transform: scale(1.7) !important; 
  transform-origin: left center !important;
  
  /* 2. Mantendo a limpeza de bordas e o cortador da linha fantasma */
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  clip-path: inset(0px 0px 0px 2px); 
}

/* 3. BUSCA E ÍCONE CORRIGIDOS DEFINITIVAMENTE */
.search-bar{display:flex;align-items:center;border:1px solid var(--kymi-border2);border-radius:3px;overflow:hidden;width:100%; max-width:380px; background:var(--kymi-surface2);justify-self: center; height: 30px; margin-top: -15px}

/* A mágica que faltava para desbugar a lupa: */
.search-bar form { display: flex; width: 100%; height: 100%; margin: 0; padding: 0; }

.search-bar input{background:transparent;color:var(--kymi-text);border:none;outline:none;padding:0 15px;flex:1;font-family:'Jost',sans-serif;font-size:14px;font-weight:300; height: 100%;}
.search-bar input::placeholder{color:var(--kymi-muted)}
.search-btn{
  background:var(--grad1);
  color:#fff;
  border:none;
  width: 50px; 
  height: 100%;
  flex-shrink: 0; 
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:opacity .2s;
  outline:none;
  padding: 0; /* Sem padding para o ícone centralizar perfeito */
}
.search-btn:hover{opacity:.85}
.search-btn svg{
  width:20px !important;
  height:20px !important;
  stroke:#ffffff !important;
  fill:none !important;
  stroke-width: 2px !important; 
  display:block;
  margin: 0 auto;
}

/* 4. ÍCONES */
.header-icons{display:flex;align-items:center;justify-content:flex-end;gap:20px;}
.icon-btn{background:none;border:none;color:var(--kymi-text);cursor:pointer;display:flex;align-items:center;gap:7px;font-family:'Jost',sans-serif;font-size:14px;font-weight:400;padding:8px 4px;transition:color .2s;position:relative; text-decoration:none;}
.icon-btn:hover{color:var(--kymi-hot)}
.icon-btn svg{width:22px;height:22px}
.cart-badge{position:absolute;top:-4px;right:-8px;background:var(--kymi-hot);color:#fff;width:17px;height:17px;border-radius:50%;font-size:10px;display:flex;align-items:center;justify-content:center;font-weight:600;}

/* ===== NAV (CATEGORIAS) ===== */
.site-nav{display:flex;justify-content:center;gap:0;border-top:0.5px solid var(--kymi-border);background:transparent; padding: 0 24px; height: 45px; align-items:center;}
.nav-item{position:relative}
.nav-link{display:block;padding:10px 24px;font-size:13px;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;color:var(--kymi-text);cursor:pointer;transition:color .2s;background:none;border:none;font-family:'Jost',sans-serif; text-decoration:none;}
.nav-link:hover,.nav-link.active{color:var(--kymi-hot)}
.nav-link::after{ display:none; }

/* ===== DROPDOWN ===== */
.dropdown{position:absolute;top:100%;left:0;min-width:200px;background:#1e1e26;border:0.5px solid rgba(255,255,255,0.1);border-top:2px solid var(--kymi-hot);box-shadow:0 12px 40px rgba(0,0,0,0.3);opacity:0;visibility:hidden;transform:translateY(8px);transition:all .25s;z-index:900;}
.nav-item:hover .dropdown{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown-title{font-size:11px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:var(--kymi-hot);padding:16px 22px 8px;}
.dropdown-link{display:block;padding:10px 22px;font-size:14px;color:rgba(255,255,255,0.55);cursor:pointer;transition:all .2s;font-weight:400; text-decoration:none;}
.dropdown-link:hover{color:#fff;background:rgba(255,255,255,0.06);padding-left:28px;}

/* ===== SITE CONTENT ===== */
/* Respiro atualizado para o header de 95px + 45px da nav */
.site-content {max-width: var(--kymi-container);margin: 0 auto;width: 100%;padding-left: 24px;padding-right: 24px;padding-top: 175px; min-height: 80vh;}

/* ===== HERO / CAROUSEL (ENCAIXE MILIMÉTRICO) ===== */
.hero-section {
  position: relative; 
  overflow: hidden;
  width: 100%;
  height: auto; /* 1. Removemos a trava. A imagem agora dita a altura! */
  background: transparent; /* Removemos o fundo branco */
  box-shadow: 0 20px 50px rgba(0,0,0,0.08); 
  margin-top: 5px !important; /* Mantém colado no cabeçalho */
  border-radius: 5px !important;
}

.carousel-wrap { 
  display: grid; /* 2. O GRANDE TRUQUE: Cria um grid para as imagens */
  width: 100%; 
}

.carousel-slide {
  grid-area: 1 / 1; /* 3. Empilha todas as fotos no mesmo "quadrado" sem colapsar a altura! */
  opacity: 0; 
  visibility: hidden; 
  transition: opacity 0.8s ease;
}

.carousel-slide.active { 
  opacity: 1; 
  visibility: visible; 
  z-index: 2; 
}

.banner-img {
  width: 100%;
  height: auto; /* A imagem assume sua altura natural */
  display: block;
}

/* SETAS E BOLINHAS DE VIDRO MANTIDAS */
.carousel-arr {
  position: absolute; top: 50%; z-index: 5;
  background: rgba(255, 255, 255, 0.4) !important;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.8) !important;
  color: var(--kymi-text);
  width: 56px !important; height: 56px !important;
  border-radius: 50% !important; 
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all .4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  font-size: 20px;
}
.carousel-arr:hover {
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--kymi-hot) !important;
  box-shadow: 0 10px 25px rgba(0,0,0,0.1);
  transform: scale(1.1) translateY(-45%) !important; 
}
.carr-prev { left: 40px; transform: translateY(-50%); }
.carr-next { right: 40px; transform: translateY(-50%); }

.carousel-dots { position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%); display: flex; gap: 12px; z-index: 5; }
.carousel-dot { width: 12px; height: 12px; border-radius: 12px; background: rgba(0,0,0,0.15); cursor: pointer; transition: all .4s cubic-bezier(0.16, 1, 0.3, 1); border: none; }
.carousel-dot.active { background: var(--kymi-hot); width: 48px; }
/* ===== BOTOES GLOBAIS ===== */
.btn-primary{display:inline-block;padding:15px 40px;background:var(--grad1);color:#fff !important;font-size:13px;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;border:none;cursor:pointer;font-family:'Jost',sans-serif;transition:opacity .2s,transform .2s; border-radius: 2px; text-decoration:none;}
.btn-primary:hover{opacity:.85;transform:translateY(-1px)}
.btn-outline{display:inline-block;padding:14px 40px;background:transparent;color:var(--kymi-text) !important;border:0.5px solid var(--kymi-border2);font-size:13px;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;cursor:pointer;font-family:'Jost',sans-serif;transition:all .2s; border-radius: 2px; text-decoration:none;}
.btn-outline:hover{border-color:var(--kymi-text);background:var(--kymi-surface2)}

.carousel-dots{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);display:flex;gap:10px;z-index:5;}
.carousel-dot{width:24px;height:2px;background:rgba(0,0,0,0.18);cursor:pointer;transition:all .3s;border:none;}
.carousel-dot.active{background:var(--kymi-hot);width:40px}
.carousel-arr{position:absolute;top:50%;z-index:5;background:rgba(255,255,255,0.8);border:0.5px solid var(--kymi-border2);color:var(--kymi-text);width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;font-size:20px;}
.carousel-arr:hover{background:var(--kymi-hot);border-color:var(--kymi-hot);color:#fff}
.carr-prev{left:32px;transform:translateY(-50%)}
.carr-next{right:32px;transform:translateY(-50%)}

/* ===== SECTIONS ===== */
.section-header { text-align: center; margin-bottom: 32px; }
.section-eyebrow { font-size: 11px; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; background: var(--grad1); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: block; margin-bottom: 12px; }
.section-title { font-family: 'Jost', sans-serif; font-size: clamp(28px, 3.5vw, 40px); font-weight: 300; color: var(--kymi-text); }
.section-title em { font-style: italic; }

/* ===== CATEGORIES STRIP ===== */
.cats-section { 
  padding: 20px 0; 
  background: transparent; 
  margin: 32px 0 48px; /* Espaço ajustado: nem muito longe do carrossel, nem muito colado embaixo */
  border-radius: 12px; 
  overflow: hidden; 
}
.cats-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 2px; }
.cat-card { position: relative; overflow: hidden; aspect-ratio: 3/4; cursor: pointer; background: var(--kymi-surface); border: 0.5px solid var(--kymi-border); }
.cat-card::before { content: ''; position: absolute; inset: 0; transition: opacity .4s; }
.cat-card:nth-child(1)::before { background: linear-gradient(135deg, rgba(232,20,90,0.07), rgba(123,31,212,0.07)); }
.cat-card:nth-child(2)::before { background: linear-gradient(135deg, rgba(123,31,212,0.07), rgba(0,143,196,0.07)); }
.cat-card:nth-child(3)::before { background: linear-gradient(135deg, rgba(0,143,196,0.07), rgba(212,144,10,0.07)); }
.cat-card:nth-child(4)::before { background: linear-gradient(135deg, rgba(212,144,10,0.07), rgba(232,20,90,0.07)); }
.cat-card:nth-child(5)::before { background: linear-gradient(135deg, rgba(232,20,90,0.05), rgba(0,143,196,0.07)); }
.cat-card:hover::before { opacity: 0; }
.cat-inner { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 28px 24px; background: linear-gradient(to top, rgba(250,250,248,.92) 0%, transparent 60%); transition: background .4s; z-index: 1; }
.cat-card:hover .cat-inner { background: linear-gradient(to top, rgba(250,250,248,1) 40%, rgba(250,250,248,.5) 100%); }
.cat-label { font-size: 11px; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; color: var(--kymi-hot); margin-bottom: 6px; }
.cat-name { font-family: 'Jost', sans-serif; font-size: 24px; font-weight: 400; letter-spacing: -0.01em; margin-bottom: 10px; color: var(--kymi-text); }
.cat-cta { font-size: 12px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: var(--kymi-muted); display: flex; align-items: center; gap: 8px; transform: translateY(8px); opacity: 0; transition: all .3s; }
.cat-card:hover .cat-cta { opacity: 1; transform: translateY(0); }
.cat-deco { position: absolute; inset: 0; z-index: 0; display: flex; align-items: center; justify-content: center; font-family: 'Jost', sans-serif; font-size: 120px; font-weight: 300; color: rgba(0,0,0,0.04); letter-spacing: -0.05em; transition: transform .4s, opacity .4s; }
.cat-card:hover .cat-deco { transform: scale(1.1); opacity: .07; }

/* ===== PRODUCTS GRID ===== */
.products-section { padding: 24px 0 80px; } /* Ajuste fino pra não esmagar o título no bloco de cima */
.products-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 56px; }
.product-card { position: relative; background: var(--kymi-surface); cursor: pointer; overflow: hidden; transition: transform .3s; border: 0.5px solid var(--kymi-border); border-radius: 4px; }
.product-card:hover { transform: scale(1.01); box-shadow: 0 8px 32px rgba(0,0,0,0.08); }
.product-img { aspect-ratio: 3/4; background: var(--kymi-surface2); position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.product-placeholder { font-family: 'Jost', sans-serif; font-size: 64px; font-weight: 300; color: rgba(0,0,0,0.06); }
.product-overlay { position: absolute; inset: 0; background: rgba(250,250,248,0); display: flex; align-items: center; justify-content: center; gap: 12px; transition: background .3s; }
.product-card:hover .product-overlay { background: rgba(250,250,248,.45); }
.overlay-btn { background: rgba(20,18,16,.88); color: #fff; border: none; padding: 10px 16px; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer; font-family: 'Jost', sans-serif; font-weight: 500; opacity: 0; transform: translateY(10px); transition: all .3s; }
.product-card:hover .overlay-btn { opacity: 1; transform: translateY(0); }
.fav-btn { position: absolute; top: 14px; right: 14px; background: rgba(255,255,255,.9); border: 0.5px solid var(--kymi-border2); color: var(--kymi-muted); width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 15px; transition: all .3s; opacity: 0; z-index: 10; }
.product-card:hover .fav-btn { opacity: 1; }
.fav-btn:hover { background: var(--kymi-hot); color: #fff; border-color: var(--kymi-hot); }
.tag-new { position: absolute; top: 14px; left: 14px; background: var(--kymi-hot); color: #fff; font-size: 10px; font-weight: 600; letter-spacing: 0.1em; padding: 4px 10px; text-transform: uppercase; z-index: 10; }
.product-info { padding: 18px 16px; border-top: 0.5px solid var(--kymi-border); }
.product-cat { font-size: 10px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--kymi-muted); margin-bottom: 6px; }
.product-name { font-size: 14px; font-weight: 400; color: var(--kymi-text); margin-bottom: 8px; }
.product-price { font-size: 15px; font-weight: 500; background: var(--grad2); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

/* ===== BANNER ===== */
.banner-section{padding:72px;background:var(--kymi-surface);border:0.5px solid var(--kymi-border);border-radius: 12px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:40px;margin-bottom:80px;}
.banner-section::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--grad1);}
.banner-deco{position:absolute;right:0;top:0;bottom:0;width:45%;opacity:0.04;display:flex;align-items:center;justify-content:center;font-family:'Jost',serif;font-size:180px;font-weight:300;color:var(--kymi-text);pointer-events:none;}
.banner-content{position:relative;z-index:1}
.banner-tag{font-size:11px;font-weight:500;letter-spacing:0.16em;text-transform:uppercase;color:var(--kymi-hot);margin-bottom:16px;display:block;}
.banner-title{font-family:'Jost',serif;font-size:clamp(36px,4vw,56px);font-weight:300;line-height:1;margin-bottom:20px;color:var(--kymi-text);}
.banner-sub{font-size:15px;font-weight:300;color:var(--kymi-muted);line-height:1.7;max-width:420px;}
.banner-action{position:relative;z-index:1;flex-shrink:0}

/* ===== FOOTER ===== */
.site-footer{background:var(--kymi-text);padding:72px 0 36px;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:56px; max-width: var(--kymi-container); margin-left: auto; margin-right: auto; padding: 0 24px;}
.footer-logo-placeholder{height:44px;width:110px;margin-bottom:20px;background:rgba(255,255,255,0.08);border:1.5px dashed rgba(255,255,255,0.2);border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:11px;color:rgba(255,255,255,0.3);letter-spacing:0.1em;}
.footer-logo-placeholder::after{content:'LOGO'}
.footer-desc{font-size:14px;color:rgba(255,255,255,0.55);line-height:1.8;max-width:280px;margin-bottom:28px}
.footer-socials{display:flex;gap:12px}
.social-btn{width:44px;height:44px;border:0.5px solid rgba(255,255,255,0.15);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .25s;border-radius:2px;color:rgba(255,255,255,0.6);}
.social-btn:hover{border-color:var(--kymi-hot);color:#fff;background:rgba(232,20,90,0.15)}
.social-btn svg{width:20px;height:20px}
.footer-heading{font-size:11px;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;color:#fff;margin-bottom:20px;}
.footer-links{list-style:none;display:flex;flex-direction:column;gap:10px}
.footer-links li a{font-size:14px;color:rgba(255,255,255,0.5);cursor:pointer;transition:color .2s; text-decoration:none;}
.footer-links li a:hover{color:#fff}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;border-top:0.5px solid rgba(255,255,255,0.1);padding-top:28px;font-size:13px;color:rgba(255,255,255,0.35); max-width: var(--kymi-container); margin-left: auto; margin-right: auto; padding-left: 24px; padding-right: 24px;}
.footer-grad-line{height:1px;background:var(--grad1);margin-bottom:28px;opacity:.5; max-width: var(--kymi-container); margin-left: auto; margin-right: auto;}

/* ===== MODAL ===== */
.kymi-modal-overlay { position:fixed; inset:0; z-index:9999; background:rgba(0,0,0,0.6); backdrop-filter:blur(5px); display:flex; align-items:center; justify-content:center; }
.auth-box { background:var(--kymi-surface); border:0.5px solid var(--kymi-border2); box-shadow:0 16px 64px rgba(0,0,0,0.08); width:100%; max-width:460px; padding:52px; position:relative; max-height: 90vh; overflow-y:auto; border-radius:4px;}
.auth-title { font-family:'Jost',serif; font-size:40px; font-weight:300; margin-bottom:8px; text-align:center; color:var(--kymi-text); }
.auth-sub { font-size:14px; color:var(--kymi-muted); text-align:center; margin-bottom:40px; }
.auth-tabs { display:flex; border-bottom:0.5px solid var(--kymi-border); margin-bottom:36px; }
.auth-tab { flex:1; padding:12px; font-size:13px; font-weight:500; letter-spacing:0.06em; text-align:center; cursor:pointer; color:var(--kymi-muted); border:none; background:none; font-family:'Jost',sans-serif; border-bottom:1.5px solid transparent; margin-bottom:-0.5px; transition:all .2s; }
.auth-tab.active { color:var(--kymi-text); border-bottom-color:var(--kymi-hot); }
.form-group { margin-bottom:20px; }
.form-label { display:block; font-size:11px; font-weight:500; letter-spacing:0.1em; text-transform:uppercase; color:var(--kymi-muted); margin-bottom:8px; }
.form-input { width:100%; background:var(--kymi-light2); border:0.5px solid var(--kymi-border2); color:var(--kymi-text); padding:13px 16px; font-family:'Jost',sans-serif; font-size:14px; outline:none; transition:border-color .2s; }
.form-input:focus { border-color:var(--kymi-violet); }
.form-input::placeholder { color:rgba(0,0,0,0.25); }
.auth-form-panel { display:none; }
.auth-form-panel.active { display:block; animation:fadeIn 0.3s ease; }
.auth-link { text-align:center; font-size:13px; color:var(--kymi-muted); margin-top:20px; }
.auth-link span { color:var(--kymi-hot); cursor:pointer; }
.divider { display:flex; align-items:center; gap:16px; margin:24px 0; font-size:12px; color:var(--kymi-muted); }
.divider::before, .divider::after { content:''; flex:1; height:0.5px; background:var(--kymi-border2); }
#kymi-modal-close { position:absolute; top:20px; right:20px; background:none; border:none; font-size:24px; color:var(--kymi-muted); cursor:pointer; }
#kymi-modal-close:hover { color:var(--kymi-hot); }
.btn-social{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:12px 16px;background:var(--kymi-surface);border:0.5px solid var(--kymi-border2);color:var(--kymi-text);font-size:13px;font-weight:500;letter-spacing:0.04em;font-family:'Jost',sans-serif;cursor:pointer;transition:all .2s;}
.btn-social:hover{background:var(--kymi-light2);border-color:var(--kymi-text)}

@keyframes fadeIn { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }

/* ===== NOTIFY ===== */
.notify{position:fixed;bottom:28px;right:28px;z-index:9999;background:var(--kymi-surface);border:0.5px solid var(--kymi-hot);box-shadow:0 8px 32px rgba(0,0,0,0.12);padding:14px 22px;font-size:13px;color:var(--kymi-text);transform:translateX(200px);opacity:0;transition:all .4s;display:flex;align-items:center;gap:10px;border-radius:4px;}
.notify.show{transform:translateX(0);opacity:1}
.notify-dot{width:8px;height:8px;border-radius:50%;background:var(--kymi-hot);flex-shrink:0;}

/* ===== WOOCOMMERCE & INNER PAGES ===== */
.inner-page-hero{text-align:center;padding:40px 24px;background:var(--kymi-light2);border-bottom:0.5px solid var(--kymi-border);margin-bottom:40px; border-radius: 8px;}
.inner-title{font-family:'Jost',serif;font-size:clamp(42px,5vw,68px);font-weight:300;margin-bottom:14px;color:var(--kymi-text);}
.inner-sub{font-size:15px;color:var(--kymi-muted);font-weight:300}

.listing-layout{display:grid;grid-template-columns:240px 1fr;gap:32px; align-items:start;}
.filters-col{padding-top:8px}
.filter-block{margin-bottom:32px;border-bottom:0.5px solid var(--kymi-border);padding-bottom:24px}
.filter-title{font-size:11px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--kymi-text);margin-bottom:16px;}
.filter-option{display:flex;align-items:center;gap:10px;margin-bottom:10px;cursor:pointer;font-size:14px;color:var(--kymi-muted);transition:color .2s;}
.filter-option:hover{color:var(--kymi-text)}
.filter-check{width:16px;height:16px;border:0.5px solid var(--kymi-border2);display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--kymi-surface2);font-size:11px; color: transparent;}
.filter-check.checked{background:var(--kymi-hot);border-color:var(--kymi-hot);color:#fff}
.color-dot{width:20px;height:20px;border-radius:50%;border:0.5px solid var(--kymi-border2)}

.woocommerce-breadcrumb { display: none !important; }
.woocommerce-products-header { display: none; }
.woocommerce-result-count { font-size: 13px; color: var(--kymi-muted); float: left; margin-top: 10px; }
.woocommerce-ordering select { background: var(--kymi-surface); border: 0.5px solid var(--kymi-border2); color: var(--kymi-text); padding: 8px 14px; font-family: 'Jost', sans-serif; font-size: 13px; outline: none; cursor: pointer; float: right; margin-bottom: 20px; }
.woocommerce ul.products { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 16px !important; clear: both; }
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none !important; }
.woocommerce ul.products li.product { width: 100% !important; margin: 0 !important; float: none !important; background: var(--kymi-surface); transition: transform .3s; border: 0.5px solid var(--kymi-border); border-radius: 4px; overflow: hidden; }
.woocommerce ul.products li.product:hover { transform: scale(1.02); box-shadow:0 8px 32px rgba(0,0,0,0.08); }
.woocommerce ul.products li.product img { margin-bottom: 0 !important; width: 100%; aspect-ratio: 3/4; object-fit: cover; }
.woocommerce ul.products li.product h2, .woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 14px !important; font-weight: 400 !important; color: var(--kymi-text) !important; padding: 16px 16px 8px 16px !important; margin: 0 !important; }
.woocommerce ul.products li.product .price { font-size: 15px !important; font-weight: 500 !important; background: var(--grad2); -webkit-background-clip: text; -webkit-text-fill-color: transparent; padding: 0 16px 16px 16px !important; margin: 0 !important; }
.woocommerce ul.products li.product .button { background: var(--kymi-surface2) !important; color: var(--kymi-text) !important; font-family: 'Jost', sans-serif !important; font-size: 11px !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; border-radius: 0 !important; width: 100%; margin: 0 !important; padding: 14px !important; text-align: center; display: block; transition: all 0.3s !important; }
.woocommerce ul.products li.product .button:hover { background: var(--kymi-hot) !important; color: #fff !important; }

@media (max-width: 900px) {
    .listing-layout { grid-template-columns: 1fr !important; }
    .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ===== DARK HEADER OVERRIDES (Degradê Noturno) ===== */

/* 1. O Fundo Degradê Escuro no Cabeçalho */
.site-header {
  position: fixed !important; 
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 9999 !important; /* <--- O CONSERTO ESTÁ AQUI */
  background: linear-gradient(90deg, #071521 0%, #050505 50%, #160524 100%) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: none !important;
}

/* 2. Clareando os Textos do Menu */
.nav-link { 
  color: rgba(255, 255, 255, 0.7) !important; 
}
.nav-link:hover, .nav-link.active { 
  color: #ffffff !important; 
}

/* 3. Clareando os Ícones (Favoritos, Sacola, Entrar) */
.icon-btn { 
  color: rgba(255, 255, 255, 0.8) !important; 
}
.icon-btn:hover { 
  color: #ffffff !important; 
}

/* 4. Barra de Busca Destacada (Branca Premium) */
.search-bar { 
  background: rgba(255, 255, 255, 0.95) !important; 
  border: 1px solid rgba(255, 255, 255, 0.2) !important; 
}
.search-bar input { 
  color: #111111 !important; /* Texto escuro ao digitar */
  font-weight: 500 !important;
}
.search-bar input::placeholder { 
  color: #777777 !important; /* Texto cinza escuro no placeholder */
}

/* 5. Linhas Degradê emoldurando o Menu (Top: Normal | Bottom: Invertido) */
.site-nav {
  position: relative; /* Necessário para as linhas se apoiarem aqui */
  padding: 14px 0 !important; 
  margin-top: 16px;
  border: none !important; /* Removemos a borda antiga para usar o novo método */
}

/* Linha Superior (Rosa -> Roxo -> Azul) */
.site-nav::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, #e8145a, #7b1fd4, #008fc4);
}

/* Linha Inferior (Azul -> Roxo -> Rosa - INVERTIDA) */
.site-nav::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, #008fc4, #7b1fd4, #e8145a);
}

/* ===== FOOTER PREMIUM (Degradê Noturno Corrigido) ===== */
.site-footer {
  /* 1. Ângulo em 90deg (reto) e cores puxadas mais para o centro */
  background: linear-gradient(90deg, #0a1b2b 0%, #030303 20%, #030303 80%, #1a082b 100%) !important;
  
  /* 2. Linha super fina no topo */
  border-top: 1px solid rgba(255, 255, 255, 0.04) !important;
  
  /* 3. Ajuste do respiro */
  padding-top: 40px !important; 
}