/* Sr. Pan: food first, concise copy and a shared desktop/mobile rhythm. */
:root { --section-space: clamp(56px, 6vw, 96px); }
.whatsapp-float { position: fixed; z-index: 90; right: max(24px, env(safe-area-inset-right)); bottom: calc(24px + env(safe-area-inset-bottom)); display: grid; place-items: center; width: 60px; height: 60px; padding: 0; border: 0; border-radius: 50%; background: #20bc62; color: #fff; box-shadow: 0 5px 18px #123c2426, 0 1px 4px #123c2414; transition: background .2s, transform .2s, box-shadow .2s; -webkit-tap-highlight-color: transparent; }
.whatsapp-float svg { width: 30px; height: 30px; fill: currentColor; stroke: none; }
.whatsapp-float:hover { background: #18a653; transform: translateY(-2px); box-shadow: 0 8px 24px #123c2433; }
.whatsapp-float:focus-visible { outline: 3px solid #1a1a1a; outline-offset: 4px; }
.whatsapp-float[aria-disabled] { cursor: default; }
.srpan-footer .footer-bottom-inner { padding-right: 90px; }
@media(max-width:600px) { .whatsapp-float { width: 54px; height: 54px; right: max(16px, env(safe-area-inset-right)); bottom: calc(16px + env(safe-area-inset-bottom)); } .whatsapp-float svg { width: 28px; height: 28px; } .srpan-footer .footer-bottom-inner { padding-right: 76px; } }
@media(prefers-reduced-motion:reduce) { .whatsapp-float { transition: none; } .whatsapp-float:hover { transform: none; } }
.social-links { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.social-links .social-link { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; flex: 0 0 36px; border: 1px solid currentColor; border-radius: 50%; color: inherit; }
.social-links .social-link svg { width: 18px; height: 18px; }
.social-links .social-link:focus-visible { outline: 3px solid #e6a15c; outline-offset: 3px; }
.social-links .social-link[aria-disabled] { cursor: default; }
.header-tools { display: flex; flex-direction: row; align-items: center; justify-self: end; gap: 12px; }
.mobile-menu-socials { display: none; }
.site-header .header-inner { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 18px; }
.site-header .nav-list { gap: clamp(12px, 1.3vw, 22px); }
.site-header .nav-list a { font-size: 13px; }
.header-tools .social-links { flex-wrap: nowrap; gap: 6px; }
.header-tools .social-link { width: 32px; height: 32px; flex-basis: 32px; }
.header-tools .social-links { color: #1a1a1a; }
.header-tools .header-cta { min-height: 44px; padding: 12px 18px; font-size: 11px; }
.srpan-footer .social-links { margin-top: 12px; gap: 10px; }
.srpan-footer .social-links .social-link { width: 40px; height: 40px; flex-basis: 40px; }
.srpan-footer .social-links .social-link::after { content: none; }
@media(max-width:1280px) { .site-header .header-inner { gap: 12px; } .header-tools .header-cta { display: none; } }
@media(max-width:1024px) {
 .site-header .header-inner { grid-template-columns: 1fr auto; gap: 12px; }
 .header-tools { display: none; }
 .site-header .primary-nav { align-content: center; gap: 28px; padding: 96px 24px 32px; overflow-y: auto; }
 .site-header .nav-list { gap: 5px; }
 .site-header .nav-list a { font-size: 23px; }
 .mobile-menu-socials { display: block; }
 .mobile-menu-socials .social-links { justify-content: center; gap: 14px; }
 .mobile-menu-socials .social-link { width: 44px; height: 44px; flex-basis: 44px; }
 .header-tools .social-links { flex-wrap: nowrap; gap: 6px; }
 .header-tools .social-link { width: 32px; height: 32px; flex-basis: 32px; }
 .header-tools .social-link svg { width: 17px; height: 17px; }
}
@media(max-width:600px) { .srpan-footer .social-links { gap: 8px; } .srpan-footer .social-links .social-link { width: 34px; height: 34px; flex-basis: 34px; } }
.final-cta.wholesale-banner { display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; gap: 32px; min-height: 0; padding: 48px clamp(28px, 5vw, 72px); overflow: hidden; isolation: isolate; border-radius: 28px; }
.final-cta.wholesale-banner::before { content: none; }
.final-cta.wholesale-banner .final-cta-copy { max-width: none; min-width: 0; }
.final-cta.wholesale-banner h2 { font-family: 'Archivo Black', Manrope, sans-serif; font-size: clamp(32px, 3.6vw, 54px); line-height: 1.14; font-weight: 400; }
.final-cta.wholesale-banner p:not(.eyebrow) { margin: 28px 0 24px; }
.final-cta.wholesale-banner .button-secondary { background: #fff9f1; border-color: #fff9f1; color: #a32626; margin: 0; }
.final-cta.wholesale-banner .button-secondary:hover { background: #fff; border-color: #fff; }
.wholesale-product { position: relative; display: grid; place-items: center; min-width: 0; padding: 12px; }
.wholesale-product::before { content: ''; position: absolute; width: min(100%, 330px); aspect-ratio: 1; border-radius: 50%; background: #f3c996; }
.final-cta.wholesale-banner .final-cta-product { position: relative; inset: auto; display: block; width: 100%; height: 360px; max-height: none; object-fit: contain; mix-blend-mode: normal; transform: rotate(5deg); filter: drop-shadow(0 12px 12px rgba(60, 20, 10, .18)); }
.wholesale-product.wholesale-product-pair { display: flex; align-items: center; justify-content: center; padding: 30px 18px; }
.final-cta.wholesale-banner .wholesale-product-pair .final-cta-product { flex: 0 0 55%; width: 55%; height: clamp(250px, 28vw, 360px); transform: rotate(-9deg); z-index: 2; }
.final-cta.wholesale-banner .wholesale-product-pair .final-cta-product + .final-cta-product { margin-left: -10%; transform: translateY(14px) rotate(8deg); z-index: 1; }
@media (max-width: 640px) {
  .final-cta.wholesale-banner { grid-template-columns: 1fr; padding: 36px 24px 24px; gap: 24px; border-radius: 22px; text-align: center; }
  .final-cta.wholesale-banner h2 { font-size: clamp(30px, 8vw, 42px); }
  .final-cta.wholesale-banner .button { max-width: 100%; padding-inline: 18px; font-size: 11px; white-space: normal; }
  .wholesale-product { width: 100%; max-width: 280px; margin: 0 auto; }
  .wholesale-product::before { width: 230px; max-width: 100%; }
  .final-cta.wholesale-banner .final-cta-product { height: 270px; }
  .wholesale-product.wholesale-product-pair { max-width: 340px; padding: 24px 12px; }
  .final-cta.wholesale-banner .wholesale-product-pair .final-cta-product { height: clamp(210px, 65vw, 270px); }
}
/* Complete, caption-free artwork; never flex-shrink the icon inside a card. */
.certification-icon-image { flex: 0 0 auto; overflow: visible; isolation: isolate; background: var(--icon-backdrop, #fff); }
.certification-icon-image img { mix-blend-mode: multiply; }
.certification-item:hover { --icon-backdrop: var(--color-cream); }
.home .certification-item { --icon-backdrop: #fff9f1; }
.industry-icon, .certification-icon-image { padding: 7px; }
.industry-icon img, .certification-icon-image img { object-fit: contain; object-position: center; }
.about-values-grid img { padding: 7px; }
.site-footer.srpan-footer { margin-top: 0; color: #faf5ff; background: #1a1a1a; }
.srpan-footer .footer-main { background: transparent; padding: 64px 0 48px; border-top: 6px solid #c53030; }
.footer-signoff { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding-bottom: 56px; }
.footer-signoff h2 { margin: 0; font-family: 'Archivo Black', Manrope, sans-serif; font-weight: 400; font-size: clamp(32px, 4vw, 60px); line-height: 1.16; letter-spacing: -.035em; }
.footer-signoff .brand-underline { color: #e6a15c; }
.footer-signoff .button-secondary { flex-shrink: 0; color: #faf5ff; border-color: #faf5ff; }
.footer-signoff .button-secondary:hover { background: #faf5ff; color: #1a1a1a; }
.srpan-footer .footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 56px; border-top: 1px solid #ffffff29; padding-top: 44px; }
.srpan-footer .footer-brand { display: flex; align-items: center; gap: 24px; grid-column: auto; }
.srpan-footer .footer-logo { display: grid; place-items: center; width: 112px; height: 136px; flex: 0 0 112px; border-radius: 0; background: transparent; }
.srpan-footer .footer-logo img { width: 112px; height: 136px; object-fit: contain; filter: brightness(0) invert(1); }
.srpan-footer .footer-logo-white { background: transparent; border-radius: 0; }
.srpan-footer .footer-logo-white img { filter: none; }
.srpan-footer .footer-brand p { color: #e3ddd7; font-size: 14px; line-height: 1.7; }
.srpan-footer .footer-column { gap: 12px; font-size: 14px; min-width: 0; }
.srpan-footer .footer-column h2 { color: #e6a15c; font-size: 12px; letter-spacing: .1em; margin-bottom: 8px; }
.srpan-footer .footer-column a { color: #faf5ff; overflow-wrap: anywhere; }
.srpan-footer .footer-column a:hover { color: #e6a15c; }
.srpan-footer .footer-contact { grid-column: auto; }
.srpan-footer .footer-contact span { color: #c8c2bd; }
.srpan-footer .footer-bottom { background: transparent; border-top: 1px solid #ffffff29; padding-block: 22px; color: #c8c2bd; font-size: 12px; }
.footer-bottom-inner { display: flex; justify-content: space-between; gap: 24px; text-align: left; }
.footer-bottom-inner a { flex-shrink: 0; color: #faf5ff; }
.srpan-footer a:focus-visible { outline: 2px solid #e6a15c; outline-offset: 6px; }
@media (max-width: 1024px) {
  .footer-signoff { align-items: flex-start; flex-direction: column; gap: 32px; }
  .srpan-footer .footer-grid { grid-template-columns: 1.3fr 1fr 1fr; gap: 32px; }
  .srpan-footer .footer-brand { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 600px) {
  .srpan-footer .footer-main { padding-block: 44px 36px; }
  .footer-signoff { padding-bottom: 36px; }
  .footer-signoff h2 { font-size: clamp(30px, 8vw, 44px); }
  .footer-signoff .button { max-width: 100%; padding-inline: 16px; font-size: 11px; white-space: normal; }
  .srpan-footer .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px 20px; padding-top: 32px; }
  .srpan-footer .footer-brand { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 20px; }
  .srpan-footer .footer-logo { width: 88px; height: 112px; flex-basis: 88px; }
  .srpan-footer .footer-logo img { width: 88px; height: 112px; }
  .srpan-footer .footer-brand p, .srpan-footer .footer-column { font-size: 13px; }
  .footer-bottom-inner { flex-direction: column; gap: 14px; }
}
.about-page .about-intro { background: #fff9f1; overflow: hidden; }
.about-intro-grid { display: grid; grid-template-columns: 1.15fr 1fr; align-items: center; gap: 48px; }
.about-intro-copy { min-width: 0; }
.about-intro-copy > p:not(.eyebrow) { margin: 30px 0; }
.about-packaging { position: relative; display: flex; justify-content: center; align-items: center; min-width: 0; padding: 24px 12px; }
.about-packaging img { width: 51%; height: clamp(260px, 32vw, 440px); object-fit: contain; filter: drop-shadow(0 14px 12px rgba(65, 40, 15, .14)); }
.about-packaging img:first-child { transform: rotate(-9deg); z-index: 1; }
.about-packaging img:last-child { margin-left: -7%; transform: translateY(18px) rotate(8deg); }
.about-story-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 6vw, 88px); align-items: center; }
.about-story-grid > * { min-width: 0; }
.about-page h2 { font-size: clamp(32px, 3.7vw, 54px); line-height: 1.2; }
.about-story h2 { margin: 0 0 28px; }
.about-story p:not(.eyebrow) { max-width: 490px; color: #54504b; }
.about-food { overflow: hidden; border-radius: 24px; background: #fff9f1; }
.about-food img { width: 100%; height: 400px; object-fit: cover; object-position: 22% 75%; }
.about-values { background: #fff9f1; }
.about-values .section-heading { margin: 0 auto 48px; text-align: center; }
.about-values-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.about-values-grid article { text-align: center; }
.about-values-grid img { display: block; width: 130px; height: 130px; object-fit: contain; margin: 0 auto 20px; }
.about-values-grid h3 { font-size: 20px; line-height: 1.3; margin: 0; }
@media (max-width: 768px) {
  .about-intro-grid, .about-story-grid { grid-template-columns: 1fr; gap: 32px; }
  .about-intro-copy { text-align: center; }
  .about-page .about-intro-copy h1 { font-size: clamp(38px, 9vw, 64px); }
  .about-intro-copy > p:not(.eyebrow) { margin: 26px auto; }
  .about-intro-copy .button { max-width: 100%; padding-inline: 16px; font-size: 11px; }
  .about-packaging { max-width: 400px; margin-inline: auto; padding-block: 8px 20px; }
  .about-packaging img { height: 270px; }
  .about-food img { height: 290px; }
  .about-values-grid { grid-template-columns: 1fr; gap: 36px; }
  .about-values-grid article { display: flex; align-items: center; gap: 24px; max-width: 340px; width: 100%; margin: auto; text-align: left; }
  .about-values-grid img { width: 90px; height: 90px; flex: 0 0 90px; margin: 0; }
  .about-values-grid h3 { font-size: 18px; }
  .about-page .final-cta h2 { font-size: clamp(28px, 7vw, 44px); }
}
.page-main h1, .page-main h2, .page-main h3 { font-family: 'Archivo Black', Manrope, sans-serif; font-weight: 400; font-synthesis: none; letter-spacing: -.035em; }
.page-hero h1 { font-size: clamp(38px, 5.5vw, 80px); line-height: 1.12; }
.page-hero p:not(.eyebrow) { font-size: 17px; max-width: 540px; }
.brand-underline { position: relative; display: inline-block; }
.brand-underline::after { content: ''; position: absolute; left: -2%; bottom: -.18em; width: 104%; height: .24em; background: url('../images/decorativos/subrayado-marcador.svg') center / 100% 100% no-repeat; pointer-events: none; }
.industries-section::before, .industries-section::after,
.products-section::before, .private-label-section::before,
.certifications-section::before, .certifications-section::after { content: none; }
.industries-section, .products-section { background: #fff; }
.certifications-section { background: #fff9f1; }
.home .industry-icon { width: 160px; height: 150px; }
.home .industry-icon img { width: 100%; height: 100%; object-fit: contain; }
.home .certification-card { border: 0; border-radius: 0; background: transparent; box-shadow: none; gap: 24px; overflow: visible; min-height: 0; }
.home .certification-item { align-items: center; justify-content: flex-start; text-align: center; padding: 12px 8px; border: 0; }
.home .certification-item:hover { background: transparent; }
.home .certification-icon-image { width: 144px; height: 144px; margin-bottom: 20px; }
.home .certification-item h3 { font-size: 18px; max-width: 220px; line-height: 1.3; }
.private-label-lead { max-width: 390px; margin: 28px 0 32px; }
.page-main .content-section, .page-main .about-section { padding-block: var(--section-space); }
.page-main .page-hero { padding-block: var(--section-space); }
.page-main .page-hero h1 .brand-underline, .about-copy h2 span { color: var(--color-primary); }
.page-main .feature-grid article { background: transparent; border: 0; border-top: 2px solid var(--color-orange); border-radius: 0; padding: 28px 12px; }
.page-main .feature-grid h2 { font-size: clamp(24px, 2.5vw, 34px); }
.page-main .feature-grid article > span { color: var(--color-primary); }
.page-main .benefits-card { box-shadow: none; border-radius: 0; }
.page-main .benefit-item { flex-direction: column; text-align: center; }
.page-main .benefit-item h2 { font-size: 19px; }
.final-cta-section { padding-block: var(--section-space) calc(var(--section-space) + 36px); }
.final-cta .final-cta-copy { max-width: 68%; }
.final-cta .final-cta-product { position: absolute; width: 235px; max-height: 370px; right: 4%; bottom: -36px; }
.final-cta h2 { line-height: 1.18; }
.final-cta .button { margin-top: 10px; }
.page-main .contact-layout > *, .page-main .split > * { min-width: 0; }
.contact-panel a { overflow-wrap: anywhere; }
@media (max-width: 768px) {
  .home .industries-grid, .home .certification-card { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 16px; }
  .home .industry-card { padding: 0; }
  .home .industry-icon { width: 132px; height: 126px; }
  .home .industry-copy h3 { font-size: 17px; margin-top: 16px; }
  .home .certification-icon-image { width: 116px; height: 116px; }
  .home .certification-item h3 { font-size: 16px; }
  .page-main .feature-grid, .page-main .contact-layout, .page-main .private-page-hero .split { grid-template-columns: 1fr; gap: 32px; }
  .page-main .private-page-hero .split { min-height: 0; }
  .page-main .private-page-hero .private-bag { width: 210px; height: 300px; }
  .page-main .page-hero h1 { font-size: clamp(34px, 7.8vw, 54px); }
  .page-main .page-hero p:not(.eyebrow) { font-size: 16px; }
  .final-cta { min-height: 510px; padding: 36px 24px 235px; }
  .final-cta .final-cta-copy { max-width: 100%; }
  .final-cta .final-cta-product { width: 165px; max-height: 250px; right: 8%; bottom: -28px; }
  .final-cta h2 { font-size: clamp(28px, 7vw, 44px); }
  .page-main .hero-actions { flex-wrap: wrap; }
  .page-main .hero-actions .button { max-width: 100%; white-space: normal; }
}