/* Brincadeira Especial: ecommerce reference layer. */
:root {
  --ink: #093440;
  --yellow: #ffb44a;
  --cyan: #00a0ca;
  --accent-text: #007b99;
  --line: #dce6e9;
}
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
input, textarea, select { font: inherit; color: var(--ink); }
button, a { touch-action: manipulation; }
.button, button { min-height: 42px; }
.section-pad { padding: 50px 5%; }
.section-pad > .eyebrow { color: var(--accent-text); }
.section-pad > h2 { margin-bottom: 26px; }
.site-header { max-width: 1440px; padding: 14px 4%; gap: 24px; }
.site-header nav { gap: 23px; align-items: center; }
.site-header nav > a, .nav-products summary { font-size: 14px; font-weight: 600; white-space: nowrap; }
.site-header nav a[aria-current] { color: var(--accent-text); border-bottom: 2px solid var(--cyan); }
.header-search { display: flex; border: 1px solid var(--line); border-radius: 30px; padding: 0 8px 0 15px; align-items: center; }
.header-search input { width: 165px; min-width: 0; border: 0; background: transparent; font-size: 13px; padding: 11px 0; }
.header-search button { border: 0; background: transparent; padding: 9px; color: var(--ink); }
.header-search svg { width: 18px; height: 18px; }
.header-actions { gap: 16px; }
.nav-products { position: relative; }
.nav-products summary { list-style: none; cursor: pointer; padding: 14px 0; }
.nav-products summary::-webkit-details-marker { display: none; }
.submenu { position: absolute; z-index: 10; top: 48px; left: -18px; width: 215px; display: flex; flex-direction: column; background: white; border: 1px solid var(--line); box-shadow: 0 10px 35px #09344018; border-radius: 12px; padding: 8px; }
.submenu a { padding: 12px; border-radius: 7px; font-size: 14px; }
.submenu a:hover { background: var(--soft); }
.home-hero { min-height: 480px; }
.home-hero h1 { font-size: clamp(38px, 4vw, 58px); }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-ctas .button { padding: 14px 18px; gap: 14px; }
.values svg { width: 23px; height: 23px; color: var(--accent-text); }
.category-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin-top: 30px; }
.category-card { display: grid; grid-template-columns: .9fr 1fr; border: 1px solid var(--line); background: #f2f8fa; border-radius: 22px; overflow: hidden; box-shadow: 0 5px 15px #09344006; }
.category-card:nth-child(2) { background: #fff4e2; }
.category-card > img { width: 100%; height: 100%; object-fit: cover; min-height: 290px; }
.category-card > div { padding: 30px 26px; }
.category-card .eyebrow { font-size: 11px; letter-spacing: 1px; }
.category-card h3 { font-size: 25px; letter-spacing: -1px; margin: 14px 0; }
.category-card p { color: #536b72; font-size: 15px; line-height: 1.8; }
.category-card strong { font-size: 14px; }
.category-card:hover { border-color: var(--cyan); }
.featured { padding-top: 20px; }
.featured .title-row a { font-size: 14px; font-weight: 600; }
.demo-notice { background: #fff5e4; border-left: 3px solid var(--yellow); color: #66513a; font-size: 13px; line-height: 1.7; padding: 12px 16px; border-radius: 0 8px 8px 0; margin: 20px 0; }
.store-product { border: 1px solid var(--line); border-radius: 16px; overflow: hidden; padding: 12px; display: flex; flex-direction: column; box-shadow: 0 6px 22px #09344005; background: white; }
.store-product .product-image { height: 180px; border-radius: 9px; }
.store-product .category { margin-top: 18px; font-size: 12px; }
.product-title { padding: 0; border: 0; background: none; text-align: left; color: var(--ink); font: inherit; font-weight: 700; min-height: 0; line-height: 1.4; }
.store-product p { font-size: 14px; line-height: 1.75; margin-top: 5px; }
.price { display: flex; flex-direction: column; gap: 3px; margin-top: auto; padding: 14px 0; }
.price strong { font-family: 'Manrope',sans-serif; font-size: 23px; letter-spacing: -.6px; }
.price small { color: #687b80; font-size: 12px; }
.buy { width: 100%; padding: 12px; justify-content: space-between; }
.benefits { background: #f1f8fa; margin: 20px 5%; border-radius: 26px; padding: 45px 4%; }
.benefit-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; }
.benefit-grid article { padding: 15px 10px; }
.benefit-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: white; color: var(--accent-text); }
.benefit-icon svg, .company-values svg { width: 26px; height: 26px; }
.benefit-grid h3 { font-size: 18px; margin: 18px 0 10px; }
.benefit-grid p { font-size: 15px; color: #536b72; line-height: 1.85; margin: 0; }
.testimonials { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; margin-top: 26px; }
.testimonial { border: 1px solid var(--line); border-radius: 16px; padding: 28px; }
.sample-label { color: #687b80; font-size: 11px; letter-spacing: 1px; }
.testimonial > p { font-size: 19px; line-height: 1.7; margin: 24px 0; }
.testimonial > div { display: flex; align-items: center; gap: 12px; }
.avatar { display: grid; place-items: center; background: #ffdfae; border-radius: 50%; width: 43px; height: 43px; font-weight: 700; }
.testimonial:nth-child(2) .avatar { background: #d6eff5; }
.testimonial:nth-child(3) .avatar { background: #e1e9ec; }
.testimonial strong, .testimonial small { display: block; font-size: 14px; }
.testimonial small { font-size: 12px; margin-top: 5px; color: #687b80; }
.how { border-top: 1px solid var(--line); margin-top: 10px; }
.how-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; }
.how-grid article { background: #f2f8fa; border-radius: 16px; padding: 28px; }
.how-grid article:nth-child(2) { background: #fff5e7; }
.how h3 { margin: 0 0 18px; font-size: 20px; }
.how ol { padding-left: 22px; margin-bottom: 23px; }
.how li { padding: 5px 0 5px 7px; font-size: 16px; }
.how li::marker { font-weight: 700; color: var(--accent-text); }
.how a { font-size: 14px; font-weight: 700; }
.newsletter { margin: 5px 5% 55px; padding: 35px 40px; border-radius: 22px; display: grid; grid-template-columns: 1fr 1fr; gap: 35px; align-items: center; background: var(--yellow); }
.newsletter h2 { font-size: 28px; }
.newsletter p { font-size: 15px; line-height: 1.8; }
.newsletter .eyebrow { font-size: 11px; }
.email-row { display: flex; gap: 9px; }
.email-row input { min-width: 0; flex: 1; border: 1px solid #e0e8ea; background: white; padding: 13px 14px; border-radius: 8px; font-size: 16px; }
.email-row button { padding: 13px 16px; white-space: nowrap; }
.consent { display: block; font-size: 12px; margin-top: 13px; line-height: 1.7; }
.consent a { text-decoration: underline; }
.form-status { font-size: 12px !important; margin-bottom: 0; }
.exact-story { max-width: 900px; padding: 10px 5% 35px; margin: auto; }
.exact-story p { font-size: 18px; color: #526a71; line-height: 1.95; margin: 0 0 28px; }
.company-values { background: #f1f8fa; }
.company-values article { background: white; border-radius: 14px; padding: 28px; }
.timeline ol { display: grid; grid-template-columns: repeat(3,1fr); gap: 25px; list-style: none; padding: 0; margin-top: 30px; }
.timeline li { border-top: 3px solid var(--yellow); padding: 22px 20px 0 0; }
.timeline li > span { font-size: 12px; color: var(--accent-text); letter-spacing: 1px; font-weight: 700; }
.timeline h3 { font-size: 21px; }
.timeline p { font-size: 16px; line-height: 1.8; color: #526a71; }
.catalog-intro { padding: 32px 5% 35px; }
.catalog-intro h1 { font-size: 43px; line-height: 1.2; letter-spacing: -1.5px; }
.catalog-intro > p { color: #526a71; font-size: 16px; line-height: 1.8; }
.catalog-layout { display: grid; grid-template-columns: 235px minmax(0,1fr); gap: 30px; padding: 0 5% 60px; }
.filter-panel { background: #f3f8fa; border: 1px solid var(--line); border-radius: 16px; padding: 23px; align-self: start; }
.filter-panel h2 { font-size: 21px; }
.text-button { background: none; border: 0; padding: 0; text-decoration: underline; color: var(--accent-text); font-size: 13px; }
.filter-panel label { display: block; font-size: 14px; font-weight: 700; margin: 23px 0 9px; }
.filter-panel input, .filter-panel select { width: 100%; background: white; border: 1px solid #cddde1; border-radius: 7px; padding: 11px; font-size: 14px; }
.filter-help { font-size: 12px; line-height: 1.8; color: #687b80; margin: 24px 0 0; }
.catalog-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; font-size: 14px; }
.catalog-toolbar select { border: 1px solid var(--line); padding: 10px; border-radius: 8px; background: white; font-size: 14px; margin-left: 6px; }
.catalog-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.catalog-grid .product-image { height: 180px; }
.catalog-grid .product h3 { font-size: 18px; }
.contact-social { padding: 0 8% 40px; }
.social-links { display: flex; flex-direction: row; gap: 12px; padding: 0; }
.social-links a { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 50%; }
.social-links svg { width: 18px; height: 18px; }
.blog-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 25px; padding-top: 0; }
.blog-card { border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.blog-card img { width: 100%; height: 210px; object-fit: cover; }
.blog-card a > div { padding: 25px; }
.blog-card .eyebrow { font-size: 11px; color: var(--accent-text); }
.blog-card h2 { font-size: 23px; letter-spacing: -.7px; }
.blog-card p { font-size: 16px; line-height: 1.85; color: #526a71; }
.blog-card strong { font-size: 14px; }
.article-page { max-width: 880px; padding: 40px 5% 65px; margin: auto; }
.article-page h1 { font-size: 43px; letter-spacing: -1.7px; line-height: 1.2; }
.article-page h2 { font-size: 27px; margin-top: 30px; }
.article-page p { font-size: 17px; color: #526a71; line-height: 1.9; }
.article-page p a { text-decoration: underline; }
.article-page img { width: 100%; height: auto; border-radius: 18px; margin: 20px 0; }
.article-page .button { margin-top: 25px; }
.site-footer { padding-bottom: 60px; }
.site-footer .footer-brand { display: block; }
.site-footer .social-links { padding: 0; display: flex; }
.site-footer .footer-commerce > div { padding: 0; gap: 4px; }
.provider { font-size: 24px; letter-spacing: -1px; }
.provider.mp { color: #007d9c; }
.provider.correios { color: #004d7a; }
.footer-commerce small { font-size: 12px; }
.floating-whatsapp { position: fixed; right: 24px; bottom: 22px; width: 53px; height: 53px; border-radius: 50%; display: grid; place-items: center; color: white; background: #087c48; box-shadow: 0 6px 20px #09344025; z-index: 15; }
.floating-whatsapp svg { width: 28px; height: 28px; }
.floating-whatsapp:hover { background: #06663b; }
#product-dialog .button + .button { margin-top: 12px; }
#product-dialog .price { padding: 0; }
#product-dialog .price strong { font-size: 28px; }
.cart-line { display: grid; grid-template-columns: 72px 1fr auto; gap: 15px; align-items: start; padding: 20px 0; border-bottom: 1px solid var(--line); }
.cart-line > img { width: 72px; height: 65px; object-fit: cover; border-radius: 8px; margin: 0; }
.cart-line strong { font-size: 14px; }
.cart-line small { display: block; font-size: 12px; color: #647b83; margin: 6px 0; }
.quantity { display: flex; align-items: center; gap: 9px; margin-top: 9px; }
.quantity button { min-height: 30px; height: 30px; min-width: 30px; border: 1px solid var(--line); border-radius: 6px; background: white; color: var(--ink); }
.quantity .remove { font-size: 12px; padding: 0 5px; border: 0; text-decoration: underline; }
.total-row { display: flex; justify-content: space-between; gap: 15px; padding: 24px 0 10px; font-size: 17px; }
.small-note { font-size: 13px; line-height: 1.8; color: #637b82; }
.checkout-page { max-width: 900px; margin: auto; padding: 35px 5% 60px; }
.checkout-page h1 { font-size: 42px; letter-spacing: -1.6px; }
.checkout-page > section { padding: 28px; margin-top: 30px; border: 1px solid var(--line); border-radius: 15px; }
.checkout-page section h2 { font-size: 25px; }
.checkout-page section p { font-size: 16px; line-height: 1.85; color: #526a71; }
#shipping-form label { display: block; margin-bottom: 10px; font-size: 14px; }
#real-product-links { display: flex; flex-direction: column; gap: 15px; margin: 18px 0 25px; font-weight: 600; font-size: 14px; }
@media (max-width: 1200px) {
  .site-header { gap: 15px; padding-inline: 4%; }
  .site-header nav { gap: 15px; }
  .header-search input { width: 130px; }
  .brand img { width: 140px; }
  .category-card { grid-template-columns: 1fr; }
  .category-card > img { height: 220px; min-height: 0; }
  .category-card > div { padding: 25px; }
  .catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 1050px) {
  .site-header { flex-wrap: wrap; }
  .menu-toggle { display: flex; align-items: center; gap: 7px; order: 3; border: 1px solid var(--line); border-radius: 8px; background: white; padding: 9px; color: var(--ink); }
  .menu-toggle svg { width: 22px; height: 22px; }
  .header-actions { order: 2; margin-left: auto; }
  #main-nav { order: 4; display: none; flex-direction: column; align-items: stretch; width: 100%; gap: 0; }
  #main-nav.open { display: flex; }
  #main-nav > a, .nav-products summary { font-size: 16px; padding: 14px 10px; border-bottom: 1px solid var(--line); }
  .submenu { position: static; box-shadow: none; width: 100%; background: #f3f8fa; margin-bottom: 12px; }
  .submenu a { padding: 12px 22px; }
  .benefit-grid { gap: 20px; }
  .testimonials { gap: 15px; }
  .testimonial { padding: 22px; }
  .newsletter { gap: 22px; padding: 30px; }
  .newsletter h2 { font-size: 25px; }
  .email-row { flex-wrap: wrap; }
  .email-row input { flex-basis: 170px; }
  .blog-grid { gap: 18px; }
}
@media (max-width: 760px) {
  .section-pad { padding: 35px 5%; }
  .site-header { padding: 8px 5%; }
  .site-header .brand img { width: 130px; height: 83px; }
  .header-search { padding-left: 10px; }
  .header-search input { width: 115px; font-size: 13px; }
  .menu-toggle span { display: none; }
  .header-actions { gap: 10px; }
  .hero-ctas { gap: 10px; }
  .hero-ctas .button { width: 100%; }
  .home-hero h1 { font-size: 42px; }
  .home-hero .hero-note { display: block; margin-top: 17px; }
  .values { font-size: 12px; }
  .values span { gap: 7px; }
  .category-grid { grid-template-columns: 1fr; gap: 20px; }
  .category-card { grid-template-columns: 1fr 1fr; }
  .category-card > img { height: 100%; min-height: 275px; }
  .category-card > div { padding: 24px 20px; }
  .category-card h3 { font-size: 23px; }
  .featured .title-row { flex-direction: column; gap: 4px; }
  .featured .products { gap: 16px 12px; }
  .store-product .product-image { height: 160px; }
  .store-product { padding: 9px; }
  .store-product h3 { font-size: 17px; }
  .store-product p { font-size: 14px; }
  .benefit-grid { grid-template-columns: 1fr 1fr; gap: 20px; }
  .benefit-grid article { padding: 6px; }
  .benefit-grid h3 { font-size: 17px; }
  .benefits { padding: 30px 6%; }
  .testimonials, .how-grid, .newsletter { grid-template-columns: 1fr; }
  .testimonial { padding: 25px; }
  .testimonials { gap: 18px; }
  .newsletter { margin-bottom: 35px; padding: 28px 24px; }
  .newsletter .email-row { flex-wrap: nowrap; }
  .newsletter .email-row input { width: 100px; flex-basis: 100px; }
  .newsletter button { padding-inline: 12px; font-size: 13px; }
  .exact-story p { font-size: 16px; }
  .company-values .benefit-grid { grid-template-columns: 1fr; }
  .company-values article { padding: 24px; }
  .timeline ol { grid-template-columns: 1fr; gap: 24px; }
  .catalog-intro h1 { font-size: 35px; }
  .catalog-layout { grid-template-columns: 1fr; gap: 24px; }
  .filter-panel { padding: 18px; }
  #catalog-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; }
  #catalog-filters > .title-row, #catalog-filters > .filter-help { grid-column: 1/-1; }
  #catalog-filters > .title-row { align-items: center; }
  #catalog-filters label { grid-column: 1; margin: 0; align-self: center; }
  #catalog-filters input, #catalog-filters select { grid-column: 2; font-size: 14px; min-width: 0; }
  .filter-help { margin-top: 12px; }
  .catalog-grid { gap: 15px 12px; }
  .catalog-grid .product-image { height: 170px; }
  .catalog-toolbar { flex-wrap: wrap; font-size: 13px; gap: 10px; }
  .catalog-toolbar select { font-size: 13px; }
  .blog-grid { grid-template-columns: 1fr; }
  .blog-card img { height: auto; aspect-ratio: 3/2; }
  .article-page h1 { font-size: 35px; }
  .article-page h2 { font-size: 24px; }
  .site-footer { padding-bottom: 65px; }
  .floating-whatsapp { right: 16px; bottom: 16px; width: 49px; height: 49px; }
  .cart-line { grid-template-columns: 1fr auto; gap: 8px; }
  .cart-line > img { display: none; }
  .cart-line strong { font-size: 14px; }
  .checkout-page h1 { font-size: 34px; }
  .checkout-page > section { padding: 20px; }
}
@media (max-width: 450px) {
  .site-header .brand img { width: 120px; }
  .header-search { display: none; }
  .site-header::after { content: none; }
  .category-card { grid-template-columns: 1fr; }
  .category-card > img { min-height: 0; height: 230px; }
  .benefit-grid { grid-template-columns: 1fr; }
  .store-product .product-image, .catalog-grid .product-image { height: 130px; }
  .product-image .tag { font-size: 11px; padding: 5px 7px; left: 7px; top: 7px; }
  .price strong { font-size: 21px; }
  .price small { font-size: 11px; line-height: 1.5; }
  .buy { font-size: 13px; }
  .newsletter .email-row { flex-wrap: wrap; }
  .newsletter .email-row input, .newsletter .email-row button { width: 100%; flex-basis: 100%; }
  .newsletter .email-row button { font-size: 14px; }
}
@media (prefers-reduced-motion: no-preference) {
  .category-card, .store-product, .blog-card { transition: border-color .2s, box-shadow .2s; }
  .store-product:hover, .blog-card:hover { box-shadow: 0 10px 28px #09344010; }
}
.mobile-search { display: none; }
@media (max-width: 450px) {
  .mobile-search { display: grid; gap: 9px; padding: 15px 10px; }
  .mobile-search label { font-size: 14px; font-weight: 600; }
  .mobile-search input { min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: white; font-size: 16px; }
}
