:root {
  --purple: #874182;
  --dark: #4c244b;
  --cream: #fff0d7;
  --peach: #dc8c78;
  --ink: #442641;
  --soft: #fffaf3;
  --line: #eadfd8;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--soft); color: var(--ink); font-family: "DM Sans", sans-serif; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }

.topbar { height: 32px; background: var(--dark); color: #f8eaf4; text-align: center; font-size: .65rem; letter-spacing: .14em; text-transform: uppercase; padding: 9px; }
.header { height: 128px; padding: 0 6vw; display: flex; align-items: center; gap: 2.5rem; background: white; position: sticky; top: 0; z-index: 20; border-bottom: 1px solid #eee7e1; }
.brand { width: 255px; height: 118px; overflow: visible; display: flex; align-items: center; }
.brand img { width: 100%; height: 100%; object-fit: contain; }
.nav { display: flex; gap: 2rem; margin-left: auto; }
.nav a { font-size: .82rem; font-weight: 700; }
.header-cta { background: var(--purple); color: white; padding: .8rem 1.1rem; font-size: .78rem; font-weight: 700; }
.header-cta span { margin-left: 1rem; }
.language-switch { display: flex; border: 1px solid #dacbd5; border-radius: 999px; padding: .18rem; background: #fffaf7; }
.lang { border: 0; border-radius: 999px; background: transparent; color: var(--dark); padding: .45rem .58rem; font-size: .68rem; font-weight: 800; cursor: pointer; }
.lang.active { background: var(--purple); color: white; }
.menu-button { display: none; border: 0; background: none; }

.hero { min-height: 710px; padding: 4.5rem 7vw; display: flex; align-items: flex-start; position: relative; overflow: hidden; background: #f7e6dc; }
.hero:after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(255,248,237,.96) 0%, rgba(255,248,237,.84) 34%, rgba(255,248,237,.18) 58%, transparent 76%); z-index: 1; }
.hero-cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.hero-copy { max-width: 650px; position: relative; z-index: 2; margin-top: 1.5rem; }
.eyebrow { text-transform: uppercase; letter-spacing: .2em; font-size: .68rem; font-weight: 800; color: var(--purple); margin: 0 0 1.4rem; }
.hero h1, .section h2, .maquila h2 { font: 800 clamp(3.7rem,6.5vw,7.2rem)/.96 Manrope, sans-serif; letter-spacing: -.06em; margin: 0; color: var(--dark); }
.hero h1 em { font: 600 italic 1.05em/1 Playfair Display, serif; color: var(--purple); }
.hero-copy > p:not(.eyebrow) { max-width: 500px; line-height: 1.7; color: #725e6e; margin: 1.6rem 0; }
.hero-actions { display: flex; align-items: center; gap: 1.7rem; }
.button { display: inline-flex; justify-content: space-between; align-items: center; gap: 2.5rem; padding: 1rem 1.25rem; background: var(--dark); color: white; font-size: .82rem; font-weight: 700; }
.simple-link { font-size: .8rem; font-weight: 700; border-bottom: 1px solid #9e8999; padding: .6rem 0; }
.hero-notes { display: flex; gap: 1.4rem; margin-top: 2rem; font-size: .67rem; font-weight: 700; color: #80697b; }

.section { padding: 8rem 8vw; }
.about { display: grid; grid-template-columns: 1.35fr .65fr; gap: 6vw; align-items: center; background: #fffaf3; }
.about-copy { max-width: 850px; }
.about-copy h2 { font: 800 clamp(3rem,5vw,5.6rem)/.98 Manrope, sans-serif; letter-spacing: -.06em; color: var(--dark); margin: 0 0 2rem; }
.about-copy p:not(.eyebrow) { font-size: 1rem; line-height: 1.85; color: #725e6e; max-width: 780px; }
.about-stamp { background: var(--cream); border: 1px solid #efd6c8; padding: 2rem; min-height: 300px; display: flex; flex-direction: column; justify-content: flex-end; }
.about-stamp span { font: 600 italic clamp(3rem,5vw,5.4rem)/.88 Playfair Display, serif; color: var(--purple); letter-spacing: -.05em; }
.about-stamp p { line-height: 1.7; color: #725e6e; }
.trust-strip { background: linear-gradient(180deg, #fff 0%, #fffaf3 100%); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 3.8rem 6vw 3.1rem; }
.trust-grid { display: grid; grid-template-columns: repeat(4,1fr); max-width: 1280px; margin: 0 auto; }
.trust-strip article { min-height: 300px; padding: .6rem 2rem; border-left: 1px solid #eadbd3; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.trust-strip article:last-child { border-right: 1px solid #eadbd3; }
.trust-icon { width: 82px; height: 82px; border-radius: 50%; display: grid; place-items: center; margin-bottom: 1.45rem; background: #fff8f1; border: 2px solid #eadbd3; color: var(--purple); font: 800 2.2rem Manrope; box-shadow: 0 10px 22px #4c244b16; }
.trust-strip strong { min-height: 58px; display: flex; align-items: center; justify-content: center; font: 800 clamp(1.05rem,1.7vw,1.65rem)/1.12 Manrope; color: var(--dark); text-transform: uppercase; letter-spacing: -.03em; margin: 0; }
.trust-line { display: block; width: 42px; height: 3px; background: #d7b16f; margin: 1.25rem 0 1.35rem; }
.trust-text { max-width: 280px; font-size: .92rem; line-height: 1.65; color: #655a62; }
.trust-badges { display: flex; justify-content: center; gap: clamp(.9rem,2vw,1.8rem); flex-wrap: nowrap; max-width: 1320px; margin: 2.6rem auto 0; color: var(--dark); }
.trust-badges span { position: relative; flex: 0 1 auto; white-space: nowrap; font: 800 clamp(.58rem,.86vw,.72rem)/1.25 Manrope; text-transform: uppercase; letter-spacing: .03em; padding-left: 1.9rem; }
.trust-badges span:before { content: "✓"; position: absolute; left: 0; top: -.2rem; width: 1.35rem; height: 1.35rem; border: 1px solid #d7b16f; border-radius: 50%; display: grid; place-items: center; color: var(--purple); font-size: .78rem; }

.category-nav { height: 82px; background: white; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: center; gap: .6rem; position: sticky; top: 128px; z-index: 10; }
.category { border: 1px solid #dacbd5; background: white; color: var(--dark); border-radius: 30px; padding: .7rem 1.2rem; font-size: .74rem; font-weight: 700; cursor: pointer; }
.category.active, .category:hover { background: var(--purple); border-color: var(--purple); color: white; }
.section-heading { display: flex; justify-content: space-between; align-items: end; margin-bottom: 4rem; }
.section-heading h2, .business h2, .contact h2 { font-size: clamp(3rem,5vw,5.5rem); }
.section-heading > p { max-width: 410px; line-height: 1.7; color: #7b6777; }

.product-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1.2rem; }
.product-card { background: white; border: 1px solid #eee5e0; transition: .3s; }
.product-card:hover { transform: translateY(-6px); box-shadow: 0 18px 40px #4c244b18; }
.product-card > button { border: 0; background: none; padding: 0; width: 100%; text-align: left; color: inherit; cursor: pointer; }
.product-image { height: 360px; overflow: hidden; position: relative; background: #f1e4da; }
.product-image img { width: 100%; height: 100%; object-fit: cover; transition: .5s; }
.product-card:hover .product-image img { transform: scale(1.035); }
.product-image span { position: absolute; right: 1rem; bottom: 1rem; background: white; color: var(--dark); padding: .65rem .85rem; font-size: .68rem; font-weight: 700; opacity: 0; transform: translateY(5px); transition: .3s; }
.product-card:hover .product-image span { opacity: 1; transform: none; }
.product-info { padding: 1.3rem 1.4rem 1.5rem; }
.product-info small { text-transform: uppercase; letter-spacing: .15em; color: var(--peach); font-size: .6rem; font-weight: 800; }
.product-info h3 { font: 700 1.1rem/1.25 Manrope; margin: .45rem 0; color: var(--dark); }
.product-info p { font-size: .72rem; color: #8a7685; margin: 0; }

.business { background: var(--cream); }
.business-intro { max-width: 800px; }
.business-intro > p:last-child { max-width: 590px; color: #725e6e; line-height: 1.7; }
.business-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; margin-top: 4rem; }
.business-cards article { min-height: 310px; background: white; padding: 2rem; display: flex; flex-direction: column; justify-content: center; }
.business-cards .accent { background: var(--purple); color: white; transform: translateY(-1.5rem); }
.business-cards b { color: var(--peach); font-size: .65rem; }
.business-cards h3 { font: 700 2rem Manrope; margin: 0 0 1rem; }
.business-cards p { font-size: .86rem; line-height: 1.7; color: #806d7c; }
.business-cards .accent p { color: #eaddea; }
.channel-details { display: grid; grid-template-columns: repeat(2,1fr); gap: 1rem; margin-top: 2.5rem; }
.channel-details article { background: #fffaf7; border: 1px solid #efd6c8; padding: 1.6rem; }
.channel-details span { display: block; font: 800 .82rem Manrope; color: var(--purple); text-transform: uppercase; letter-spacing: .12em; margin-bottom: 1rem; }
.channel-details ul { margin: 0; padding-left: 1.1rem; color: #725e6e; line-height: 1.8; font-size: .86rem; }

.seo-copy { background: #fffaf3; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.seo-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; }
.seo-grid article { background: white; border: 1px solid var(--line); padding: 1.7rem; min-height: 210px; }
.seo-grid h3 { font: 800 1.1rem/1.25 Manrope; color: var(--dark); margin: 0 0 1rem; }
.seo-grid p { color: #725e6e; font-size: .88rem; line-height: 1.75; margin: 0; }

.logistics { background: linear-gradient(180deg, #fff 0%, #fffaf3 100%); }
.logistics-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1.4rem; }
.logistics-grid article { border: 1px solid #eadbd3; border-radius: 6px; background: #fffdf9; padding: 2.2rem 1.8rem; min-height: 360px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; box-shadow: 0 14px 35px #4c244b0a; }
.logistics-icon { width: 86px; height: 86px; border-radius: 50%; display: grid; place-items: center; margin-bottom: 1.5rem; background: #fff8f1; border: 2px solid #eadbd3; color: var(--purple); font: 800 2.4rem Manrope; box-shadow: 0 10px 22px #4c244b16; }
.logistics-grid strong { min-height: 62px; display: flex; align-items: center; justify-content: center; font: 800 clamp(1.1rem,1.7vw,1.7rem)/1.08 Manrope; color: var(--dark); text-transform: uppercase; letter-spacing: -.03em; margin: 0; }
.logistics-grid i { display: block; min-height: 45px; margin: 1.05rem 0 .9rem; color: var(--purple); font: normal 800 clamp(1.6rem,2.6vw,2.55rem)/1 Manrope; }
.logistics-grid i:empty { min-height: 0; width: 42px; height: 3px; background: #d7b16f; margin: 1.25rem 0 1.35rem; }
.logistics-grid i:not(:empty):after { content: ""; display: block; width: 42px; height: 3px; background: #d7b16f; margin: 1rem auto 0; }
.logistics-grid p { max-width: 285px; line-height: 1.65; color: #4f4b50; font-size: .95rem; margin: 0; }

.maquila { display: grid; grid-template-columns: 46% 54%; background: var(--dark); color: white; min-height: 700px; }
.maquila-image { overflow: hidden; }
.maquila-image img { width: 100%; height: 100%; object-fit: cover; }
.maquila-copy { padding: 7rem 9vw; align-self: center; }
.maquila-copy .eyebrow { color: var(--peach); }
.maquila h2 { color: white; font-size: clamp(3rem,5vw,5.6rem); }
.maquila-copy > p:not(.eyebrow) { line-height: 1.8; color: #d9cad6; }
.maquila ul { list-style: none; padding: 0; margin: 2rem 0; }
.maquila li { font-size: .83rem; padding: .7rem 0; border-bottom: 1px solid #ffffff1c; }
.maquila li:before { content: "✓"; color: var(--peach); margin-right: .8rem; }
.peach { background: var(--peach); }

.contact { display: grid; grid-template-columns: 1.1fr .9fr; gap: 10vw; background: #f7ede8; }
.contact-details { display: flex; flex-direction: column; gap: 1.8rem; justify-content: center; }
.contact-details a { font: 700 1.2rem Manrope; }
.contact-details small { display: block; font: 700 .58rem DM Sans; text-transform: uppercase; letter-spacing: .16em; color: var(--peach); margin-bottom: .3rem; }
.contact-details p { font-size: .8rem; color: #796475; line-height: 1.6; }
.daca-logo { width: 190px; max-width: 70%; height: auto; object-fit: contain; margin-bottom: .4rem; }
.social-links { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; }
.social-links small { width: 100%; }
.social-links a { display: inline-flex; align-items: center; gap: .45rem; border: 1px solid #d9c7d3; border-radius: 999px; padding: .65rem 1rem; background: white; color: var(--dark); font-size: .82rem; }
.social-links svg { width: 18px; height: 18px; fill: currentColor; }
footer { background: #341733; color: #ddcddd; min-height: 150px; padding: 2rem 7vw; display: flex; align-items: center; gap: 3rem; }
.footer-brand { width: 140px; height: 110px; object-fit: contain; }
.footer-daca { width: 145px; height: auto; object-fit: contain; background: white; border-radius: 12px; padding: .7rem; }
footer p { font: 600 italic 1.15rem Playfair Display; }
.footer-social { display: flex; gap: .65rem; flex-wrap: wrap; }
.footer-social span { width: 100%; font: 800 .62rem Manrope; text-transform: uppercase; letter-spacing: .12em; color: #eacddd; }
.footer-social a { display: inline-flex; align-items: center; gap: .42rem; border: 1px solid #ffffff2b; border-radius: 999px; padding: .55rem .85rem; font: 800 .68rem Manrope; text-transform: uppercase; letter-spacing: .08em; color: white; }
.footer-social svg { width: 16px; height: 16px; fill: currentColor; }
footer small { margin-left: auto; }
.whatsapp { position: fixed; right: 1.3rem; bottom: 1.3rem; width: 54px; height: 54px; background: #25d366; color: white; border-radius: 50%; display: grid; place-items: center; font-size: .68rem; font-weight: 800; z-index: 30; box-shadow: 0 8px 24px #0003; }
.whatsapp svg { width: 31px; height: 31px; fill: currentColor; display: block; }

.product-dialog { width: min(1100px,94vw); height: min(760px,92vh); border: 0; padding: 0; background: var(--soft); box-shadow: 0 30px 80px #27122588; overflow: hidden; }
.product-dialog::backdrop { background: #2b172a99; backdrop-filter: blur(3px); }
.dialog-close { position: absolute; right: 1rem; top: 1rem; z-index: 4; width: 42px; height: 42px; border: 0; border-radius: 50%; background: white; color: var(--dark); font-size: 1.5rem; cursor: pointer; }
.dialog-layout { display: grid; grid-template-columns: 47% 53%; height: 100%; }
.dialog-image { height: 100%; overflow: hidden; background: #eee0d8; }
.dialog-image img { width: 100%; height: 100%; object-fit: cover; }
.dialog-content { padding: 4rem 3.6rem; overflow: auto; }
.dialog-category { text-transform: uppercase; letter-spacing: .17em; color: var(--peach); font-size: .65rem; font-weight: 800; }
.dialog-content h2 { font: 800 clamp(2.1rem,4vw,3.6rem)/1 Manrope; margin: .7rem 0; color: var(--dark); letter-spacing: -.05em; }
.dialog-meta { font-size: .75rem; color: #816d7c; }
.tabs { display: flex; gap: 0; border-bottom: 1px solid #deced8; margin: 2.2rem 0 1.8rem; overflow-x: auto; }
.tab { border: 0; background: none; padding: .8rem .85rem .8rem 0; margin-right: 1rem; color: #8c7686; font-size: .72rem; font-weight: 700; white-space: nowrap; border-bottom: 2px solid transparent; cursor: pointer; }
.tab.active { color: var(--purple); border-color: var(--purple); }
.tab-panel { min-height: 190px; }
.tab-panel h3 { font: 700 1rem Manrope; }
.tab-panel p { line-height: 1.75; color: #705d6c; font-size: .86rem; }
.feature-row { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: 1.5rem; }
.feature-row span { background: var(--cream); padding: .6rem .75rem; font-size: .68rem; font-weight: 700; }
.allergen { background: #f8ede8; padding: 1rem; }
.nutrition-card { background: #fff; border: 1px solid #eadfd8; padding: 1rem; }
.nutrition-serving { background: var(--cream); border: 1px solid #efd6c8; padding: .85rem 1rem; margin-bottom: .9rem; }
.nutrition-serving p { margin: .15rem 0; color: var(--dark); line-height: 1.45; }
.nutrition-table { width: 100%; border-collapse: collapse; font-size: .86rem; overflow: hidden; border: 1px solid #eadfd8; }
.nutrition-table th, .nutrition-table td { padding: .68rem .78rem; border-bottom: 1px solid #eadfd8; vertical-align: middle; }
.nutrition-table thead th { background: var(--purple); color: white; font: 800 .72rem Manrope; letter-spacing: .08em; text-transform: uppercase; text-align: left; }
.nutrition-table thead th:not(:first-child), .nutrition-table td { text-align: center; }
.nutrition-table tbody th { color: var(--dark); font-weight: 600; text-align: left; }
.nutrition-table tbody tr:nth-child(even) { background: #fff8f1; }
.nutrition-table .calories th, .nutrition-table .calories td { font: 800 1.05rem Manrope; color: var(--dark); background: #f8ede8; border-bottom: 3px solid var(--purple); }
.nutrition-table .highlight th, .nutrition-table .highlight td { font-weight: 800; color: #30172f; }
.nutrition-note { margin: .9rem 0 0; font-size: .78rem; color: #705d6c; font-style: italic; }
.nutrition-pending { border: 1px dashed #c9a9be; padding: 1.2rem; background: #fffaf3; }
.nutrition-pending strong { color: var(--purple); }
.dialog-cta { margin-top: 1.5rem; }
.reveal { opacity: 0; transform: translateY(18px); transition: .7s; }
.reveal.visible { opacity: 1; transform: none; }

@media (max-width: 1050px) {
  .nav, .header-cta { display: none; }
  .language-switch { margin-left: auto; }
  .menu-button { display: block; margin-left: 0; }
  .menu-button span { display: block; width: 24px; height: 2px; background: var(--dark); margin: 6px; }
  .nav.open { display: flex; position: absolute; top: 128px; left: 0; width: 100%; height: calc(100vh - 128px); background: white; flex-direction: column; align-items: center; justify-content: center; font-size: 1.4rem; }
  .nav.open::before { content: ""; display: block; width: 210px; height: 150px; background: url("assets/brand/logo-cattleya-colibri-transparente.png") center/contain no-repeat; }
  .hero { padding-left: 5vw; }
  .hero h1 { font-size: 4rem; }
  .product-grid { grid-template-columns: repeat(3,1fr); }
  .section { padding: 6rem 5vw; }
  .trust-grid, .logistics-grid { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 760px) {
  .topbar { height: auto; min-height: 28px; padding: .45rem .8rem; font-size: .48rem; line-height: 1.35; letter-spacing: .11em; }
  .header { height: 112px; padding: 0 5vw; gap: .75rem; }
  .brand { height: 106px; width: min(218px, 50vw); flex-shrink: 0; }
  .language-switch { flex-shrink: 0; padding: .12rem; }
  .lang { padding: .38rem .48rem; font-size: .62rem; }
  .menu-button { width: 38px; padding: 0; flex-shrink: 0; }
  .menu-button span { width: 22px; margin: 5px auto; }
  .nav.open { top: 112px; height: calc(100vh - 112px); gap: .9rem; padding: 2rem 6vw 3rem; justify-content: flex-start; background: linear-gradient(180deg, #fffaf3 0%, #fff 48%, #fff0d7 100%); }
  .nav.open::before { width: min(245px, 62vw); height: 165px; margin: .2rem 0 .6rem; }
  .nav.open a { width: min(360px, 88vw); padding: 1rem 1.2rem; border: 1px solid var(--line); border-radius: 18px; background: white; color: var(--dark); font-size: 1.05rem; text-align: center; box-shadow: 0 12px 28px #4c244b0d; }
  .category-nav { top: 112px; justify-content: flex-start; padding: 0 1rem; overflow-x: auto; }
  .hero { min-height: 0; padding: 0; display: flex; flex-direction: column; background: var(--soft); }
  .hero:after { display: none; }
  .hero-cover { position: relative; order: 2; height: 440px; object-position: center bottom; }
  .hero-copy { order: 1; width: 100%; max-width: none; margin-top: 0; padding: 3rem 6vw 2.2rem; background: linear-gradient(180deg, #fffaf3 0%, #fff0d7 100%); }
  .hero h1 { font-size: 3.5rem; }
  .hero-copy > p:not(.eyebrow) { max-width: 95%; margin: 1.2rem 0; }
  .hero-notes { flex-wrap: wrap; margin-top: 1.3rem; gap: .7rem; }
  .hero-notes span { background: #fffaf7; border: 1px solid var(--line); border-radius: 999px; padding: .45rem .7rem; }
  .about, .contact { grid-template-columns: 1fr; }
  .trust-strip { padding: 3rem 5vw; }
  .trust-grid { grid-template-columns: 1fr; }
  .trust-strip article { min-height: 260px; border-left: 0; border-bottom: 1px solid var(--line); padding: 2rem 1rem; }
  .trust-strip article:last-child { border-right: 0; border-bottom: 0; }
  .trust-badges { justify-content: flex-start; gap: 1rem; margin-top: 2rem; }
  .trust-badges span { width: 100%; }
  .section-heading { display: block; }
  .section-heading > p { margin-top: 1.5rem; }
  .product-grid { grid-template-columns: repeat(2,1fr); }
  .product-image { height: 300px; }
  .product-info { padding: 1rem; }
  .product-info h3 { font-size: 1rem; }
  .product-info p { line-height: 1.45; }
  .business-cards, .logistics-grid, .channel-details, .seo-grid { grid-template-columns: 1fr; }
  .business-cards .accent { transform: none; }
  .logistics-grid { gap: 1rem; }
  .logistics-grid article { min-height: 0; padding: 2rem 1.35rem; }
  .logistics-icon { width: 74px; height: 74px; margin-bottom: 1.1rem; font-size: 2rem; }
  .logistics-grid strong { min-height: 0; font-size: 1.25rem; }
  .logistics-grid i { min-height: 0; margin: .9rem 0 .75rem; font-size: 1.8rem; }
  .logistics-grid i:empty { margin: 1rem 0 1.15rem; }
  .logistics-grid p { font-size: .9rem; }
  .maquila { grid-template-columns: 1fr; }
  .maquila-image { height: 480px; }
  .maquila-copy { padding: 5rem 7vw; }
  .dialog-layout { grid-template-columns: 1fr; height: auto; }
  .product-dialog { height: 94vh; overflow: auto; }
  .dialog-image { height: 320px; }
  .dialog-content { padding: 2rem 1.4rem; }
  .dialog-close { position: fixed; }
  .tabs { margin-top: 1.5rem; }
  .nutrition-card { overflow-x: auto; padding: .8rem; }
  .nutrition-table { min-width: 520px; font-size: .78rem; }
  .nutrition-table th, .nutrition-table td { padding: .55rem .6rem; }
  footer { flex-direction: column; text-align: center; gap: 1rem; }
  footer small { margin-left: 0; }
}

@media (max-width: 480px) {
  .hero { min-height: 0; }
  .hero-cover { height: 360px; }
  .hero-copy { padding: 2.4rem 5vw 1.8rem; }
  .hero h1 { font-size: 2.9rem; }
  .hero-actions { align-items: stretch; flex-direction: column; gap: .7rem; }
  .hero-actions .button { width: 100%; }
  .simple-link { align-self: flex-start; }
  .product-grid { grid-template-columns: 1fr; }
  .product-image { height: 360px; }
  .section { padding: 5rem 5vw; }
  .tabs { gap: 0; }
  .tab { margin-right: .8rem; }
  .dialog-image { height: 270px; }
  .whatsapp { right: 1rem; bottom: 1rem; width: 50px; height: 50px; }
  .whatsapp svg { width: 29px; height: 29px; }
}

@media (max-width: 380px) {
  .brand { width: min(150px, 42vw); }
  .lang { padding: .34rem .42rem; font-size: .58rem; }
  .hero h1 { font-size: 2.55rem; }
  .product-image { height: 320px; }
}