:root {
  --brand-700: #b42318;
  --brand-800: #912018;
  --ink-950: #111827;
  --ink-700: #374151;
  --ink-600: #4b5563;
  --line: #e5e7eb;
  --surface: #f8fafc;
}

* { box-sizing: border-box; }
html { color-scheme: light; scroll-behavior: smooth; }
body { margin: 0; color: var(--ink-950); background: #fff; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6 { line-height: 1.5; text-wrap: balance; }
p, li { text-wrap: pretty; }
img { display: block; max-width: 100%; }
a, button, input, select, textarea, summary { outline: none; }
:focus-visible { outline: 3px solid rgba(180, 35, 24, .32); outline-offset: 3px; }

.site-container { width: min(100% - 40px, 1200px); margin-inline: auto; }
.section-space { padding-block: 72px; }
.section-space-sm { padding-block: 48px; }
.page-title { font-size: clamp(2rem, 4vw, 2.625rem); font-weight: 650; line-height: 1.5; }
.section-title { font-size: clamp(1.75rem, 3vw, 2.125rem); font-weight: 650; line-height: 1.5; }
.card { border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.image-frame { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #f3f4f6; }
.media-placeholder { min-height: 240px; background: #f3f4f6; }

.btn-primary, .btn-secondary, .btn-dark, .btn-whatsapp { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 10px; border-radius: 6px; padding: 10px 18px; font-size: 15px; font-weight: 650; text-decoration: none; cursor: pointer; transition: background-color 180ms ease-out, border-color 180ms ease-out, color 180ms ease-out; }
.btn-primary { border: 1px solid var(--brand-700); color: #fff; background: var(--brand-700); }
.btn-primary:hover { border-color: var(--brand-800); background: var(--brand-800); }
.btn-secondary { border: 1px solid #d1d5db; color: var(--ink-950); background: #fff; }
.btn-secondary:hover { border-color: #9ca3af; background: #f9fafb; }
.btn-dark { border: 1px solid #111827; color: #fff; background: #111827; }
.btn-dark:hover { border-color: #000; background: #000; }
.btn-whatsapp { border: 1px solid #0f766e; color: #0f766e; background: #fff; }
.btn-whatsapp:hover { border-color: #115e59; color: #115e59; background: #f0fdfa; }
.text-link { display: inline-flex; min-height: 44px; align-items: center; gap: 8px; color: var(--brand-700); font-weight: 650; text-decoration: none; }
.text-link:hover { color: var(--brand-800); }

.skip-link { position: fixed; z-index: 60; top: 12px; left: 12px; transform: translateY(-160%); border-radius: 6px; background: #111827; padding: 10px 14px; color: #fff; }
.skip-link:focus { transform: translateY(0); }
.custom-logo-link { display: flex; min-height: 44px; align-items: center; }
.custom-logo { width: auto; height: 36px; }

.primary-menu { display: flex; align-items: center; gap: 22px; margin: 0; padding: 0; list-style: none; }
.primary-menu > li { position: relative; }
.primary-menu a { display: inline-flex; min-height: 44px; align-items: center; border-bottom: 2px solid transparent; color: #374151; font-size: 14px; font-weight: 600; text-decoration: none; transition: border-color 180ms ease-out, color 180ms ease-out; }
.primary-menu a:hover, .primary-menu .current-menu-item > a, .primary-menu .current-category-ancestor > a { border-color: var(--brand-700); color: #111827; }
.primary-menu > .menu-item-has-children > a::after { width: 7px; height: 7px; margin-left: 8px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; content: ''; transform: translateY(-2px) rotate(45deg); }
.primary-menu .sub-menu { position: absolute; z-index: 40; top: 100%; left: -16px; display: none; width: 280px; margin: 0; padding: 8px; border: 1px solid #e5e7eb; border-radius: 8px; background: #fff; box-shadow: 0 10px 15px -3px rgba(17, 24, 39, .1), 0 4px 6px -4px rgba(17, 24, 39, .1); list-style: none; }
.primary-menu .menu-item-has-children:hover > .sub-menu, .primary-menu .menu-item-has-children:focus-within > .sub-menu { display: block; }
.primary-menu .sub-menu a { width: 100%; min-height: 44px; border: 0; border-radius: 6px; padding: 10px 12px; color: #374151; line-height: 1.5; white-space: normal; }
.primary-menu .sub-menu a:hover, .primary-menu .sub-menu .current-menu-item > a { border: 0; background: #f3f4f6; color: #111827; }
.mobile-menu-list { display: grid; gap: 4px; margin: 0; padding: 16px 0; list-style: none; }
.mobile-menu-list a { display: flex; min-height: 44px; align-items: center; padding: 10px 8px; color: #1f2937; font-weight: 600; text-decoration: none; }
.mobile-menu-list .current-menu-item > a, .mobile-menu-list .current-category-ancestor > a { color: var(--brand-700); }
.mobile-menu-list .menu-item-has-children { display: grid; grid-template-columns: minmax(0, 1fr) 44px; }
.mobile-menu-list .menu-item-has-children > a { grid-column: 1; }
.mobile-submenu-toggle { display: inline-flex; grid-column: 2; width: 44px; height: 44px; cursor: pointer; align-items: center; justify-content: center; border: 0; border-radius: 6px; background: #fff; color: #374151; }
.mobile-submenu-toggle:hover, .mobile-submenu-toggle:focus-visible { background: #f3f4f6; color: #111827; }
.mobile-submenu-toggle svg { width: 18px; height: 18px; }
.mobile-submenu-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.mobile-menu-list .sub-menu { grid-column: 1 / -1; margin: 2px 0 8px 8px; padding: 4px 0 4px 12px; border-left: 2px solid #e5e7eb; list-style: none; }
.mobile-menu-list .sub-menu[hidden] { display: none; }
.mobile-menu-list .sub-menu a { min-height: 44px; padding: 9px 8px; font-size: 14px; font-weight: 500; }
.footer-menu { margin: 16px 0 0; padding: 0; list-style: none; }
.footer-menu li + li { margin-top: 12px; }
.site-footer .footer-menu a { color: #d1d5db; text-decoration: none; transition: color 180ms ease-out; }
.site-footer .footer-menu a:hover { color: #fff; }
.site-footer a { text-underline-offset: 3px; }

.metric-value { font-variant-numeric: tabular-nums; }
.field-label { display: block; margin-bottom: 8px; color: #1f2937; font-size: 14px; font-weight: 650; }
.field-control { width: 100%; min-height: 46px; border: 1px solid #d1d5db; border-radius: 6px; background: #fff; padding: 10px 12px; color: #111827; }
.field-control:hover { border-color: #9ca3af; }
.field-control:focus { border-color: var(--brand-700); box-shadow: 0 0 0 3px rgba(180, 35, 24, .12); }
textarea.field-control { min-height: 132px; resize: vertical; }

.gr-inquiry-form .ff-el-group { margin-bottom: 20px; }
.gr-inquiry-form .ff-el-input--label { margin-bottom: 8px; }
.gr-inquiry-form .ff-el-input--label label { color: #1f2937; font-size: 14px; font-weight: 650; line-height: 1.5; }
.gr-inquiry-form .ff-el-form-control { width: 100%; min-height: 46px; border: 1px solid #d1d5db; border-radius: 6px; background: #fff; padding: 10px 12px; color: #111827; box-shadow: none; }
.gr-inquiry-form .ff-el-form-control:hover { border-color: #9ca3af; }
.gr-inquiry-form .ff-el-form-control:focus { border-color: var(--brand-700); box-shadow: 0 0 0 3px rgba(180, 35, 24, .12); }
.gr-inquiry-form textarea.ff-el-form-control { min-height: 132px; resize: vertical; }
.gr-inquiry-form .ff-el-is-error .ff-el-form-control { border-color: var(--brand-700); }
.gr-inquiry-form .error, .gr-inquiry-form .text-danger { color: var(--brand-700); font-size: 13px; }
.gr-inquiry-form .ff-btn-submit { display: inline-flex !important; min-height: 44px !important; align-items: center; justify-content: center; border: 1px solid var(--brand-700) !important; border-radius: 6px !important; background: var(--brand-700) !important; padding: 10px 18px !important; color: #fff !important; font-size: 15px !important; font-weight: 650 !important; line-height: 1.5 !important; cursor: pointer; box-shadow: none !important; opacity: 1 !important; transition: background-color 180ms ease-out, border-color 180ms ease-out !important; }
.gr-inquiry-form .ff-btn-submit:hover { border-color: var(--brand-800) !important; background: var(--brand-800) !important; }
.gr-inquiry-form .ff-message-success { border: 1px solid #d1d5db; border-radius: 6px; background: #f8fafc; padding: 16px; color: #374151; box-shadow: none; }
details > summary { cursor: pointer; list-style: none; }
details > summary::-webkit-details-marker { display: none; }
details[open] .faq-icon { transform: rotate(45deg); }
.faq-icon { transition: transform 180ms ease-out; }

.article-body { color: var(--ink-700); font-size: 17px; line-height: 1.8; }
.article-body h2, .article-body h3 { text-wrap: balance; }
.article-body p, .article-body li { text-wrap: pretty; }
.article-body > * + * { margin-top: 20px; }
.article-body h2 { margin-top: 48px; color: var(--ink-950); font-size: clamp(1.5rem, 3vw, 1.875rem); font-weight: 650; line-height: 1.5; scroll-margin-top: 24px; }
.article-body h3 { margin-top: 32px; color: var(--ink-950); font-size: 1.125rem; font-weight: 650; line-height: 1.5; }
.article-body ul, .article-body ol { padding-left: 24px; }
.article-body ul { list-style: disc; }
.article-body ol { list-style: decimal; }
.article-body li + li { margin-top: 10px; }
.article-body strong { color: var(--ink-950); font-weight: 650; }
.article-body a { color: var(--brand-700); text-decoration: underline; text-underline-offset: 3px; }
.article-body .btn-primary { color: #fff; text-decoration: none; }
.article-body .btn-secondary { color: var(--ink-950); text-decoration: none; }
.article-body figure { margin-block: 32px; }
.article-body figcaption { margin-top: 10px; color: var(--ink-600); font-size: 14px; line-height: 1.6; }
.article-note { border-left: 3px solid var(--brand-700); background: var(--surface); padding: 20px 22px; color: var(--ink-700); }

.product-main-button { display: flex; width: 100%; aspect-ratio: 1; cursor: zoom-in; align-items: center; justify-content: center; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #f8fafc; padding: 0; }
.product-main-button img { width: 100%; height: 100%; object-fit: contain; }
.document-main-button { display: flex; width: 100%; max-height: 640px; aspect-ratio: 4 / 5; cursor: zoom-in; align-items: center; justify-content: center; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #f8fafc; padding: 12px; }
.document-main-button img { width: 100%; height: 100%; object-fit: contain; }
.product-thumb { display: flex; aspect-ratio: 1; cursor: pointer; align-items: center; justify-content: center; overflow: hidden; border: 1px solid var(--line); border-radius: 6px; background: #fff; padding: 0; }
.product-thumb:hover, .product-thumb[aria-current="true"] { border-color: var(--brand-700); }
.product-thumb img { width: 100%; height: 100%; object-fit: cover; }
.document-thumb img { object-fit: contain; padding: 4px; }
.product-lightbox[hidden] { display: none; }
.product-lightbox { position: fixed; z-index: 50; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(17, 24, 39, .88); padding: 24px; }
.product-lightbox-panel { position: relative; max-width: min(92vw, 1000px); max-height: 90dvh; }
.product-lightbox-image { display: block; max-width: 100%; max-height: 90dvh; border-radius: 8px; object-fit: contain; }
.product-lightbox-close { position: absolute; top: 10px; right: 10px; display: inline-flex; width: 44px; height: 44px; cursor: pointer; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; background: rgba(17,24,39,.85); color: #fff; font-size: 28px; line-height: 1; }
body.lightbox-open { overflow: hidden; }

.pagination .nav-links { display: flex; flex-wrap: wrap; gap: 8px; }
.pagination a, .pagination span { display: inline-flex; min-width: 44px; min-height: 44px; align-items: center; justify-content: center; border: 1px solid var(--line); border-radius: 6px; padding: 8px 12px; }
.pagination .current { border-color: var(--brand-700); color: var(--brand-700); }

@media (max-width: 1023px) { .desktop-navigation { display: none; } }
@media (min-width: 1024px) { .mobile-menu-toggle, .mobile-navigation { display: none !important; } }
@media (max-width: 767px) { .site-container { width: min(100% - 32px, 1200px); } .section-space { padding-block: 48px; } body.nav-open { overflow: hidden; } .product-lightbox { padding: 16px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition-duration: 0.01ms !important; } }