/*
 * NOS PANOS 3.2 — VITRINE SPORT / STREET
 * Camada exclusivamente visual sobre a versão 3.1.
 * Não altera carrinho, login, checkout WhatsApp, D1, R2 nem regras de estoque.
 * Inspiração: lojas modernas de sportswear; identidade, nomes e marcas próprios.
 */
:root {
  --ink: #111111;
  --charcoal: #181818;
  --black: #101010;
  --cream: #ffffff;
  --paper: #ffffff;
  --lime: #111111;
  --olive: #dedede;
  --dim: #747474;
  --border: #e8e8e8;
  --font: 'DM Sans', Arial, Helvetica, sans-serif;
  --display: 'DM Sans', Arial, Helvetica, sans-serif;
}
html { scroll-padding-top: 94px; }
body { background: #fff; color: #101010; }
body :focus-visible { outline: 3px solid #777; outline-offset: 3px; }
.container { width: min(100% - 64px, 1360px); }

/* Faixa e navegação: esportivo, limpo, sem cores neon. */
.announcement { background:#111; color:#fff; height:32px; letter-spacing:.08em; font-size:10px; font-weight:700; }
.announcement .pulse-dot { background:#fff; box-shadow: 0 0 0 3px #ffffff25; }
.announcement-end { color:#e4e4e4; opacity:.82; }
.header { background:rgba(255,255,255,.97); border-bottom:1px solid #eaeaea; box-shadow:none; backdrop-filter:blur(18px); }
.header-row { height:75px; }
.logo { gap:10px; }
.logo-mark { width:46px; height:46px; border-radius:50%; background:#111; color:#fff; font-family:var(--font); letter-spacing:-2px; font-weight:900; }
.logo-mark-dot { color:#fff; }
.logo-text strong { font-weight:900; letter-spacing:-1.25px; font-size:clamp(17px,1.75vw,22px); }
.logo-text small { font-size:8px; color:#666; letter-spacing:.15em; font-weight:700; }
.nav { gap:30px; }
.nav a { font-size:13px; font-weight:700; letter-spacing:0; }
.nav a:hover { color:#777; }
.icon-button { border:0; border-radius:50%; background:#f6f6f6; color:#111; width:45px; height:45px; }
.icon-button:hover { background:#ebebeb; border-color:transparent; }
.cart-count { background:#111; color:#fff; }

/* Hero editorial: sem molduras inclinadas ou elementos neon. */
.hero { background:#f4f4f4; color:#111; }
.hero-grid { min-height:530px; grid-template-columns:1fr .98fr; gap:34px; }
.hero-copy { padding:74px 0 74px; }
.overline { color:#606060; font-size:11px; letter-spacing:.15em; }
.overline .line { background:#111; }
.overline-end { color:#777; }
.hero h1 { font-size:clamp(57px,6vw,88px); letter-spacing:-.075em; line-height:.96; margin:22px 0 22px; font-weight:900; }
.hero h1 em { color:#111; font-style:normal; }
.hero h1 span { color:#111; -webkit-text-stroke:0; text-stroke:0; }
.hero-copy>p { color:#555; max-width:460px; font-size:15px; line-height:1.7; }
.hero-buttons { margin-top:28px; }
.button { border-radius:999px; font-size:12px; font-weight:800; padding:14px 25px; letter-spacing:0; min-height:49px; }
.button-lime,.button-dark { background:#111; color:#fff; }
.button-lime:hover,.button-dark:hover { background:#383838; }
.button-outline { color:#111; border-color:#111; background:transparent; }
.button-outline:hover { background:#111; color:#fff; }
.hero-caption { color:#666; margin-top:28px; }
.mini-star { color:#111; }
.hero-visual { min-height:525px; }
.hero-visual:before { inset:22px 0 22px 0; border-radius:0; background:#e6e6e6; opacity:1; }
.hero-orbit,.hero-stamp,.hero-corner { display:none; }
.hero-panel { width:100%; height:480px; border:0; border-radius:2px; box-shadow:none; transform:none; background:#dedede; }
.hero-panel img { object-fit:cover; }
.hero-panel video { background:#dedede; }
.hero-runner { height:42px; background:#161616; color:white; }
.hero-runner span { font-family:var(--font); font-size:14px; font-weight:800; letter-spacing:.08em; }
.hero-runner .runner-star { font-size:15px; }

/* Seções: tipografia marcante, respiro e filtros simples. */
.section { padding:72px 0; }
.section-head { margin-bottom:27px; gap:24px; }
.eyebrow { font-size:11px; font-weight:800; letter-spacing:.11em; color:#737373; margin-bottom:11px; }
.eyebrow span { color:#111; }
.section-head h2 { color:#101010; font-size:clamp(31px,3.8vw,50px); font-weight:900; letter-spacing:-.07em; line-height:1.08; }
.section-head h2 span { color:#101010; }
.section-head>p { color:#646464; font-size:14px; line-height:1.65; }
.brands-section { background:#fff; }
.brands-grid { gap:12px; }
.brand-tile { height:136px; background:#f5f5f5; border:0; border-radius:12px; padding:20px; transition:background .2s,transform .2s; }
.brand-tile:before { display:none; }
.brand-tile strong { color:#161616; font-size:clamp(25px,3.3vw,43px); font-weight:900; letter-spacing:-.055em; }
.brand-num { color:#777; letter-spacing:.09em; }
.brand-arrow { color:#111; }
.brand-tile:hover,.brand-tile:focus-visible { background:#181818; color:#fff; border-color:#181818; }
.brand-tile:hover strong,.brand-tile:hover .brand-arrow,.brand-tile:focus-visible strong,.brand-tile:focus-visible .brand-arrow { color:#fff; }
.brand-tile:hover .brand-num,.brand-tile:focus-visible .brand-num { color:#ddd; }
.brand-disclaimer { color:#777; font-size:11px; }
.collection-section { background:#fff; padding-top:65px; }
.collection-head { margin-bottom:26px; }
.np-category-tabs { margin:0 0 16px; gap:8px; }
.np-category-chip { background:#f3f3f3; color:#222; border:1px solid transparent; padding:11px 18px; border-radius:999px; font-size:12px; letter-spacing:0; }
.np-category-chip.active,.np-category-chip:hover { background:#111; border-color:#111; color:#fff; }
.catalog-toolbar { gap:22px; margin-bottom:19px; }
.filter-chips { gap:7px; }
.filter-chip { background:#f5f5f5; border:1px solid #eee; color:#333; border-radius:999px; font-size:12px; padding:10px 16px; }
.filter-chip.active,.filter-chip:hover { background:#111; border-color:#111; color:#fff; }
.search-wrap { background:#f5f5f5; padding:0 15px; border:1px solid #efefef; border-radius:999px; min-height:43px; max-width:330px; }
.search-wrap input { font-size:13px; }
.search-wrap input::placeholder { color:#777; }
.np-catalog-hierarchy { background:#fafafa; border:1px solid #ededed; border-radius:14px; padding:17px 19px; margin:0 0 26px; }
.np-catalog-hierarchy label { color:#4f4f4f; }
.np-catalog-hierarchy select { border-color:#d8d8d8; background:#fff; color:#111; border-radius:9px; }
#hierarchySummary { color:#666; }
.catalog-notice { background:#f8f8f8; border-color:#e6e6e6; border-radius:9px; color:#555; }
.catalog-notice strong { color:#111; }
.notice-dot { background:#111; }

/* Vitrine: fotos grandes e duas colunas no celular. */
.products-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px 20px; align-items:start; }
.product-card { background:#fff; border:0; border-radius:0; overflow:visible; box-shadow:none; min-width:0; }
.product-card:hover { transform:none; box-shadow:none; }
.product-media { aspect-ratio:4/5; background:#f1f1f1; border-radius:8px; overflow:hidden; }
.product-media .product-img { object-fit:cover; }
.product-media .product-img-back { transform:scale(1.025); }
.product-card:hover .product-media img { transform:none; }
.product-card-badge { top:12px; left:12px; border-radius:4px; padding:7px 10px; background:#fff; color:#111; box-shadow:0 2px 12px #0000000b; font-size:10px; font-weight:900; letter-spacing:.035em; }
.np-discount-badge { top:auto; bottom:14px; left:12px; background:#111; color:#fff; padding:8px 11px; border-radius:4px; letter-spacing:.02em; font-size:11px; }
.product-media-note { background:#fff; color:#555; border-radius:3px; left:12px; bottom:48px; font-size:9px; }
.product-media .media-flip-hint { top:12px; right:10px; border-radius:3px; background:#111e; color:#fff; font-size:9px; }
.product-media .photo-nav { right:12px; bottom:12px; }
.product-media .photo-nav button { width:36px; height:36px; border-radius:50%; background:#fff; box-shadow:0 3px 15px #0002; font-size:22px; }
.product-media .photo-nav button:hover { background:#ededed; }
.product-detail,.product-card .product-detail { padding:15px 2px 0; }
.product-meta { font-size:11px; font-weight:800; letter-spacing:.02em; color:#777; }
.product-name { font-family:var(--font); font-size:clamp(16px,1.75vw,22px); font-weight:800; letter-spacing:-.045em; line-height:1.32; margin:7px 0 7px; min-height:0; }
.product-description { color:#777; font-size:12px; line-height:1.55; min-height:0; margin:0 0 10px; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.np-model-line { color:#666; font-size:10px; letter-spacing:.025em; margin:0 0 10px; }
.np-availability { border-radius:4px; }
.product-size-label { color:#666; font-size:10px; letter-spacing:.04em; }
.size-row { display:flex; gap:7px; margin:9px 0 16px; }
.size-button { min-width:37px; min-height:37px; padding:7px; border:1px solid #ddd; border-radius:8px; color:#111; font-size:12px; font-weight:800; }
.size-button.selected { color:#fff; background:#111; border-color:#111; }
.size-button:disabled { background:#f4f4f4; color:#a5a5a5; }
.product-purchase { display:flex; flex-wrap:wrap; gap:11px; border-top:0; padding-top:0; align-items:flex-end; }
.product-price { flex:1 1 100%; }
.product-price>small { color:#777; font-size:10px; letter-spacing:.025em; margin-bottom:4px; }
.product-price strong { font-family:var(--font); font-size:clamp(20px,2vw,25px); letter-spacing:-.045em; font-weight:900; }
.product-price strong.consult-price { font-size:16px; }
.np-old-price { color:#888; font-size:12px; line-height:1.35; }
.product-action { display:block; width:100%; min-height:45px; border:0; border-radius:999px; background:#111; color:#fff; padding:12px 16px; white-space:normal; font-size:12px; letter-spacing:.01em; font-weight:800; text-align:center; }
.product-action:hover { background:#444; }
.product-action.consult-action { background:#111; color:#fff; }
.product-action:disabled { background:#eee; color:#888; }
.catalog-bottom { color:#aaa; }
.catalog-bottom span { color:#111; }
.empty-state { border-radius:15px; border-color:#ddd; }
.empty-mark { color:#aaa; }

/* Demais seções públicas com a mesma linguagem. */
.story-section { background:#161616; color:#fff; }
.story-section:before { display:none; }
.story-content h2 em { color:#fff; }
.story-link:hover { color:#ddd; }
.contact-banner { background:#f3f3f3; color:#111; }
.contact-row h2 { color:#111; }
.footer { background:#111; color:#f6f6f6; }
.footer-logo span { color:#fff; }

/* Pequeno acabamento consistente no painel, sem alterar sua funcionalidade. */
.admin-modal { border-radius:16px; overflow:hidden; }
.admin-tab.active { border-color:#111; color:#111; }
.np-admin-group-title { background:#f4f4f4; border-left-color:#222; color:#111; }
.np-admin-section .np-product-form { border-color:#e5e5e5; box-shadow:0 8px 28px #00000008; }
.np-admin-section-heading h3 { color:#111; }
.np-admin-hint { background:#f7f7f7; border-color:#e7e7e7; color:#4e4e4e; }

@media(max-width:1020px) {
  .hero-grid { min-height:495px; }
  .hero h1 { font-size:clamp(50px,6vw,72px); }
  .hero-panel { height:430px; }
  .hero-visual { min-height:495px; }
  .products-grid { gap:32px 16px; }
}
@media(max-width:800px) {
  .container { width:min(100% - 36px,1360px); }
  .header-row { height:67px; }
  .nav { background:#fff; top:67px; border-color:#eee; }
  .nav a { border-color:#eee; }
  .hero-grid { grid-template-columns:1fr; gap:0; }
  .hero-copy { padding:42px 0 21px; }
  .hero h1 { font-size:clamp(54px,9.5vw,78px); }
  .hero-visual { min-height:340px; }
  .hero-visual:before { inset:0 0 22px; }
  .hero-panel { width:100%; height:320px; }
  .section { padding:58px 0; }
  .products-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px 15px; }
  .brand-tile { height:115px; padding:15px; }
  .brand-tile strong { font-size:30px; }
  .catalog-toolbar { flex-direction:column; align-items:stretch; gap:12px; }
  .filter-chips { flex-wrap:nowrap; overflow-x:auto; padding:0 0 7px; }
  .search-wrap { width:100%; max-width:none; }
}
@media(max-width:550px) {
  .container { width:calc(100% - 28px); }
  .announcement { height:30px; font-size:9px; letter-spacing:0; padding-inline:8px; }
  .announcement-end { display:none; }
  .header-row { gap:8px; height:61px; }
  .logo-mark { width:37px; height:37px; font-size:18px; }
  .logo-text strong { font-size:16px; letter-spacing:-.8px; }
  .logo-text small { font-size:6px; letter-spacing:.08em; }
  .nav { top:61px; }
  .header-actions { gap:5px; }
  .icon-button { width:39px; height:39px; }
  .hero { overflow:visible; }
  .hero-copy { padding:35px 0 21px; }
  .overline { font-size:9px; letter-spacing:.05em; }
  .overline-end { display:none; }
  .hero h1 { font-size:clamp(40px,10.8vw,59px); line-height:.98; letter-spacing:-.063em; margin:20px 0 13px; }
  .hero h1 span { -webkit-text-stroke:0; }
  .hero-copy>p { max-width:420px; font-size:13px; line-height:1.65; }
  .hero-buttons { flex-direction:row; align-items:stretch; gap:8px; margin-top:22px; }
  .hero-buttons .button { flex:1 1 0; min-width:0; padding:12px 8px; gap:5px; font-size:10px; }
  .hero-buttons .button span { font-size:14px; }
  .hero-caption { display:none; }
  .hero-visual { min-height:238px; }
  .hero-visual:before { inset:0 0 8px; }
  .hero-panel { height:230px; width:100%; border:0; }
  .hero-runner { height:34px; }
  .hero-runner span { font-size:11px; }
  .section { padding:46px 0; }
  .section-head { margin-bottom:20px; gap:10px; }
  .eyebrow { font-size:9px; letter-spacing:.08em; margin-bottom:9px; }
  .section-head h2 { font-size:clamp(27px,8vw,36px); letter-spacing:-.065em; }
  .section-head>p { font-size:12px; line-height:1.55; }
  .brands-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
  .brand-tile { height:79px; border-radius:8px; padding:10px 9px; }
  .brand-tile strong { font-size:clamp(15px,4.5vw,20px); letter-spacing:-.06em; }
  .brand-num { font-size:7px; letter-spacing:0; }
  .brand-arrow { font-size:13px; right:9px; bottom:7px; }
  .brand-disclaimer { font-size:10px; }
  .collection-section { padding-top:43px; }
  .np-category-tabs { flex-wrap:nowrap; overflow-x:auto; gap:7px; margin-bottom:12px; }
  .np-category-chip { padding:10px 12px; font-size:11px; flex:0 0 auto; }
  .filter-chip { padding:9px 12px; font-size:11px; }
  .np-catalog-hierarchy { padding:12px; border-radius:11px; gap:10px; margin-bottom:18px; }
  .np-catalog-hierarchy label { min-width:0; }
  .catalog-notice { padding:11px; font-size:10px; }
  .products-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px 12px; }
  .product-media { aspect-ratio:4/5; border-radius:7px; }
  .product-card-badge { font-size:8px; top:7px; left:7px; padding:5px 7px; }
  .np-discount-badge { top:auto; bottom:8px; left:7px; font-size:9px; padding:6px 7px; }
  .product-media-note { font-size:7px; left:6px; bottom:41px; max-width:calc(100% - 10px); }
  .product-media .media-flip-hint { display:none; }
  .product-media .photo-nav { right:6px; bottom:6px; gap:3px; }
  .product-media .photo-nav button { height:29px; width:29px; font-size:18px; }
  .product-detail,.product-card .product-detail { padding:11px 1px 0; }
  .product-meta { font-size:9px; line-height:1.2; letter-spacing:0; }
  .product-name { font-size:clamp(14px,4.2vw,17px); line-height:1.3; letter-spacing:-.04em; margin:6px 0 8px; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
  .product-description { display:none; }
  .np-model-line { font-size:9px; line-height:1.45; margin:0 0 7px; }
  .np-availability { font-size:9px; line-height:1.4; }
  .product-size-label { font-size:9px; line-height:1.4; }
  .size-row { flex-wrap:wrap; gap:4px; margin:8px 0 11px; }
  .size-button { min-width:29px; min-height:30px; border-radius:5px; font-size:10px; padding:5px 7px; }
  .product-purchase { gap:9px; }
  .product-price>small { font-size:8px; }
  .product-price strong { font-size:clamp(16px,4.8vw,21px); }
  .product-price strong.consult-price { font-size:13px; }
  .np-old-price { font-size:10px; }
  .product-action { min-height:40px; padding:10px 5px; font-size:10px; border-radius:999px; line-height:1.25; }
  .catalog-bottom { font-size:10px; }
  .story-grid { padding-block:40px; }
  .admin-modal { border-radius:0; }
}
@media(max-width:355px) {
  .container { width:calc(100% - 20px); }
  .logo-text strong { font-size:14px; }
  .logo-mark { width:35px; height:35px; }
  .hero h1 { font-size:38px; }
  .products-grid { gap:27px 10px; }
  .product-name { font-size:13px; }
  .size-button { min-width:27px; min-height:28px; }
  .product-action { font-size:9px; }
}