/* ============================================================
   KOYAMA — Stylesheet v3
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,400;0,600;0,700;0,800;1,800;1,900&family=Barlow:ital,wght@0,400;0,500;0,600;0,700;0,900;1,900&display=swap');

/*
@font-face {
  font-family: 'Acumin';
  src: url('../fonts/acumin-condensed-bold.woff2') format('woff2');
  font-weight: 700 900; font-style: normal; font-display: swap;
}
*/


/*
@font-face {
  font-family: 'Acumin';
  src: url('../fonts/acumin-regular.woff2') format('woff2');
  font-weight: 400 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Gilroy';
  src: url('../fonts/gilroy-black-italic.woff2') format('woff2');
  font-weight: 900; font-style: italic; font-display: swap;
}
*/

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --red:        #E31E24;
  --black:      #111111;
  --dark:       #1a1a1a;
  --white:      #ffffff;
  --gray:       #f5f5f5;
  --font-title: 'Barlow Condensed', sans-serif;
  --font-hero:  'Barlow Condensed', sans-serif;
  --font-body:  'Barlow', sans-serif;
}

html { scroll-behavior: smooth; }
html { overflow-x: hidden; max-width: 100%; }
body { font-family: var(--font-body); color: var(--black); background: var(--white); overflow-x: hidden; max-width: 100%; width: 100%; }
img  { display: block; max-width: 100%; }
a    { text-decoration: none; color: inherit; }
ul   { list-style: none; }
.container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 24px; }

/* ============================================================
   TOP BAR
   ============================================================ */
.topbar { background: var(--black); padding: 7px 0; font-size: 12px; color: #aaa; }
.topbar .container { display: flex; align-items: center; justify-content: space-between; }
.topbar-left { display: flex; align-items: center; }
.lang-switch { display: flex; align-items: center; gap: 6px; color: #ccc; font-size: 12px; }
.lang-switch span { cursor: pointer; transition: color .2s; }
.lang-switch span:hover { color: var(--white); }
.lang-switch .sep { color: #555; }
.lang-switch .active { color: var(--white); font-weight: 600; }
.topbar-right { display: flex; align-items: center; gap: 18px; }
.topbar-social a { color: #ccc; font-size: 14px; transition: color .2s; display: inline-flex; align-items: center; gap: 8px; }
.topbar-social a:hover { color: var(--white); }
.topbar-contact a { display: flex; align-items: center; gap: 6px; color: #ccc; font-size: 12px; transition: color .2s; }
.topbar-contact a:hover { color: var(--white); }

/* ============================================================
   NAVIGATION
   ============================================================ */
.navbar { background: var(--black); position: sticky; top: 0; z-index: 1000; box-shadow: 0 2px 20px rgba(0,0,0,.5); }
.navbar .container { display: flex; align-items: center; justify-content: space-between; height: 68px; }
.nav-logo img { height: 42px; width: auto; }
.nav-right { display: flex; align-items: center; gap: 24px; }
.nav-menu { display: flex; align-items: center; gap: 24px; }
.nav-menu a {
  font-family: var(--font-title); font-weight: 700; font-size: 14px;
  letter-spacing: 1px; text-transform: uppercase; color: var(--white);
  position: relative; padding-bottom: 3px; transition: color .2s; white-space: nowrap;
  background: none; border: none; cursor: pointer;
}
.nav-menu a::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: var(--red); transition: width .25s; }
.nav-menu a:hover { color: var(--red); }
.nav-menu a:hover::after { width: 100%; }
.nav-menu a.active::after { width: 100%; }
.nav-cta {
  font-family: var(--font-title); font-weight: 700; font-size: 14px;
  letter-spacing: 1px; text-transform: uppercase;
  color: var(--white); background: var(--red);
  border: 1.5px solid var(--red); padding: 7px 18px;
  white-space: nowrap; transition: background .2s;
}
.nav-cta:hover { background: #c5191e; border-color: #c5191e; }
.nav-toggle { display: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 4px; background: none; border: none; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: var(--white); transition: all .3s; }
.nav-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity: 0; }
.nav-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ============================================================
   HERO — HOME
   ============================================================ */
.hero-home { position: relative; width: 100%; height: 560px; overflow: hidden; }
.hero-home img.hero-bg { width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.hero-home::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.1) 30%, rgba(0,0,0,.55) 100%); }
.hero-home .hero-content { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: flex-end; padding: 0 60px; }
.hero-home .hero-text { text-align: right; max-width: 520px; }
.hero-home .hero-text h1 { font-family: var(--font-hero); font-style: italic; font-weight: 900; font-size: clamp(42px,5.5vw,72px); line-height: .95; text-transform: uppercase; color: var(--white); letter-spacing: -1px; text-shadow: 2px 2px 20px rgba(0,0,0,.4); }
.hero-home .hero-text p { font-family: var(--font-body); font-size: clamp(14px,1.5vw,17px); color: rgba(255,255,255,.9); margin-top: 12px; line-height: 1.5; }

/* ============================================================
   SECCIÓN — ELIGE LA CALIDAD
   ============================================================ */
.seccion-calidad {
  position: relative; overflow: visible; z-index: 1;
  background-color: var(--black);
  /* CON IMAGEN: descomenta la siguiente línea y pon tu archivo
  background-image: url('../images/fondo-seccion.jpg');
  background-size: cover; background-position: center; */
}
.seccion-calidad .container { display: grid; grid-template-columns: 1fr 1fr; align-items: flex-end; min-height: 440px; gap: 40px; padding-top: 60px; padding-bottom: 0; }
.seccion-calidad .sc-text { position: relative; z-index: 2; padding-bottom: 60px; }
.seccion-calidad::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 22px 22px; opacity: 1; }
.seccion-calidad .sc-text h2 { font-family: var(--font-title); font-weight: 800; font-size: clamp(28px,3.5vw,48px); text-transform: uppercase; color: var(--white); line-height: 1.05; letter-spacing: -.5px; margin-bottom: 20px; }
.seccion-calidad .sc-text p { font-family: var(--font-body); font-size: 14px; color: rgba(255,255,255,.7); line-height: 1.7; max-width: 420px; margin-bottom: 36px; }
.btn-red { display: inline-block; font-family: var(--font-title); font-weight: 700; font-size: 14px; letter-spacing: 1.5px; text-transform: uppercase; background: var(--red); color: var(--white); padding: 14px 32px; transition: background .2s, transform .2s; }
.btn-red:hover { background: #c5191e; transform: translateY(-1px); }
.seccion-calidad .sc-image { display: flex; justify-content: center; align-items: flex-end; position: relative; z-index: 3; margin-bottom: -80px; }
.seccion-calidad .sc-image img { max-height: 480px; object-fit: contain; filter: drop-shadow(0 20px 50px rgba(0,0,0,.7)); }

/* ============================================================
   CAROUSEL
   ============================================================ */
.productos-carousel { background: var(--white); padding: 110px 0 120px; position: relative; z-index: 0; }
.carousel-wrapper { position: relative; overflow: hidden; }
.carousel-track { display: flex; transition: transform .5s cubic-bezier(.25,.46,.45,.94); }
.carousel-slide { flex: 0 0 25%; padding: 0 16px; text-align: center; }
.carousel-slide img { width: 100%; max-width: 200px; height: 180px; object-fit: contain; margin: 0 auto 20px; transition: transform .3s; }
.carousel-slide:hover img { transform: scale(1.05); }
.carousel-slide h3 { font-family: var(--font-title); font-weight: 700; font-size: 15px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--black); margin-bottom: 10px; }
.carousel-slide p { font-family: var(--font-body); font-size: 13px; color: #555; line-height: 1.5; margin-bottom: 14px; min-height: 56px; }
.link-red { font-family: var(--font-title); font-weight: 700; font-size: 13px; letter-spacing: 1px; text-transform: uppercase; color: var(--red); display: inline-flex; align-items: center; gap: 6px; transition: gap .2s; }
.link-red:hover { gap: 10px; }
.carousel-btn { position: absolute; top: 50%; transform: translateY(-50%); width: 32px; height: 70px; background: var(--red); color: var(--white); border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 13px; z-index: 10; transition: background .2s; }
.carousel-btn:hover { background: #c5191e; }
.carousel-btn.prev { left: 0; }
.carousel-btn.next { right: 0; }
.carousel-dots { display: flex; justify-content: center; gap: 8px; margin-top: 32px; }
.carousel-dots span { width: 10px; height: 10px; border-radius: 50%; background: #ddd; cursor: pointer; transition: background .2s; }
.carousel-dots span.active { background: var(--red); }

/* ============================================================
   CTA — ENCUENTRA TU PRODUCTO
   ============================================================ */
.cta-encuentra { background: linear-gradient(180deg,#8B0000 0%,#C8191F 40%,#E31E24 100%); position: relative; overflow: visible; z-index: 1; }
.cta-encuentra::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle,rgba(0,0,0,.12) 1px,transparent 1px); background-size: 20px 20px; pointer-events: none; z-index: 0; }
.cta-encuentra .container { display: grid; grid-template-columns: 1fr 1fr; align-items: center; min-height: 300px; gap: 40px; position: relative; z-index: 2; }
.cta-encuentra .cta-text { padding: 60px 0 50px; }
.cta-encuentra .cta-text h2 { font-family: var(--font-title); font-style: italic; font-weight: 900; font-size: clamp(32px,4vw,52px); text-transform: uppercase; color: var(--white); line-height: 1; margin-bottom: 10px; }
.cta-encuentra .cta-text p { font-family: var(--font-body); font-size: 14px; color: rgba(255,255,255,.85); margin-bottom: 28px; }
.btn-dark { display: inline-block; font-family: var(--font-title); font-weight: 700; font-size: 14px; letter-spacing: 1.5px; text-transform: uppercase; background: var(--black); color: var(--white); padding: 14px 32px; transition: background .2s; }
.btn-dark:hover { background: #333; }
.cta-encuentra .cta-image { display: flex; align-items: flex-end; justify-content: center; position: relative; margin-top: -60px; }
.cta-encuentra .cta-image img { max-height: 420px; object-fit: contain; filter: drop-shadow(0 -10px 40px rgba(0,0,0,.35)) drop-shadow(0 20px 40px rgba(0,0,0,.3)); }

/* ============================================================
   FOOTER — datos de contacto ocultos (solo visibles en modal)
   ============================================================ */
footer {
  position: relative;
  color: var(--white);
  background-color: var(--dark);
  background-image: url('../images/fondo-footer.jpg');  /* ← agrega esto */
  background-size: cover;
  background-position: center top;
}
footer::before { content: ''; position: absolute; inset: 0; background: rgba(10,10,10,0.22); pointer-events: none; z-index: 0; }
.footer-main, .footer-bottom { position: relative; z-index: 1; }
.footer-main { padding: 50px 0 40px; border-bottom: 1px solid rgba(255,255,255,.08); }
.footer-main .container { display: grid; grid-template-columns: 1.3fr 1fr 1.3fr; gap: 60px; }
.footer-newsletter h4 { font-family: var(--font-title); font-weight: 800; font-style: italic; font-size: 28px; letter-spacing: 1px; text-transform: uppercase; color: var(--red); margin-bottom: 16px; }
.newsletter-form { display: flex; flex-direction: column; gap: 10px; }
.newsletter-form input[type="email"] { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.15); color: var(--white); padding: 11px 14px; font-family: var(--font-body); font-size: 13px; outline: none; transition: border-color .2s; }
.newsletter-form input[type="email"]::placeholder { color: rgba(255,255,255,.35); }
.newsletter-form input[type="email"]:focus { border-color: var(--red); }
.newsletter-form .recaptcha-note { font-size: 11px; color: rgba(255,255,255,.3); }
.newsletter-form button { font-family: var(--font-title); font-weight: 700; font-size: 13px; letter-spacing: 1px; text-transform: uppercase; background: var(--red); color: var(--white); border: none; padding: 11px 24px; cursor: pointer; align-self: flex-start; transition: background .2s; }
.newsletter-form button:hover { background: #c5191e; }
.footer-social { margin-top: 24px; }
.footer-social h5 { font-family: var(--font-title); font-weight: 700; font-size: 13px; letter-spacing: 2px; text-transform: uppercase; color: var(--red); margin-bottom: 10px; }
.social-icons { display: flex; gap: 12px; }
.social-icons a { width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.2); display: flex; align-items: center; justify-content: center; color: var(--white); font-size: 15px; transition: border-color .2s, background .2s; }
.social-icons a:hover { border-color: var(--red); background: var(--red); }
.footer-nav h4 { font-family: var(--font-title); font-weight: 700; font-size: 14px; letter-spacing: 2px; text-transform: uppercase; color: rgba(255,255,255,.5); margin-bottom: 18px; }
.footer-nav ul li { margin-bottom: 10px; }
.footer-nav ul li a { font-family: var(--font-body); font-size: 13px; color: rgba(255,255,255,.65); transition: color .2s; }
.footer-nav ul li a:hover { color: var(--red); }
.footer-nav ul li a.red { color: var(--red); }
.footer-bottom { padding: 20px 0; }
.footer-bottom .container { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.footer-logo img { height: 32px; }
.footer-bottom p { font-size: 11px; color: rgba(255,255,255,.3); }
.footer-bottom-links { display: flex; gap: 14px; flex-wrap: wrap; }
.footer-bottom-links a { font-size: 11px; color: rgba(255,255,255,.3); transition: color .2s; }
.footer-bottom-links a:hover { color: var(--white); }

/* ============================================================
   MODAL — QUIERO SER DISTRIBUIDOR
   ============================================================ */
.modal-overlay { position: fixed; inset: 0; z-index: 9000; background: rgba(0,0,0,.78); display: flex; align-items: center; justify-content: center; padding: 20px; opacity: 0; pointer-events: none; transition: opacity .3s; }
.modal-overlay.active { opacity: 1; pointer-events: all; }
.modal-box { background: var(--white); width: 100%; max-width: 580px; position: relative; transform: translateY(30px); transition: transform .35s; max-height: 92vh; overflow-y: auto; }
.modal-overlay.active .modal-box { transform: translateY(0); }
.modal-header { background: var(--black); padding: 22px 28px; display: flex; align-items: center; justify-content: space-between; gap: 16px; position: sticky; top: 0; z-index: 2; }
.modal-header h2 { font-family: var(--font-title); font-weight: 800; font-size: 20px; letter-spacing: 1px; text-transform: uppercase; color: var(--white); line-height: 1.1; }
.modal-header h2 span { color: var(--red); }
.modal-close { background: none; border: none; color: rgba(255,255,255,.6); font-size: 22px; cursor: pointer; padding: 0; line-height: 1; transition: color .2s; flex-shrink: 0; }
.modal-close:hover { color: var(--red); }
.modal-body { padding: 28px; }
.modal-form-screen, .modal-thanks-screen { display: none; }
.modal-form-screen.visible, .modal-thanks-screen.visible { display: block; }
.modal-body .form-group { margin-bottom: 14px; }
.modal-body label { display: block; font-family: var(--font-title); font-weight: 700; font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; color: #666; margin-bottom: 5px; }
.modal-body label .required { color: var(--red); }
.modal-body input, .modal-body textarea, .modal-body select { width: 100%; padding: 11px 14px; border: 1.5px solid #e0e0e0; font-family: var(--font-body); font-size: 14px; color: var(--black); outline: none; transition: border-color .2s; background: #fff; -webkit-appearance: none; }
.modal-body input:focus, .modal-body textarea:focus, .modal-body select:focus { border-color: var(--red); }
.modal-body textarea { resize: vertical; min-height: 90px; }
.zona-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.modal-submit { width: 100%; padding: 15px; font-family: var(--font-title); font-weight: 700; font-size: 16px; letter-spacing: 2px; text-transform: uppercase; background: var(--red); color: var(--white); border: none; cursor: pointer; margin-top: 10px; transition: background .2s; }
.modal-submit:hover { background: #c5191e; }
.modal-submit:disabled { background: #ccc; cursor: not-allowed; }

/* Pantalla de agradecimiento */
.modal-thanks-screen { text-align: center; }
.thanks-icon { font-size: 54px; margin-bottom: 14px; display: block; }
.modal-thanks-screen h3 { font-family: var(--font-title); font-weight: 800; font-size: 26px; text-transform: uppercase; color: var(--black); margin-bottom: 8px; }
.modal-thanks-screen > p { font-family: var(--font-body); font-size: 14px; color: #555; line-height: 1.6; margin-bottom: 22px; }
.modal-contact-data { background: var(--black); padding: 20px 22px; text-align: left; margin-bottom: 20px; }
.modal-contact-data h4 { font-family: var(--font-title); font-weight: 700; font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: var(--red); margin-bottom: 14px; }
.modal-contact-data ul li { display: flex; align-items: flex-start; gap: 10px; font-family: var(--font-body); font-size: 13px; color: rgba(255,255,255,.8); margin-bottom: 8px; line-height: 1.4; }
.modal-contact-data ul li .icon { color: var(--red); flex-shrink: 0; margin-top: 1px; }
.btn-cerrar-modal { font-family: var(--font-title); font-weight: 700; font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase; background: transparent; border: 1.5px solid #ddd; color: #888; padding: 10px 28px; cursor: pointer; transition: all .2s; }
.btn-cerrar-modal:hover { border-color: var(--black); color: var(--black); }

/* ============================================================
   PRODUCTOS PAGE
   ============================================================ */
.hero-productos { position: relative; width: 100%; height: auto; overflow: hidden; background: var(--red); }
.hero-productos img.hero-bg-productos { width: 100%; display: block; }
.hero-productos .container { position: absolute; inset: 0; height: 100%; display: flex; align-items: center; justify-content: flex-end; z-index: 2; }
.hero-productos .hp-text { text-align: right; max-width: 420px; }
.hero-productos .hp-text h1 { font-family: var(--font-hero); font-style: italic; font-weight: 900; font-size: clamp(36px,5vw,64px); text-transform: uppercase; color: var(--white); line-height: 1; text-shadow: 2px 2px 20px rgba(0,0,0,.3); }
.hero-productos .hp-text p { font-family: var(--font-body); font-size: 14px; color: rgba(255,255,255,.9); max-width: 380px; margin-top: 10px; line-height: 1.5; }
.productos-grid { background: var(--white); padding: 70px 0 60px; }
.productos-grid .container { display: grid; grid-template-columns: repeat(3,1fr); gap: 50px 40px; }
.product-card { text-align: center; }
.product-card img { width: 100%; max-width: 220px; height: 180px; object-fit: contain; margin: 0 auto 20px; transition: transform .3s; }
.product-card:hover img { transform: scale(1.05); }
.product-card h3 { font-family: var(--font-title); font-weight: 700; font-size: 15px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--black); margin-bottom: 10px; }
.product-card p { font-family: var(--font-body); font-size: 13px; color: #555; line-height: 1.5; margin-bottom: 14px; }
.product-card .link-red { justify-content: center; }

/* ============================================================
   BLOG PAGE
   ============================================================ */
.page-hero { background: var(--black); position: relative; overflow: hidden; }
.page-hero::before { content: ''; position: absolute; inset: 0; background-image: radial-gradient(circle,rgba(255,255,255,.04) 1px,transparent 1px); background-size: 22px 22px; }
.page-hero .container { position: relative; z-index: 2; padding-top: 52px; padding-bottom: 52px; }
.page-hero h1 { font-family: var(--font-hero); font-style: italic; font-weight: 900; font-size: clamp(36px,5vw,60px); text-transform: uppercase; color: var(--white); }
.page-hero h1 span { color: var(--red); }
.page-hero p { font-family: var(--font-body); font-size: 15px; color: rgba(255,255,255,.7); margin-top: 8px; }

.section-title { display: flex; align-items: center; gap: 14px; margin-bottom: 40px; }
.section-title h2 { font-family: var(--font-title); font-weight: 800; font-size: 20px; letter-spacing: 2px; text-transform: uppercase; color: var(--black); white-space: nowrap; }
.section-title h2 i { color: var(--red); margin-right: 6px; }
.section-title .title-line { flex: 1; height: 2px; background: #eee; }

/* Instagram section */
.instagram-section { background: var(--gray); padding: 70px 0; }
.ig-connect-note { background: #fff8e1; border-left: 4px solid #ffc107; padding: 14px 18px; margin-bottom: 30px; font-size: 13px; color: #7a5c00; line-height: 1.5; }
.ig-connect-note strong { display: block; margin-bottom: 4px; font-size: 14px; }
.instagram-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.instagram-card { background: var(--white); overflow: hidden; box-shadow: 0 2px 16px rgba(0,0,0,.07); transition: transform .3s, box-shadow .3s; }
.instagram-card:hover { transform: translateY(-4px); box-shadow: 0 10px 30px rgba(0,0,0,.13); }
.instagram-card .ig-image { position: relative; aspect-ratio: 1; overflow: hidden; background: #e9e9e9; }
.instagram-card .ig-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.instagram-card:hover .ig-image img { transform: scale(1.06); }
.ig-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .3s; }
.instagram-card:hover .ig-overlay { opacity: 1; }
.ig-overlay i { color: var(--white); font-size: 30px; }
.instagram-card .ig-body { padding: 16px; }
.instagram-card .ig-body p { font-family: var(--font-body); font-size: 13px; color: #444; line-height: 1.5; margin-bottom: 10px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ig-link { font-family: var(--font-title); font-weight: 700; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; color: var(--red); display: inline-flex; align-items: center; gap: 5px; transition: gap .2s; }
.ig-link:hover { gap: 8px; }

/* Blog articles */
.blog-articles { background: var(--white); padding: 70px 0; }
.blog-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; }
.blog-card { border: 1px solid #eee; overflow: hidden; transition: box-shadow .3s, transform .3s; }
.blog-card:hover { box-shadow: 0 8px 30px rgba(0,0,0,.1); transform: translateY(-3px); }
.blog-card .blog-img { aspect-ratio: 16/9; overflow: hidden; background: #eee; }
.blog-card .blog-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.blog-card:hover .blog-img img { transform: scale(1.05); }
.blog-card .blog-body { padding: 20px; }
.blog-cat { font-family: var(--font-title); font-weight: 700; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--red); margin-bottom: 8px; }
.blog-card h3 { font-family: var(--font-title); font-weight: 700; font-size: 18px; text-transform: uppercase; color: var(--black); line-height: 1.2; margin-bottom: 10px; }
.blog-card p { font-family: var(--font-body); font-size: 13px; color: #666; line-height: 1.5; margin-bottom: 14px; }
.blog-meta { display: flex; align-items: center; justify-content: space-between; font-size: 11px; color: #aaa; }
.blog-empty { grid-column: 1/-1; text-align: center; padding: 60px 20px; }
.blog-empty i { font-size: 44px; color: #ddd; display: block; margin-bottom: 14px; }
.blog-empty p { font-family: var(--font-body); font-size: 15px; color: #aaa; }

/* ============================================================
   CATÁLOGO — PDF VIEWER
   ============================================================ */
.catalogo-hero { background: var(--black); padding: 36px 0; }
.catalogo-hero .container { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; }
.catalogo-hero h1 { font-family: var(--font-hero); font-style: italic; font-weight: 900; font-size: clamp(28px,4vw,52px); text-transform: uppercase; color: var(--white); }
.catalogo-hero h1 span { color: var(--red); }
.catalogo-search { display: flex; align-items: stretch; max-width: 400px; width: 100%; }
.catalogo-search input { flex: 1; padding: 11px 14px; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.08); color: var(--white); font-family: var(--font-body); font-size: 14px; outline: none; transition: border-color .2s; }
.catalogo-search input::placeholder { color: rgba(255,255,255,.35); }
.catalogo-search input:focus { border-color: var(--red); }
.catalogo-search button { padding: 11px 16px; background: var(--red); color: var(--white); border: none; cursor: pointer; font-size: 15px; transition: background .2s; }
.catalogo-search button:hover { background: #c5191e; }

.catalogo-toolbar { background: #1c1c1c; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.catalogo-toolbar .container { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.cat-nav { display: flex; align-items: center; gap: 8px; }
.cat-btn { background: rgba(255,255,255,.08); color: var(--white); border: 1px solid rgba(255,255,255,.12); padding: 6px 14px; font-family: var(--font-title); font-weight: 700; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; cursor: pointer; transition: background .2s; }
.cat-btn:hover, .cat-btn:disabled { background: var(--red); border-color: var(--red); }
.cat-btn:disabled { opacity: .5; cursor: not-allowed; background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.12); }
.cat-page-info { font-family: var(--font-body); font-size: 13px; color: rgba(255,255,255,.5); }
.cat-download { display: inline-flex; align-items: center; gap: 7px; font-family: var(--font-title); font-weight: 700; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; color: var(--white); border: 1px solid rgba(255,255,255,.2); padding: 6px 14px; transition: all .2s; }
.cat-download:hover { background: var(--red); border-color: var(--red); }

.search-banner { background: var(--red); color: var(--white); padding: 10px 24px; font-family: var(--font-body); font-size: 13px; display: none; }
.search-banner.visible { display: flex; align-items: center; gap: 10px; justify-content: space-between; }
.search-banner button { background: none; border: none; color: var(--white); cursor: pointer; font-size: 16px; }

.catalogo-viewer { background: #2a2a2a; padding: 30px 20px 50px; min-height: 80vh; display: flex; flex-direction: column; align-items: center; }
#pdf-render-area { width: 100%; max-width: 860px; }
#pdf-render-area canvas { width: 100% !important; height: auto !important; display: block; box-shadow: 0 8px 40px rgba(0,0,0,.6); margin-bottom: 20px; background: white; }
.pdf-loading { color: rgba(255,255,255,.5); text-align: center; padding: 80px 20px; }
.pdf-loading i { font-size: 36px; display: block; margin-bottom: 12px; animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ============================================================
   RESPONSIVE
   ============================================================ */
   /* Nav layout (responsive handled in @media blocks below) */
@media (max-width: 1024px) {
  .nav-menu { gap: 18px; }
  .nav-menu a { font-size: 13px; letter-spacing: .5px; }
  .nav-right { gap: 18px; }
}
@media (max-width: 900px) {
  .seccion-calidad .container { grid-template-columns: 1fr; text-align: center; padding-top: 50px; padding-bottom: 0; }
  .seccion-calidad .sc-text { padding-bottom: 20px; }
  .seccion-calidad .sc-image {
    margin-bottom: -100px;
    justify-content: center;
    position: relative;
    z-index: 4;
  }
  .seccion-calidad .sc-image img { max-height: 340px; }
  .seccion-calidad .sc-text p { max-width: 100%; }
  .productos-carousel { padding: 120px 0 60px; }
  .cta-encuentra .container { grid-template-columns: 1fr; }
  .cta-encuentra .cta-image { display: none; }
  .footer-main .container { grid-template-columns: 1fr; gap: 36px; }
  .hero-productos .container { justify-content: center; }
  .hero-productos .hp-text { text-align: center; }
  .productos-grid .container { grid-template-columns: repeat(2,1fr); }
  .instagram-grid { grid-template-columns: 1fr 1fr; }
  .blog-grid { grid-template-columns: 1fr 1fr; }
  .zona-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .topbar { display: none; }
  .nav-toggle { display: flex; }
  .nav-right { display: none; position: absolute; top: 68px; left: 0; width: 100%; background: var(--black); flex-direction: column; padding: 20px 24px 30px; gap: 0; border-top: 1px solid rgba(255,255,255,.08); }
  .nav-right.open { display: flex; }
  .nav-menu { flex-direction: column; align-items: flex-start; gap: 0; width: 100%; }
  .nav-menu a { display: block; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.06); width: 100%; }
  .nav-menu a::after { display: none; }
  .nav-cta { margin-top: 16px; display: block; text-align: center; padding: 12px 20px; }
  .navbar .container { position: relative; }
  .hero-home { height: 420px; }
  .hero-home .hero-content { justify-content: center; padding: 0 24px; }
  .hero-home .hero-text { text-align: center; max-width: 100%; }
  .carousel-slide { flex: 0 0 50%; }
  .footer-bottom .container { flex-direction: column; align-items: flex-start; }
  .instagram-grid { grid-template-columns: 1fr; }
  .blog-grid { grid-template-columns: 1fr; }
  .catalogo-hero .container { flex-direction: column; align-items: flex-start; }
  .catalogo-search { max-width: 100%; }
}
@media (max-width: 500px) {
  .hero-home { height: 360px; }
  .carousel-slide { flex: 0 0 100%; }
  .productos-grid .container { grid-template-columns: 1fr; }
}

/* ============================================================
   ESTILOS ADICIONALES — Footer, Modal, Nav mobile tagline
   ============================================================ */

/* Footer links sin enlace */
.footer-link {
  font-family: var(--font-title);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,.8);
  cursor: default;
  display: block;
  margin-bottom: 12px;
}
.footer-link.red { color: var(--red); }

/* Footer contact */
.footer-contact ul { list-style: none; padding: 0; margin: 0; }
.footer-contact ul li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 14px;
  font-family: var(--font-body);
  font-size: 13px;
  color: rgba(255,255,255,.75);
  line-height: 1.5;
}
.footer-contact ul li .icon { color: var(--red); flex-shrink: 0; margin-top: 2px; }
.footer-contact ul li strong {
  color: var(--white);
  display: block;
  font-family: var(--font-title);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

/* Footer 3 columnas */
.footer-main .container {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1.3fr;
  gap: 50px;
  align-items: start;
}

/* Newsletter input blanco */
.newsletter-form input[type="email"] {
  background: #ffffff;
  border: 1px solid #ddd;
  color: #111;
  padding: 12px 14px;
  font-family: var(--font-body);
  font-size: 13px;
  outline: none;
  transition: border-color .2s;
  width: 100%;
}
.newsletter-form input[type="email"]::placeholder { color: #aaa; }
.newsletter-form input[type="email"]:focus { border-color: var(--red); }

/* reCAPTCHA blanco */
.recaptcha-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.recaptcha-fake {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #ffffff;
  border: 1px solid #ddd;
  padding: 10px 12px;
  flex: 1;
  min-width: 160px;
}
.recaptcha-check {
  width: 18px; height: 18px;
  border: 1.5px solid #bbb;
  display: inline-block;
  flex-shrink: 0;
}
.recaptcha-label { font-size: 12px; color: #555; flex: 1; }
.recaptcha-logo { width: 28px; height: 28px; opacity: .5; }
.newsletter-form button {
  font-family: var(--font-title);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  background: var(--red);
  color: var(--white);
  border: none;
  padding: 11px 22px;
  cursor: pointer;
  white-space: nowrap;
  transition: background .2s;
}
.newsletter-form button:hover { background: #c5191e; }

/* Footer logo centrado */
.footer-logo-center {
  text-align: center;
  padding: 36px 0 28px;
  border-top: 1px solid rgba(255,255,255,.08);
  position: relative;
  z-index: 1;
}
.footer-logo-center img { height: 80px; margin: 0 auto; }

/* Nav mobile tagline */
.nav-mobile-tagline {
  display: none;
  font-family: var(--font-title);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: rgba(255,255,255,.5);
}

/* Footer responsive */
@media (max-width: 900px) {
  .footer-main .container {
    grid-template-columns: 1fr 1fr;
    gap: 36px;
  }
  .footer-newsletter { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .footer-main .container { grid-template-columns: 1fr; }
  .recaptcha-row { flex-direction: column; align-items: stretch; }
  .newsletter-form button { width: 100%; }
}

/* Nav mobile */
@media (max-width: 768px) {
  .nav-mobile-tagline { display: block; }
}
/* Dropdown productos - preview */
.nav-item-dropdown {
  position: relative;
}

.nav-arrow {
  font-size: 10px;
  margin-left: 6px;
}

.nav-submenu {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 270px;
  background: #080808;
  list-style: none;
  margin: 0;
  padding: 10px 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all 0.25s ease;
  z-index: 9999;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
}

.nav-item-dropdown:hover .nav-submenu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.nav-submenu li {
  margin: 0;
  padding: 0;
}

.nav-submenu a {
  display: block;
  padding: 12px 18px;
  color: #ffffff;
  font-size: 12px;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.nav-submenu a:hover {
  background: #e30613;
  color: #ffffff;
}

@media (max-width: 900px) {
  .nav-item-dropdown {
    width: 100%;
  }

  .nav-submenu {
    position: static;
    min-width: 100%;
    opacity: 1;
    visibility: visible;
    transform: none;
    box-shadow: none;
    background: transparent;
    padding: 0 0 0 15px;
    display: none;
  }

  .nav-item-dropdown:hover .nav-submenu {
    display: block;
  }

  .nav-submenu a {
    padding: 10px 0;
    font-size: 12px;
  }
}
/* =========================================================
   PREVIEW — Forzar header completo visible
   ========================================================= */

.navbar .container {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.nav-right {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.nav-menu {
  display: flex !important;
  align-items: center !important;
  gap: 28px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.nav-menu li {
  display: block !important;
}

.nav-menu a {
  display: inline-flex !important;
  align-items: center !important;
  color: #ffffff !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
}

.nav-cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #e30613 !important;
  color: #ffffff !important;
  padding: 10px 22px !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
}

.nav-mobile-tagline {
  display: none !important;
}

/* Dropdown productos */
.nav-item-dropdown {
  position: relative !important;
}

.nav-arrow {
  font-size: 10px !important;
  margin-left: 6px !important;
}

.nav-submenu {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  min-width: 270px !important;
  background: #080808 !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 10px 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(10px) !important;
  transition: all 0.25s ease !important;
  z-index: 9999 !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35) !important;
}

.nav-item-dropdown:hover .nav-submenu {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}

.nav-submenu li {
  margin: 0 !important;
  padding: 0 !important;
}

.nav-submenu a {
  display: block !important;
  padding: 12px 18px !important;
  color: #ffffff !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

.nav-submenu a:hover {
  background: #e30613 !important;
  color: #ffffff !important;
}
/* =========================================================
   REDISEÑO MENÚ PREVIEW KOYAMA
   ========================================================= */

.navbar-preview-redesign {
  background: #000;
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid rgba(255,255,255,.08);
  position: relative;
  z-index: 1000;
}

.navbar-preview-redesign .nav-main-row {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  min-height: 122px;
  padding: 0;
}

.navbar-preview-redesign .nav-logo {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 28px;
  min-width: 360px;
}

.navbar-preview-redesign .nav-logo img {
  max-height: 95px;
  width: auto;
}

.navbar-preview-redesign .nav-right {
  flex: 1;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
}

.navbar-preview-redesign .nav-menu {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  flex: 1;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.navbar-preview-redesign .nav-menu > li {
  display: flex;
  align-items: stretch;
  position: relative;
}

.navbar-preview-redesign .nav-menu > li > a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 190px;
  padding: 0 34px;
  height: 122px;
  font-family: var(--font-title);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  transition: background .2s ease, color .2s ease;
}

/* Hover general */
.navbar-preview-redesign .nav-menu > li > a:hover {
  color: #ff1a1a;
}

/* PRODUCTOS: se pinta de rojo al hover o cuando está activo */
.navbar-preview-redesign .nav-item-dropdown:hover > a,
.navbar-preview-redesign .nav-item-dropdown.is-current > a {
  background: #ff1414;
  color: #fff !important;
}

/* Flechita de productos */
.navbar-preview-redesign .nav-arrow {
  font-size: 10px;
  margin-left: 8px;
  transition: transform .2s ease;
}

.navbar-preview-redesign .nav-item-dropdown:hover .nav-arrow {
  transform: rotate(180deg);
}

/* Submenu */
.navbar-preview-redesign .nav-submenu {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 280px;
  background: #080808;
  list-style: none;
  margin: 0;
  padding: 10px 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all .25s ease;
  z-index: 9999;
  box-shadow: 0 12px 30px rgba(0,0,0,.35);
}

.navbar-preview-redesign .nav-item-dropdown:hover .nav-submenu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.navbar-preview-redesign .nav-submenu li {
  margin: 0;
  padding: 0;
}

.navbar-preview-redesign .nav-submenu a {
  display: block;
  padding: 12px 18px;
  color: #fff;
  font-size: 12px;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: .04em;
  transition: background .2s ease;
}

.navbar-preview-redesign .nav-submenu a:hover {
  background: #ff1414;
  color: #fff;
}

/* Catálogo a la derecha, con línea divisoria sutil */
.navbar-preview-redesign .nav-cta-link {
  min-width: 210px;
  height: 122px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-left: 1px solid rgba(255,255,255,.16);
  font-family: var(--font-title);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: .5px;
  text-transform: uppercase;
  text-decoration: none;
  color: #ff1414;
  background: transparent;
  transition: background .2s ease, color .2s ease;
}

.navbar-preview-redesign .nav-cta-link:hover,
.navbar-preview-redesign .nav-cta-link.active {
  background: rgba(255,255,255,.03);
  color: #ff1414;
}

/* Ocultar tagline del header simple */
.navbar-preview-redesign .nav-mobile-tagline {
  display: none !important;
}

/* Responsive básico */
@media (max-width: 1100px) {
  .navbar-preview-redesign .nav-logo {
    min-width: 260px;
    padding: 0 18px;
  }

  .navbar-preview-redesign .nav-logo img {
    max-height: 70px;
  }

  .navbar-preview-redesign .nav-menu > li > a {
    min-width: auto;
    padding: 0 20px;
    font-size: 13px;
  }

  .navbar-preview-redesign .nav-cta-link {
    min-width: 150px;
    font-size: 13px;
  }
}
/* =========================================================
   KOYAMA PREVIEW — HEADER FINAL COMO MOCKUP + FIJO
   ========================================================= */

/* Empuja el contenido para que no quede debajo del header fijo */
body {
  padding-top: 193px !important;
}

/* TOP BAR FIJA */
.topbar {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 70px !important;
  background: #000 !important;
  border-bottom: 1px solid rgba(255,255,255,.16) !important;
  z-index: 99999 !important;
}

.topbar .container {
  width: 100% !important;
  max-width: none !important;
  height: 70px !important;
  padding: 0 53px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.lang-switch {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-family: var(--font-title) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: .5px !important;
  color: #fff !important;
  text-transform: uppercase !important;
}

.lang-switch .sep {
  opacity: .7 !important;
}

.lang-switch .active {
  color: #fff !important;
}

.topbar-right {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
}

.topbar-social {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

.topbar-social a,
.topbar-contact a {
  color: #fff !important;
  text-decoration: none !important;
}

.topbar-social i {
  font-size: 20px !important;
}

.topbar-contact a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-family: var(--font-title) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: .4px !important;
  text-transform: uppercase !important;
}

.topbar-contact i {
  font-size: 22px !important;
}


/* NAVBAR FIJA */
.navbar-preview-redesign,
.navbar {
  position: fixed !important;
  top: 70px !important;
  left: 0 !important;
  right: 0 !important;
  height: 123px !important;
  background: #000 !important;
  border-bottom: 1px solid rgba(255,255,255,.15) !important;
  z-index: 99998 !important;
}

@media (max-width: 768px) {
.navbar, .navbar-preview-redesign {
top: 0 !important;
height: 90px !important;
}
}

/* Contenedor full width */
.navbar-preview-redesign .container,
.navbar .container,
.nav-main-row {
  width: 100% !important;
  max-width: none !important;
  height: 123px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: space-between !important;
}

/* Logo grande izquierda */
.nav-logo {
  width: 493px !important;
  min-width: 493px !important;
  height: 123px !important;
  padding: 0 0 0 105px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  background: #000 !important;
}

@media (max-width: 980px) {
.nav-logo { background: transparent !important;
height: 90px !important; }
}

.nav-logo img {
  width: auto !important;
  height: 82px !important;
  max-height: 82px !important;
  display: block !important;
}


/* Área derecha del menú */
.nav-right {
  flex: 1 !important;
  height: 123px !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: space-between !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Menú principal */
.nav-menu {
  height: 123px !important;
  flex: 1 !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.nav-menu > li {
  height: 123px !important;
  display: flex !important;
  align-items: stretch !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Links del menú */
.nav-menu > li > a {
  height: 123px !important;
  min-width: 205px !important;
  padding: 0 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: var(--font-title) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: .4px !important;
  line-height: 1 !important;
  color: #fff !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  background: transparent !important;
  transition: background .22s ease, color .22s ease !important;
}

/* Quiero ser distribuidor más ancho */
.nav-menu > li:nth-child(4) > a {
  min-width: 320px !important;
}

/* Hover general */
.nav-menu > li > a:hover {
  color: #ff1111 !important;
}

/* PRODUCTOS rojo al hover / activo */
.nav-item-dropdown:hover > a,
.nav-item-dropdown.is-current > a,
.nav-menu > li:first-child > a:hover {
  background: #f30000 !important;
  color: #fff !important;
}

/* Productos activo permanente si estás en página producto */
.nav-item-dropdown > a.active {
  background: #f30000 !important;
  color: #fff !important;
}

/* Flecha productos */
.nav-arrow {
  font-size: 10px !important;
  margin-left: 8px !important;
  transform: translateY(-1px) !important;
  transition: transform .2s ease !important;
}

.nav-item-dropdown:hover .nav-arrow {
  transform: rotate(180deg) translateY(1px) !important;
}


/* Catálogo a la derecha como mockup */
.nav-cta-link,
.nav-cta {
  width: 360px !important;
  min-width: 360px !important;
  height: 123px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-left: 1px solid rgba(255,255,255,.20) !important;
  background: transparent !important;
  color: #f30000 !important;
  font-family: var(--font-title) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: .4px !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transition: background .22s ease, color .22s ease !important;
}

.nav-cta-link:hover,
.nav-cta:hover,
.nav-cta-link.active,
.nav-cta.active {
  background: rgba(255,255,255,.035) !important;
  color: #f30000 !important;
}


/* Dropdown productos */
.nav-item-dropdown {
  position: relative !important;
}

.nav-submenu {
  position: absolute !important;
  top: 123px !important;
  left: 0 !important;
  min-width: 300px !important;
  background: #080808 !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 10px 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(10px) !important;
  transition: all .22s ease !important;
  z-index: 100000 !important;
  box-shadow: 0 18px 35px rgba(0,0,0,.4) !important;
}

.nav-item-dropdown:hover .nav-submenu {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}

.nav-submenu li {
  margin: 0 !important;
  padding: 0 !important;
}

.nav-submenu a {
  display: block !important;
  padding: 14px 20px !important;
  color: #fff !important;
  background: #080808 !important;
  font-family: var(--font-title) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  transition: background .2s ease, color .2s ease !important;
}

.nav-submenu a:hover {
  background: #f30000 !important;
  color: #fff !important;
}

/* Ocultar tagline anterior */
.nav-mobile-tagline {
  display: none !important;
}

/* Botón hamburguesa oculto en desktop */
.nav-toggle {
  display: none !important;
}


/* Ajuste para pantallas medianas */
@media (max-width: 1400px) {
  .nav-logo {
    width: 390px !important;
    min-width: 390px !important;
    padding-left: 70px !important;
  }

  .nav-logo img {
    height: 70px !important;
    max-height: 70px !important;
  }

  .nav-menu > li > a {
    min-width: 165px !important;
    font-size: 15px !important;
    padding: 0 20px !important;
  }

  .nav-menu > li:nth-child(4) > a {
    min-width: 260px !important;
  }

  .nav-cta-link,
  .nav-cta {
    width: 260px !important;
    min-width: 260px !important;
    font-size: 15px !important;
  }
}

/* Responsive móvil básico */
@media (max-width: 980px) {
  body {
    padding-top: 135px !important;
  }

  .topbar {
    height: 45px !important;
  }

  .topbar .container {
    height: 45px !important;
    padding: 0 18px !important;
  }

  .topbar-contact a {
    font-size: 0 !important;
  }

  .topbar-contact i {
    font-size: 18px !important;
  }

  .topbar-social i {
    font-size: 16px !important;
  }

  .navbar {
    top: 45px !important;
    height: 90px !important;
  }

  .navbar .container {
    height: 90px !important;
  }

  .nav-logo {
    width: auto !important;
    min-width: auto !important;
    height: 90px !important;
    padding-left: 20px !important;
  }

  .nav-logo img {
    height: 55px !important;
    max-height: 55px !important;
  }

  .nav-toggle {
    display: flex !important;
    margin-right: 20px !important;
  }

  .nav-right {
    display: none !important;
  }
}
/* =========================================================
   KOYAMA PREVIEW — MENÚ RESPONSIVE FUNCIONAL
   ========================================================= */

@media (max-width: 980px) {
  body {
    padding-top: 135px !important;
  }

  .topbar {
    height: 45px !important;
  }

  .topbar .container {
    height: 45px !important;
    padding: 0 18px !important;
  }

  .navbar {
    top: 45px !important;
    height: 90px !important;
  }

  .navbar .container {
    height: 90px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  .nav-logo {
    height: 90px !important;
    width: auto !important;
    min-width: auto !important;
    padding-left: 20px !important;
    padding-right: 0 !important;
  }

  .nav-logo img {
    height: 55px !important;
    max-height: 55px !important;
  }

  .nav-toggle {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 6px !important;
    width: 44px !important;
    height: 44px !important;
    margin-right: 20px !important;
    background: transparent !important;
    border: 0 !important;
    cursor: pointer !important;
    z-index: 100002 !important;
  }

  .nav-toggle span {
    display: block !important;
    width: 28px !important;
    height: 3px !important;
    background: #ffffff !important;
    transition: transform .25s ease, opacity .25s ease !important;
  }

  .nav-toggle.is-open span:nth-child(1) {
    transform: translateY(9px) rotate(45deg) !important;
  }

  .nav-toggle.is-open span:nth-child(2) {
    opacity: 0 !important;
  }

  .nav-toggle.is-open span:nth-child(3) {
    transform: translateY(-9px) rotate(-45deg) !important;
  }

  .nav-right {
    position: fixed !important;
    top: 135px !important;
    left: 0 !important;
    right: 0 !important;
    height: calc(100vh - 135px) !important;
    background: #050505 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    padding: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateX(100%) !important;
    transition: transform .3s ease, opacity .3s ease, visibility .3s ease !important;
    z-index: 100001 !important;
    overflow-y: auto !important;
  }

  .nav-right.is-open {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateX(0) !important;
  }

  .nav-menu {
    width: 100% !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .nav-menu > li {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    border-bottom: 1px solid rgba(255,255,255,.10) !important;
  }

  .nav-menu > li > a {
    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    padding: 22px 24px !important;
    justify-content: space-between !important;
    font-size: 16px !important;
    color: #ffffff !important;
    background: transparent !important;
  }

  .nav-menu > li > a:hover {
    color: #ffffff !important;
    background: #f30000 !important;
  }

  .nav-menu > li:nth-child(4) > a {
    min-width: 0 !important;
  }

  .nav-item-dropdown:hover > a,
  .nav-item-dropdown.is-current > a {
    background: transparent !important;
    color: #ffffff !important;
  }

  .nav-item-dropdown.mobile-open > a {
    background: #f30000 !important;
    color: #ffffff !important;
  }

  .nav-arrow {
    margin-left: 8px !important;
    transition: transform .25s ease !important;
  }

  .nav-item-dropdown.mobile-open .nav-arrow {
    transform: rotate(180deg) !important;
  }

  .nav-submenu {
    position: static !important;
    top: auto !important;
    left: auto !important;
    min-width: 100% !important;
    width: 100% !important;
    display: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    box-shadow: none !important;
    background: #111111 !important;
    padding: 0 !important;
  }

  .nav-item-dropdown.mobile-open .nav-submenu {
    display: block !important;
  }

  .nav-submenu li {
    border-top: 1px solid rgba(255,255,255,.08) !important;
  }

  .nav-submenu a {
    padding: 16px 36px !important;
    font-size: 13px !important;
    background: #111111 !important;
    color: #ffffff !important;
  }

  .nav-submenu a:hover {
    background: #f30000 !important;
    color: #ffffff !important;
  }

  .nav-cta-link,
  .nav-cta {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    padding: 22px 24px !important;
    border-left: 0 !important;
    border-top: 1px solid rgba(255,255,255,.14) !important;
    justify-content: flex-start !important;
    background: #f30000 !important;
    color: #ffffff !important;
    font-size: 16px !important;
  }

  .topbar-contact a {
    font-size: 0 !important;
  }

  .topbar-contact i {
    font-size: 18px !important;
  }

  .topbar-social i {
    font-size: 16px !important;
  }
}
/* Destacar enlace "Ver todos los productos" en submenú */
.nav-submenu .nav-submenu-all a {
  color: #f30000 !important;
  border-bottom: 1px solid rgba(255,255,255,.14) !important;
}

.nav-submenu .nav-submenu-all a:hover {
  background: #f30000 !important;
  color: #ffffff !important;
}
/* =========================================================
   KOYAMA — FUENTES OFICIALES
   ========================================================= */

@font-face {
  font-family: 'Acumin KOYAMA';
  src: url('../fonts/Acumin-RPro.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Acumin KOYAMA';
  src: url('../fonts/Acumin-ItPro.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Acumin KOYAMA';
  src: url('../fonts/Acumin-BdPro.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Acumin KOYAMA';
  src: url('../fonts/Acumin-BdItPro.woff2') format('woff2');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Gilroy KOYAMA';
  src: url('../fonts/gilroy-blackitalic.woff2') format('woff2');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

:root {
  --font-menu: 'Acumin KOYAMA', 'Arial Narrow', Arial, sans-serif;
  --font-title: 'Gilroy KOYAMA', 'Arial Black', Impact, sans-serif;
  --font-body: 'Acumin KOYAMA', Arial, sans-serif;
}
/* =========================================================
   KOYAMA — APLICACIÓN TIPOGRÁFICA GLOBAL
   ========================================================= */

/* Párrafos y textos generales */
body,
p,
li,
input,
textarea,
button,
.footer-main,
.footer-bottom,
.prod-texto p,
.prod-seccion p,
.prod-diagrama p,
.producto-banner p,
.cat-productos p,
.cat-mascota p,
.cat-seguro p {
  font-family: var(--font-body) !important;
  font-weight: 400 !important;
}

/* Barra de menú */
.topbar,
.lang-switch,
.topbar-contact a,
.nav-menu > li > a,
.nav-cta,
.nav-cta-link,
.nav-submenu a {
  font-family: var(--font-menu) !important;
  font-weight: 700 !important;
}

/* Titulares principales */
h1,
h2,
h3,
.producto-banner h1,
.prod-texto h2,
.prod-diagrama h2,
.cat-hero h1,
.cat-descarga h2,
.cat-productos h2,
.cat-mascota h2,
.cat-seguro h2,
.hero-home h1,
.section-title,
.cta-title {
  font-family: var(--font-title) !important;
  font-weight: 900 !important;
  font-style: italic !important;
}

/* Subtítulos y énfasis */
.prod-texto h2 em,
.prod-seccion h2 em,
.prod-diagrama h2 em,
.cat-hero h1 em,
.cat-productos h2 .rojo,
.cat-productos h2 .blanco,
.cat-mascota h2 em {
  font-family: var(--font-title) !important;
  font-weight: 900 !important;
  font-style: italic !important;
}

/* Menú más parecido al mockup */
.nav-menu > li > a,
.nav-cta-link,
.nav-cta {
  font-family: var(--font-menu) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
}

/* Submenú */
.nav-submenu a {
  font-family: var(--font-menu) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  text-transform: uppercase !important;
}

/* Párrafos técnicos */
.prod-texto p,
.prod-seccion p,
.prod-diagrama p,
.producto-banner p {
  font-family: var(--font-body) !important;
  font-size: 15px !important;
  line-height: 1.72 !important;
  font-weight: 400 !important;
}

/* Footer */
.footer-main,
.footer-main p,
.footer-main a,
.footer-bottom,
.footer-bottom a {
  font-family: var(--font-body) !important;
}
/* ============================================================
   KOYAMA — INICIO / HERO RALLY
   Imagen completa como fondo + texto encima
   ============================================================ */

.pagina-inicio .koy-home-hero {
  position: relative;
  min-height: 680px;
  padding: 100px 0;
  background-color: #050505;
  background-image: url("../images/koyama-home-hero-rally.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  overflow: hidden;
}

.pagina-inicio .koy-home-hero__inner {
  width: min(1180px, calc(100% - 80px));
  min-height: clamp(380px, 36vw, 560px);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.pagina-inicio .koy-home-hero__text {
  max-width: 520px;
  margin-right: clamp(30px, 5vw, 80px);
  transform: translateY(-4px);
  text-align: left;
  position: relative;
  z-index: 2;
}

.pagina-inicio .koy-home-hero__text h1 {
  margin: 0 0 16px;
  font-family: var(--title, sans-serif);
  font-size: clamp(38px, 4.2vw, 68px);
  line-height: .9;
  font-weight: 900;
  font-style: italic;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: #ffffff;
}

.pagina-inicio .koy-home-hero__text p {
  margin: 0;
  max-width: 460px;
  font-family: var(--body, sans-serif);
  font-size: clamp(14px, 1vw, 17px);
  line-height: 1.45;
  font-weight: 500;
  color: #ffffff;
}

/* Oculta imagen anterior si todavía queda en el HTML */
.pagina-inicio .hero-home .hero-bg {
  display: none !important;
}

/* Responsive */
@media (max-width: 900px) {
  .pagina-inicio .koy-home-hero {
    min-height: 440px;
    background-position: center center;
  }

  .pagina-inicio .koy-home-hero__inner {
    width: min(100% - 40px, 680px);
    min-height: 440px;
    justify-content: center;
  }

  .pagina-inicio .koy-home-hero__text {
    margin: 0;
    max-width: 360px;
    text-align: center;
    transform: none;
  }

  .pagina-inicio .koy-home-hero__text h1 {
    font-size: clamp(34px, 9vw, 48px);
  }

  .pagina-inicio .koy-home-hero__text p {
    font-size: 14px;
  }
}

/* ============================================================
   KOYAMA HOME 2026 - final overrides
   Kept at EOF so the independent home wins over legacy hero CSS
   ============================================================ */

.pagina-inicio .koy-home-hero {
  min-height: clamp(520px, 58vw, 760px);
  background-color: #050505;
  background-image:
    linear-gradient(90deg, rgba(5,5,5,.08) 0%, rgba(5,5,5,.1) 42%, rgba(5,5,5,.62) 100%),
    url("../images/koyama-home-hero-rally.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.pagina-inicio .koy-home-hero__inner {
  width: min(1180px, calc(100% - 48px));
  min-height: clamp(520px, 58vw, 760px);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.pagina-inicio .koy-home-hero__content {
  width: min(500px, 46%);
  color: #ffffff;
  text-align: left;
}

.pagina-inicio .koy-home-hero__content h1 {
  margin: 0 0 18px;
  font-family: var(--font-title, var(--title, "Arial Black", sans-serif));
  font-size: clamp(46px, 6vw, 92px);
  font-style: italic;
  font-weight: 900;
  line-height: .88;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.pagina-inicio .koy-home-hero__content p {
  width: min(420px, 100%);
  margin: 0;
  color: rgba(255,255,255,.92);
  font-family: var(--font-body, var(--body, Arial, sans-serif));
  font-size: clamp(16px, 1.35vw, 19px);
  line-height: 1.5;
}

@media (max-width: 980px) {
  .pagina-inicio .koy-home-hero,
  .pagina-inicio .koy-home-hero__inner {
    min-height: 560px;
  }

  .pagina-inicio .koy-home-hero {
    background-image:
      linear-gradient(180deg, rgba(5,5,5,.18), rgba(5,5,5,.76)),
      url("../images/koyama-home-hero-rally.jpg");
    background-position: center;
  }

  .pagina-inicio .koy-home-hero__inner {
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 58px;
  }

  .pagina-inicio .koy-home-hero__content {
    width: min(520px, 100%);
    text-align: center;
  }

  .pagina-inicio .koy-home-hero__content p {
    margin: 0 auto;
  }
}

@media (max-width: 760px) {
  .pagina-inicio .koy-home-hero__inner {
    width: min(100% - 32px, 560px);
  }

  .pagina-inicio .koy-home-hero,
  .pagina-inicio .koy-home-hero__inner {
    min-height: 520px;
  }
}

/* ============================================================
   KOYAMA HOME 2026
   Scoped styles for page-inicio.php only
   ============================================================ */

.pagina-inicio .koy-home {
  --koy-red: #ed1117;
  --koy-black: #050505;
  --koy-white: #ffffff;
  --koy-light: #f8f8f8;
  --koy-copy: #2a2a2a;
  background: var(--koy-white);
  color: var(--koy-black);
  font-family: var(--font-body, var(--body, Arial, sans-serif));
  overflow: hidden;
}

.pagina-inicio .koy-home__container {
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
}

.pagina-inicio .koy-home h1,
.pagina-inicio .koy-home h2,
.pagina-inicio .koy-home h3 {
  font-family: var(--font-title, var(--title, "Arial Black", sans-serif));
  font-style: italic;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .02em;
}

.pagina-inicio .koy-home p {
  font-family: var(--font-body, var(--body, Arial, sans-serif));
  font-weight: 400;
}

.pagina-inicio .koy-home__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 14px 30px;
  border: 0;
  font-family: var(--font-title, var(--title, "Arial Black", sans-serif));
  font-size: 15px;
  font-style: italic;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none;
  transition: transform .18s ease, background-color .18s ease, color .18s ease;
}

.pagina-inicio .koy-home__btn:hover {
  transform: translateY(-2px);
}

.pagina-inicio .koy-home__btn--red {
  background: var(--koy-red);
  color: var(--koy-white);
}

.pagina-inicio .koy-home__btn--red:hover {
  background: #c80f14;
}

.pagina-inicio .koy-home__btn--dark {
  background: var(--koy-black);
  color: var(--koy-white);
}

.pagina-inicio .koy-home__btn--dark:hover {
  background: #222222;
}

.pagina-inicio .koy-home-hero {
  min-height: clamp(520px, 58vw, 760px);
  background-color: var(--koy-black);
  background-image:
    linear-gradient(90deg, rgba(5,5,5,.08) 0%, rgba(5,5,5,.1) 42%, rgba(5,5,5,.62) 100%),
    url("../images/koyama-home-hero-rally.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.pagina-inicio .koy-home-hero__inner {
  width: min(1180px, calc(100% - 48px));
  min-height: clamp(520px, 58vw, 760px);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.pagina-inicio .koy-home-hero__content {
  width: min(500px, 46%);
  color: var(--koy-white);
  text-align: left;
}

.pagina-inicio .koy-home-hero__content h1 {
  margin: 0 0 18px;
  font-size: clamp(46px, 6vw, 92px);
  line-height: .88;
}

.pagina-inicio .koy-home-hero__content p {
  width: min(420px, 100%);
  margin: 0;
  color: rgba(255,255,255,.92);
  font-size: clamp(16px, 1.35vw, 19px);
  line-height: 1.5;
}

.pagina-inicio .koy-home-calidad {
  position: relative;
  padding: clamp(72px, 8vw, 118px) 0;
  background-color: var(--koy-black);
  background-image:
    linear-gradient(90deg, rgba(5,5,5,.96), rgba(5,5,5,.82) 48%, rgba(5,5,5,.65)),
    url("../images/fondo-seccion.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: var(--koy-white);
}

.pagina-inicio .koy-home-calidad__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(320px, .98fr);
  gap: clamp(32px, 6vw, 76px);
  align-items: center;
}

.pagina-inicio .koy-home-calidad__content h2,
.pagina-inicio .koy-home-catalogo__content h2,
.pagina-inicio .koy-home-ingenieria__content h2 {
  margin: 0 0 22px;
  font-size: clamp(32px, 4.4vw, 58px);
  line-height: .96;
}

.pagina-inicio .koy-home-calidad__content p,
.pagina-inicio .koy-home-catalogo__content p,
.pagina-inicio .koy-home-ingenieria__content p {
  max-width: 580px;
  margin: 0 0 18px;
  font-size: 16px;
  line-height: 1.72;
}

.pagina-inicio .koy-home-calidad__content p,
.pagina-inicio .koy-home-catalogo__content p {
  color: rgba(255,255,255,.78);
}

.pagina-inicio .koy-home-calidad__content .koy-home__btn,
.pagina-inicio .koy-home-catalogo__content .koy-home__btn {
  margin-top: 16px;
}

.pagina-inicio .koy-home-calidad__media {
  margin: 0;
  display: flex;
  justify-content: center;
}

.pagina-inicio .koy-home-calidad__media img {
  width: min(440px, 100%);
  max-height: 520px;
  object-fit: contain;
  filter: drop-shadow(0 26px 38px rgba(0,0,0,.42));
}

.pagina-inicio .koy-home-productos {
  padding: clamp(58px, 7vw, 96px) 0;
  background: var(--koy-light);
}

.pagina-inicio .koy-home-productos__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 16px;
}

.pagina-inicio .koy-home-productos__card {
  min-height: 100%;
  padding: 20px 14px 18px;
  background: var(--koy-white);
  border: 1px solid #ececec;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.pagina-inicio .koy-home-productos__card:hover {
  border-color: rgba(237,17,23,.25);
  box-shadow: 0 18px 34px rgba(0,0,0,.08);
  transform: translateY(-4px);
}

.pagina-inicio .koy-home-productos__card img {
  width: 100%;
  height: 132px;
  margin: 0 auto 18px;
  object-fit: contain;
}

.pagina-inicio .koy-home-productos__card h3 {
  min-height: 42px;
  margin: 0 0 9px;
  color: var(--koy-black);
  font-size: 18px;
  line-height: 1.05;
}

.pagina-inicio .koy-home-productos__card p {
  margin: 0 0 14px;
  color: #565656;
  font-size: 13px;
  line-height: 1.48;
}

.pagina-inicio .koy-home-productos__card a {
  margin-top: auto;
  color: var(--koy-red);
  font-family: var(--font-title, var(--title, "Arial Black", sans-serif));
  font-size: 13px;
  font-style: italic;
  font-weight: 900;
  letter-spacing: .06em;
  line-height: 1.15;
  text-transform: uppercase;
  text-decoration: none;
}

.pagina-inicio .koy-home-productos__card a span {
  display: inline-block;
  transition: transform .18s ease;
}

.pagina-inicio .koy-home-productos__card a:hover span {
  transform: translateX(4px);
}

.pagina-inicio .koy-home-catalogo {
  padding: clamp(72px, 8vw, 118px) 0;
  background-color: var(--koy-black);
  background-image:
    linear-gradient(90deg, rgba(5,5,5,.96), rgba(5,5,5,.84) 52%, rgba(5,5,5,.7)),
    url("../images/fondo-seccion.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: var(--koy-white);
}

.pagina-inicio .koy-home-catalogo__grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(320px, 1.1fr);
  gap: clamp(34px, 6vw, 84px);
  align-items: center;
}

.pagina-inicio .koy-home-catalogo__media {
  margin: 0;
}

.pagina-inicio .koy-home-catalogo__media img {
  width: min(560px, 100%);
  margin-left: auto;
  filter: drop-shadow(0 26px 42px rgba(0,0,0,.42));
}

.pagina-inicio .koy-home-ingenieria {
  padding: clamp(72px, 8vw, 112px) 0;
  background: var(--koy-white);
}

.pagina-inicio .koy-home-ingenieria__grid {
  display: grid;
  grid-template-columns: minmax(320px, .95fr) minmax(0, 1.05fr);
  gap: clamp(34px, 6vw, 84px);
  align-items: center;
}

.pagina-inicio .koy-home-ingenieria__media {
  margin: 0;
}

.pagina-inicio .koy-home-ingenieria__media img {
  width: 100%;
  aspect-ratio: 1.18 / 1;
  object-fit: cover;
}

.pagina-inicio .koy-home-ingenieria__content h2 {
  color: var(--koy-black);
}

.pagina-inicio .koy-home-ingenieria__content p {
  color: var(--koy-copy);
}

.pagina-inicio .koy-home-beneficios {
  padding: 24px 0;
  background: var(--koy-red);
  color: var(--koy-white);
}

.pagina-inicio .koy-home-beneficios__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.pagina-inicio .koy-home-beneficios__item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 76px;
  color: var(--koy-white);
  text-align: left;
}

.pagina-inicio .koy-home-beneficios__item i {
  flex: 0 0 auto;
  width: 34px;
  color: var(--koy-white);
  font-size: 31px;
  text-align: center;
}

.pagina-inicio .koy-home-beneficios__item span {
  max-width: 210px;
  font-family: var(--font-title, var(--title, "Arial Black", sans-serif));
  font-size: 16px;
  font-style: italic;
  font-weight: 900;
  letter-spacing: .05em;
  line-height: 1.1;
  text-transform: uppercase;
}

.pagina-inicio .koy-home-testimonio {
  min-height: clamp(250px, 30vw, 80px);
  background-color: var(--koy-black);
  background-image:
    linear-gradient(90deg, rgba(5,5,5,.82), rgba(5,5,5,.52) 43%, rgba(5,5,5,.08) 100%),
    url("../images/koyama-home-testimonio-rally.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: var(--koy-white);
}

.pagina-inicio .koy-home-testimonio__inner {
  min-height: clamp(1100px, 50vw, 1200px);
  display: flex;
  align-items: center;
}

.pagina-inicio .koy-home-testimonio blockquote {
  width: min(560px, 100%);
  margin: 0;
}

.pagina-inicio .koy-home-testimonio blockquote p {
  margin: 0 0 28px;
  color: var(--koy-white);
  font-size: clamp(25px, 3.1vw, 45px);
  font-style: italic;
  font-weight: 500;
  line-height: 1.15;
}

.pagina-inicio .koy-home-testimonio cite {
  display: block;
  margin: 0 0 7px;
  color: var(--koy-white);
  font-family: var(--font-title, var(--title, "Arial Black", sans-serif));
  font-size: clamp(27px, 3vw, 42px);
  font-style: italic;
  font-weight: 500;
  line-height: 1.15;
  text-transform: uppercase;
}

.pagina-inicio .koy-home-testimonio blockquote span {
  display: block;
  color: var(--koy-red);
  font-family: var(--font-title, var(--title, "Arial Black", sans-serif));
  font-size: 15px;
  font-style: italic;
  font-weight: 900;
  letter-spacing: .15em;
  text-transform: uppercase;
}

.pagina-inicio .koy-home-mantenimiento {
  padding: clamp(66px, 8vw, 108px) 0;
  background: var(--koy-white);
}

.pagina-inicio .koy-home-mantenimiento__header {
  margin: 0 0 clamp(32px, 5vw, 54px);
  text-align: center;
}

.pagina-inicio .koy-home-mantenimiento__header h2 {
  margin: 0;
  color: var(--koy-black);
  font-size: clamp(32px, 5vw, 68px);
  line-height: .95;
}

.pagina-inicio .koy-home-mantenimiento__header h2 span,
.pagina-inicio .koy-home-mantenimiento__header h2 strong {
  display: block;
}

.pagina-inicio .koy-home-mantenimiento__header h2 strong {
  color: var(--koy-red);
}

.pagina-inicio .koy-home-mantenimiento__grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
}

.pagina-inicio .koy-home-mantenimiento__card {
  padding: 18px 16px 20px;
  background: var(--koy-light);
  border: 1px solid #ececec;
  text-align: center;
}

.pagina-inicio .koy-home-mantenimiento__card img {
  width: 100%;
  height: 130px;
  margin: 0 auto 16px;
  object-fit: contain;
}

.pagina-inicio .koy-home-mantenimiento__card h3 {
  min-height: 42px;
  margin: 0 0 10px;
  color: var(--koy-red);
  font-size: 18px;
  line-height: 1.05;
}

.pagina-inicio .koy-home-mantenimiento__card p {
  margin: 0;
  color: #555555;
  font-size: 13px;
  line-height: 1.52;
}

.pagina-inicio .koy-home-cta {
  padding: clamp(52px, 6vw, 82px) 0 0;
  background: var(--koy-red);
  color: var(--koy-white);
}

.pagina-inicio .koy-home-cta__grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(320px, 1.1fr);
  gap: clamp(28px, 5vw, 70px);
  align-items: end;
}

.pagina-inicio .koy-home-cta__content {
  align-self: center;
  padding-bottom: clamp(38px, 5vw, 68px);
}

.pagina-inicio .koy-home-cta__content h2 {
  margin: 0 0 14px;
  color: var(--koy-white);
  font-size: clamp(34px, 5.2vw, 70px);
  line-height: .94;
}

.pagina-inicio .koy-home-cta__content p {
  width: min(440px, 100%);
  margin: 0 0 28px;
  color: rgba(255,255,255,.9);
  font-size: 17px;
  line-height: 1.55;
}

.pagina-inicio .koy-home-cta__media {
  margin: 0;
}

.pagina-inicio .koy-home-cta__media img {
  width: min(630px, 100%);
  margin-left: auto;
  object-fit: contain;
}

@media (max-width: 1180px) {
  .pagina-inicio .koy-home-productos__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .pagina-inicio .koy-home-mantenimiento__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .pagina-inicio .koy-home-hero,
  .pagina-inicio .koy-home-hero__inner {
    min-height: 560px;
  }

  .pagina-inicio .koy-home-hero {
    background-image:
      linear-gradient(180deg, rgba(5,5,5,.18), rgba(5,5,5,.76)),
      url("../images/koyama-home-hero-rally.jpg");
    background-position: center;
  }

  .pagina-inicio .koy-home-hero__inner {
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 58px;
  }

  .pagina-inicio .koy-home-hero__content {
    width: min(520px, 100%);
    text-align: center;
  }

  .pagina-inicio .koy-home-hero__content p {
    margin: 0 auto;
  }

  .pagina-inicio .koy-home-calidad__grid,
  .pagina-inicio .koy-home-catalogo__grid,
  .pagina-inicio .koy-home-ingenieria__grid,
  .pagina-inicio .koy-home-cta__grid {
    grid-template-columns: 1fr;
  }

  .pagina-inicio .koy-home-calidad__content,
  .pagina-inicio .koy-home-catalogo__content,
  .pagina-inicio .koy-home-ingenieria__content,
  .pagina-inicio .koy-home-cta__content {
    text-align: center;
  }

  .pagina-inicio .koy-home-calidad__content p,
  .pagina-inicio .koy-home-catalogo__content p,
  .pagina-inicio .koy-home-ingenieria__content p,
  .pagina-inicio .koy-home-cta__content p {
    margin-left: auto;
    margin-right: auto;
  }

  .pagina-inicio .koy-home-catalogo__media {
    order: 2;
    margin-bottom: -80px;
    position: relative;
    z-index: 4;
  }
  .pagina-inicio .koy-home-catalogo__media img {
    margin: 0 auto;
    width: min(480px, 92%);
  }
  .pagina-inicio .koy-home-cta__media img {
    margin: 0 auto;
  }

  .pagina-inicio .koy-home-beneficios__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pagina-inicio .koy-home-testimonio {
    background-image:
      linear-gradient(180deg, rgba(5,5,5,.3), rgba(5,5,5,.86)),
      url("../images/koyama-home-testimonio-rally.jpg");
  }

  .pagina-inicio .koy-home-testimonio__inner {
    align-items: flex-end;
    padding-bottom: 58px;
  }

  .pagina-inicio .koy-home-testimonio blockquote {
    text-align: center;
    margin: 0 auto;
  }
}

@media (max-width: 760px) {
  .pagina-inicio .koy-home__container,
  .pagina-inicio .koy-home-hero__inner {
    width: min(100% - 32px, 560px);
  }

  .pagina-inicio .koy-home-hero,
  .pagina-inicio .koy-home-hero__inner {
    min-height: 520px;
  }

  .pagina-inicio .koy-home-productos__grid,
  .pagina-inicio .koy-home-mantenimiento__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pagina-inicio .koy-home-beneficios__grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .pagina-inicio .koy-home-beneficios__item {
    justify-content: flex-start;
    min-height: 60px;
  }

  .pagina-inicio .koy-home-catalogo__media img,
  .pagina-inicio .koy-home-calidad__media img {
    width: min(420px, 100%);
  }
}

@media (max-width: 520px) {
  .pagina-inicio .koy-home__container,
  .pagina-inicio .koy-home-hero__inner {
    width: min(100% - 28px, 420px);
  }

  .pagina-inicio .koy-home__btn {
    width: 100%;
    padding-left: 18px;
    padding-right: 18px;
    font-size: 14px;
  }

  .pagina-inicio .koy-home-productos__grid,
  .pagina-inicio .koy-home-mantenimiento__grid {
    grid-template-columns: 1fr;
  }

  .pagina-inicio .koy-home-productos__card,
  .pagina-inicio .koy-home-mantenimiento__card {
    padding-left: 20px;
    padding-right: 20px;
  }

  .pagina-inicio .koy-home-productos__card h3,
  .pagina-inicio .koy-home-mantenimiento__card h3 {
    min-height: 0;
  }

  .pagina-inicio .koy-home-testimonio blockquote p {
    font-size: 24px;
  }
}
/* ============================================================
   AJUSTE HOME — HERO PRINCIPAL RALLY
   Imagen PNG completa como fondo
   ============================================================ */

.pagina-inicio .koy-home-hero {
  position: relative !important;
  min-height: clamp(360px, 34vw, 560px) !important;
  background-color: #050505 !important;
  background-image: url("../images/koyama-home-hero-rally.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  overflow: hidden !important;
}

.pagina-inicio .koy-home-hero__inner {
  width: min(1180px, calc(100% - 80px)) !important;
  min-height: clamp(360px, 34vw, 560px) !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

.pagina-inicio .koy-home-hero__content {
  width: 100% !important;
  max-width: 560px !important;
  margin-left: auto !important;
  margin-right: clamp(30px, 4.5vw, 72px) !important;
  transform: translateY(-6px) !important;
  text-align: left !important;
  position: relative !important;
  z-index: 2 !important;
}

.pagina-inicio .koy-home-hero__content h1 {
  margin: 0 0 18px !important;
  padding: 0 !important;
  font-family: var(--title, sans-serif) !important;
  font-size: clamp(40px, 3.9vw, 66px) !important;
  line-height: 0.95 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: 0.035em !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  text-align: left !important;
}

.pagina-inicio .koy-home-hero__content p {
  margin: 0 !important;
  padding: 0 !important;
  max-width: 560px !important;
  font-family: var(--body, sans-serif) !important;
  font-size: clamp(15px, 1.05vw, 18px) !important;
  line-height: 1.45 !important;
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
  color: #ffffff !important;
  text-align: left !important;
}

/* Anula el hero negro anterior si quedó alguna regla heredada */
.pagina-inicio .hero-home,
.pagina-inicio .koy-home-hero::before,
.pagina-inicio .koy-home-hero::after {
  background: none;
}

/* Responsive */
@media (max-width: 900px) {
  .pagina-inicio .koy-home-hero {
    min-height: 430px !important;
    background-position: center center !important;
  }

  .pagina-inicio .koy-home-hero__inner {
    width: min(100% - 40px, 680px) !important;
    min-height: 430px !important;
    justify-content: center !important;
  }

  .pagina-inicio .koy-home-hero__content {
    max-width: 360px !important;
    margin: 0 !important;
    transform: none !important;
    text-align: center !important;
  }

  .pagina-inicio .koy-home-hero__content h1,
  .pagina-inicio .koy-home-hero__content p {
    text-align: center !important;
  }

  .pagina-inicio .koy-home-hero__content h1 {
    font-size: clamp(34px, 9vw, 48px) !important;
  }

  .pagina-inicio .koy-home-hero__content p {
    font-size: 14px !important;
  }
}
/* ============================================================
   AJUSTE HOME — SECCIÓN ELIGE LA CALIDAD
   ============================================================ */

.pagina-inicio .koy-home-calidad {
  position: relative !important;
  min-height: 560px !important;
  padding: 0 !important;
  background-color: #080808 !important;
  background-image: url("../images/fondo-seccion.jpg") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  overflow: visible !important;
}

.pagina-inicio .koy-home-calidad::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 82px;
  background: #ffffff;
  z-index: 1;
}

.pagina-inicio .koy-home-calidad__inner {
  width: min(1180px, calc(100% - 80px)) !important;
  min-height: 560px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 57% 43% !important;
  align-items: center !important;
  gap: 40px !important;
  position: relative !important;
  z-index: 2 !important;
}

.pagina-inicio .koy-home-calidad__text {
  max-width: 730px !important;
  padding-top: 10px !important;
}

.pagina-inicio .koy-home-calidad__text h2 {
  margin: 0 0 28px !important;
  font-family: var(--title, sans-serif) !important;
  font-size: clamp(34px, 3.1vw, 54px) !important;
  line-height: 1.12 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: 0.05em !important;
  color: #ffffff !important;
  text-transform: uppercase !important;
  text-align: left !important;
}

.pagina-inicio .koy-home-calidad__text p {
  margin: 0 0 42px !important;
  max-width: 730px !important;
  font-family: var(--body, sans-serif) !important;
  font-size: clamp(15px, 1.05vw, 18px) !important;
  line-height: 1.75 !important;
  font-weight: 600 !important;
  letter-spacing: 0.015em !important;
  color: #ffffff !important;
  text-align: left !important;
}

.pagina-inicio .koy-home-calidad__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 270px !important;
  height: 66px !important;
  padding: 0 34px !important;
  background: #ed1117 !important;
  color: #ffffff !important;
  font-family: var(--title, sans-serif) !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}

.pagina-inicio .koy-home-calidad__image {
  position: relative !important;
  height: 100% !important;
  min-height: 560px !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
  z-index: 3 !important;
}

.pagina-inicio .koy-home-calidad__image img {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  height: clamp(410px, 34vw, 560px) !important;
  object-fit: contain !important;
  transform: translate(40px, 58px) !important;
  position: relative !important;
  z-index: 4 !important;
}

/* Responsive */
@media (max-width: 900px) {
  .pagina-inicio .koy-home-calidad {
    min-height: auto !important;
    padding: 58px 0 0 !important;
  }

  .pagina-inicio .koy-home-calidad::after {
    height: 70px !important;
  }

  .pagina-inicio .koy-home-calidad__inner {
    width: min(100% - 40px, 680px) !important;
    min-height: auto !important;
    grid-template-columns: 1fr !important;
    gap: 34px !important;
    text-align: center !important;
  }

  .pagina-inicio .koy-home-calidad__text {
    max-width: 100% !important;
    padding-top: 0 !important;
  }

  .pagina-inicio .koy-home-calidad__text h2,
  .pagina-inicio .koy-home-calidad__text p {
    text-align: center !important;
  }

  .pagina-inicio .koy-home-calidad__image {
    min-height: auto !important;
    justify-content: center !important;
  }

  .pagina-inicio .koy-home-calidad__image img {
    height: auto !important;
    width: min(100%, 430px) !important;
    transform: translateY(36px) !important;
  }
}
/* ============================================================
   AJUSTE HOME — PRODUCTOS TIPO CARRUSEL COMO PDF
   ============================================================ */

.pagina-inicio .koy-home-productos {
  position: relative !important;
  background: #ffffff !important;
  padding: 54px 0 88px !important;
  overflow: hidden !important;
}

.pagina-inicio .koy-home-productos__wrap {
  width: min(1180px, calc(100% - 80px)) !important;
  margin: 0 auto !important;
  position: relative !important;
  overflow: visible !important;
}

.pagina-inicio .koy-home-productos__track {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  align-items: start !important;
  gap: clamp(36px, 4vw, 70px) !important;
  position: relative !important;
  z-index: 2 !important;
}

.pagina-inicio .koy-home-producto-card {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  text-align: center !important;
}

.pagina-inicio .koy-home-producto-card__image {
  width: 100% !important;
  height: 210px !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  margin-bottom: 16px !important;
}

.pagina-inicio .koy-home-producto-card__image img {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  max-height: 210px !important;
  object-fit: contain !important;
}

.pagina-inicio .koy-home-producto-card h3 {
  margin: 0 0 14px !important;
  font-family: var(--title, sans-serif) !important;
  font-size: 14px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: .04em !important;
  color: #050505 !important;
  text-transform: uppercase !important;
  text-align: center !important;
}

.pagina-inicio .koy-home-producto-card p {
  margin: 0 auto 30px !important;
  max-width: 250px !important;
  font-family: var(--body, sans-serif) !important;
  font-size: 16px !important;
  line-height: 1.45 !important;
  font-weight: 500 !important;
  color: #050505 !important;
  text-align: center !important;
}

.pagina-inicio .koy-home-producto-card a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: var(--title, sans-serif) !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: .04em !important;
  color: #ed1117 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}

/* Flechas rojas laterales */

.pagina-inicio .koy-home-productos__arrow {
  position: absolute !important;
  top: 195px !important;
  width: 56px !important;
  height: 108px !important;
  border: none !important;
  background: #ed1117 !important;
  color: #ffffff !important;
  font-family: Arial, sans-serif !important;
  font-size: 36px !important;
  line-height: 1 !important;
  font-weight: 400 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 5 !important;
  cursor: pointer !important;
  padding: 0 !important;
}

.pagina-inicio .koy-home-productos__arrow--left {
  left: -56px !important;
}

.pagina-inicio .koy-home-productos__arrow--right {
  right: -56px !important;
}

/* Dots inferiores */

.pagina-inicio .koy-home-productos__dots {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  margin-top: 78px !important;
}

.pagina-inicio .koy-home-productos__dots span {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background: #050505 !important;
  display: block !important;
}

.pagina-inicio .koy-home-productos__dots span.is-active {
  width: 16px !important;
  height: 16px !important;
  background: #ed1117 !important;
}

/* Ajustes finos por imagen */

.pagina-inicio .koy-home-producto-card:nth-child(1) .koy-home-producto-card__image img {
  max-height: 205px !important;
}

.pagina-inicio .koy-home-producto-card:nth-child(2) .koy-home-producto-card__image img {
  max-height: 210px !important;
}

.pagina-inicio .koy-home-producto-card:nth-child(3) .koy-home-producto-card__image img {
  max-height: 190px !important;
}

.pagina-inicio .koy-home-producto-card:nth-child(4) .koy-home-producto-card__image img {
  max-height: 185px !important;
}

/* Responsive */

@media (max-width: 1100px) {
  .pagina-inicio .koy-home-productos__track {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 50px 42px !important;
  }

  .pagina-inicio .koy-home-productos__arrow {
    display: none !important;
  }
}

@media (max-width: 640px) {
  .pagina-inicio .koy-home-productos {
    padding: 44px 0 70px !important;
  }

  .pagina-inicio .koy-home-productos__wrap {
    width: min(100% - 40px, 420px) !important;
  }

  .pagina-inicio .koy-home-productos__track {
    grid-template-columns: 1fr !important;
    gap: 44px !important;
  }

  .pagina-inicio .koy-home-producto-card__image {
    height: 190px !important;
  }

  .pagina-inicio .koy-home-productos__dots {
    margin-top: 50px !important;
  }
}
/* ============================================================
   HOME — INGENIERÍA JAPONESA
   ============================================================ */

.pagina-inicio .koy-home-ingenieria {
  position: relative !important;
  min-height: 500px !important;
  padding: 0 !important;
  background-color: #ffffff !important;
  background-image: url("../images/fondo-4-es.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  overflow: visible !important;
}

.pagina-inicio .koy-home-ingenieria::after {
  content: "";
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 18px !important;
  background: #ed1117 !important;
  z-index: 1 !important;
}

.pagina-inicio .koy-home-ingenieria__inner {
  width: min(1180px, calc(100% - 80px)) !important;
  min-height: 700px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 43% 57% !important;
  align-items: center !important;
  gap: 56px !important;
  position: relative !important;
  z-index: 2 !important;
}

.pagina-inicio .koy-home-ingenieria__image {
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  z-index: 3 !important;
}

.pagina-inicio .koy-home-ingenieria__image img {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  height: clamp(340px, 30vw, 850px) !important;
  object-fit: contain !important;
  transform: translate(-20px, 10px) !important;
}

.pagina-inicio .koy-home-ingenieria__text {
  max-width: 730px !important;
  transform: translateY(-6px) !important;
}

.pagina-inicio .koy-home-ingenieria__text h2 {
  margin: 0 0 28px !important;
  font-family: var(--title, sans-serif) !important;
  font-size: clamp(28px, 2.45vw, 32px) !important;
  line-height: 1.05 !important;
  font-weight: 850 !important;
  font-style: italic !important;
  letter-spacing: 0.0em !important;
  text-transform: uppercase !important;
  color: #050505 !important;
  text-align: left !important;
}

.pagina-inicio .koy-home-ingenieria__text h2 span {
  color: #ed1117 !important;
}

.pagina-inicio .koy-home-ingenieria__text p {
  margin: 0 0 24px !important;
  max-width: 720px !important;
  font-family: var(--body, sans-serif) !important;
  font-size: clamp(15px, 1.02vw, 18px) !important;
  line-height: 1.65 !important;
  font-weight: 500 !important;
  letter-spacing: 0.015em !important;
  color: #050505 !important;
  text-align: left !important;
}

.pagina-inicio .koy-home-ingenieria__text p:last-child {
  margin-bottom: 0 !important;
}

/* Responsive */
@media (max-width: 900px) {
  .pagina-inicio .koy-home-ingenieria {
    min-height: auto !important;
    padding: 56px 0 72px !important;
  }

  .pagina-inicio .koy-home-ingenieria__inner {
    width: min(100% - 40px, 680px) !important;
    min-height: auto !important;
    grid-template-columns: 1fr !important;
    gap: 34px !important;
  }

  .pagina-inicio .koy-home-ingenieria__image {
    height: auto !important;
    justify-content: center !important;
  }

  .pagina-inicio .koy-home-ingenieria__image img {
    width: min(100%, 390px) !important;
    height: auto !important;
    transform: none !important;
  }

  .pagina-inicio .koy-home-ingenieria__text {
    max-width: 100% !important;
    transform: none !important;
  }

  .pagina-inicio .koy-home-ingenieria__text h2,
  .pagina-inicio .koy-home-ingenieria__text p {
    text-align: center !important;
  }
}
/* ============================================================
   HOME — TESTIMONIO LUCHO ALAYZA
   ============================================================ */

.pagina-inicio .koy-home-testimonio {
  position: relative !important;
  min-height: 430px !important;
  padding: 0 !important;
  margin: 0 !important;
  background-color: #050505 !important;
  background-image: url("../images/koyama-home-testimonio-rally.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  overflow: hidden !important;
}

.pagina-inicio .koy-home-testimonio__inner {
  width: min(1180px, calc(100% - 80px)) !important;
  min-height: 430px !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  position: relative !important;
  z-index: 2 !important;
}

.pagina-inicio .koy-home-testimonio__content {
  width: 100% !important;
  max-width: 430px !important;
  margin-right: clamp(80px, 10vw, 170px) !important;
  transform: translateY(-2px) !important;
  color: #ffffff !important;
  text-align: left !important;
}

.pagina-inicio .koy-home-testimonio__quote-mark {
  display: block !important;
  margin: 0 0 8px !important;
  font-family: var(--title, sans-serif) !important;
  font-size: 34px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  color: #ed1117 !important;
  letter-spacing: 0.02em !important;
}

.pagina-inicio .koy-home-testimonio__content p {
  margin: 0 0 26px !important;
  max-width: 330px !important;
  font-family: var(--title, sans-serif) !important;
  font-size: clamp(18px, 1.45vw, 24px) !important;
  line-height: 1.22 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: 0.015em !important;
  color: #ffffff !important;
  text-align: left !important;
}

.pagina-inicio .koy-home-testimonio__content h3 {
  margin: 0 0 4px !important;
  font-family: var(--title, sans-serif) !important;
  font-size: clamp(34px, 3vw, 52px) !important;
  line-height: 0.95 !important;
  font-weight: 400 !important;
  font-style: italic !important;
  letter-spacing: 0.03em !important;
  color: #ffffff !important;
  text-transform: none !important;
}

.pagina-inicio .koy-home-testimonio__role {
  display: block !important;
  margin: 0 !important;
  font-family: var(--title, sans-serif) !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: 0.08em !important;
  color: #ed1117 !important;
  text-transform: uppercase !important;
}

/* Responsive */
@media (max-width: 900px) {
  .pagina-inicio .koy-home-testimonio {
    min-height: 520px !important;
    background-position: center center !important;
  }

  .pagina-inicio .koy-home-testimonio__inner {
    width: min(100% - 40px, 680px) !important;
    min-height: 520px !important;
    justify-content: center !important;
  }

  .pagina-inicio .koy-home-testimonio__content {
    max-width: 360px !important;
    margin: 0 !important;
    transform: none !important;
    text-align: center !important;
  }

  .pagina-inicio .koy-home-testimonio__quote-mark,
  .pagina-inicio .koy-home-testimonio__content p,
  .pagina-inicio .koy-home-testimonio__content h3,
  .pagina-inicio .koy-home-testimonio__role {
    text-align: center !important;
  }

  .pagina-inicio .koy-home-testimonio__content p {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
/* ============================================================
   HOME — TESTIMONIO LUCHO ALAYZA AJUSTADO
   ============================================================ */

.pagina-inicio .koy-home-testimonio {
  position: relative !important;
  min-height: 420px !important;
  padding: 0 !important;
  margin: 0 !important;
  background-color: #050505 !important;
  background-image: url("../images/koyama-home-testimonio-rally.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  overflow: hidden !important;
}

.pagina-inicio .koy-home-testimonio__inner {
  width: min(1180px, calc(100% - 80px)) !important;
  min-height: 420px !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  position: relative !important;
  z-index: 2 !important;
}

.pagina-inicio .koy-home-testimonio__content {
  width: 100% !important;
  max-width: 330px !important;
  margin-right: clamp(80px, 13vw, 100px) !important;
  transform: translateY(-4px) !important;
  color: #ffffff !important;
  text-align: left !important;
}

.pagina-inicio .koy-home-testimonio__quote-mark {
  display: block !important;
  margin: 0 0 8px !important;
  font-family: var(--title, sans-serif) !important;
  font-size: 30px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  color: #ed1117 !important;
  letter-spacing: 0.02em !important;
}

.pagina-inicio .koy-home-testimonio__content p {
  margin: 0 0 24px !important;
  max-width: 300px !important;
  font-family: var(--title, sans-serif) !important;
  font-size: clamp(17px, 1.18vw, 21px) !important;
  line-height: 1.22 !important;
  font-weight: 600 !important;
  font-style: italic !important;
  letter-spacing: 0.01em !important;
  color: #ffffff !important;
  text-align: left !important;
}

.pagina-inicio .koy-home-testimonio__firma {
  display: block !important;
  width: 210px !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 0 6px !important;
  object-fit: contain !important;
}

.pagina-inicio .koy-home-testimonio__role {
  display: block !important;
  margin: 0 !important;
  font-family: var(--title, sans-serif) !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: 0.08em !important;
  color: #ed1117 !important;
  text-transform: uppercase !important;
}

/* Oculta títulos anteriores si quedaron heredados */
.pagina-inicio .koy-home-testimonio__content h3 {
  display: none !important;
}

/* Responsive */
@media (max-width: 900px) {
  .pagina-inicio .koy-home-testimonio {
    min-height: 520px !important;
    background-position: center center !important;
  }

  .pagina-inicio .koy-home-testimonio__inner {
    width: min(100% - 40px, 680px) !important;
    min-height: 520px !important;
    justify-content: center !important;
  }

  .pagina-inicio .koy-home-testimonio__content {
    max-width: 330px !important;
    margin: 0 !important;
    transform: none !important;
    text-align: center !important;
  }

  .pagina-inicio .koy-home-testimonio__quote-mark,
  .pagina-inicio .koy-home-testimonio__content p,
  .pagina-inicio .koy-home-testimonio__role {
    text-align: center !important;
  }

  .pagina-inicio .koy-home-testimonio__content p {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .pagina-inicio .koy-home-testimonio__firma {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
/* ============================================================
   HOME — BLOG / MANTENIMIENTO INTELIGENTE
   Copia visual del bloque blog del partial, solo para inicio
   ============================================================ */

.pagina-inicio .koy-blog-latest--home {
  background: #ffffff !important;
  padding: 78px 0 94px !important;
  margin: 0 !important;
  overflow: hidden !important;
}

.pagina-inicio .koy-blog-latest--home .container {
  width: min(1180px, calc(100% - 80px)) !important;
  margin: 0 auto !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-latest__title {
  text-align: center !important;
  margin-bottom: 54px !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-latest__title h2 {
  margin: 0 !important;
  font-family: var(--title, sans-serif) !important;
  font-size: clamp(38px, 4vw, 38px) !important;
  line-height: 0.99 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: 0.0em !important;
  text-transform: uppercase !important;
  color: #050505 !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-latest__title h2 span {
  color: #ed1117 !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-latest__grid {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 18px !important;
  align-items: stretch !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-card {
  background: #ffffff !important;
  border: 1px solid #eeeeee !important;
  box-shadow: none !important;
  overflow: hidden !important;
  min-height: 316px !important;
  display: flex !important;
  flex-direction: column !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-card__image {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 146px !important;
  overflow: hidden !important;
  background: #f4f4f4 !important;
  text-decoration: none !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-card__image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-card__check {
  position: absolute !important;
  top: 12px !important;
  left: 12px !important;
  width: 26px !important;
  height: 26px !important;
  border-radius: 50% !important;
  background: #ed1117 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
  font-size: 13px !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-card__body {
  padding: 18px 18px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-card__body h3 {
  margin: 0 0 14px !important;
  font-family: var(--title, sans-serif) !important;
  font-size: 17px !important;
  line-height: 1.05 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
  color: #ed1117 !important;
  text-align: left !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-card__body h3 a {
  color: #ed1117 !important;
  text-decoration: none !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-card__body p {
  margin: 0 0 18px !important;
  font-family: var(--body, sans-serif) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  font-weight: 400 !important;
  color: #333333 !important;
  text-align: left !important;
}

.pagina-inicio .koy-blog-latest--home .koy-blog-card__link {
  margin-top: auto !important;
  font-family: var(--title, sans-serif) !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: #ed1117 !important;
  text-decoration: none !important;
}

/* Responsive */

@media (max-width: 1100px) {
  .pagina-inicio .koy-blog-latest--home .koy-blog-latest__grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media (max-width: 760px) {
  .pagina-inicio .koy-blog-latest--home {
    padding: 58px 0 70px !important;
  }

  .pagina-inicio .koy-blog-latest--home .container {
    width: min(100% - 40px, 520px) !important;
  }

  .pagina-inicio .koy-blog-latest--home .koy-blog-latest__grid {
    grid-template-columns: 1fr !important;
  }

  .pagina-inicio .koy-blog-latest--home .koy-blog-latest__title h2 {
    font-size: clamp(32px, 9vw, 44px) !important;
  }
}
/* =========================================================
   HOME - SECCIÓN ENCUENTRA TU PRODUCTO KOYAMA
   ========================================================= */

.home-koyama-producto {
  position: relative;
  width: 100%;
  background-image: url('../images/fondo-5-es.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}

.home-koyama-producto__inner {
  width: min(1280px, calc(100% - 40px));
  min-height: 320px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  padding: 42px 0 28px;
}

.home-koyama-producto__content {
  flex: 0 0 42%;
  max-width: 490px;
  padding-left: 110px;
  z-index: 2;
}

.home-koyama-producto__content h2 {
  margin: 0 0 14px;
  color: #fff;
  font-family: "Gilroy BlackItalic", sans-serif;
  font-size: 3.45rem;
  line-height: 0.95;
  font-style: italic;
  font-weight: 900;
  text-transform: none;
  letter-spacing: 0;
}

.home-koyama-producto__content p {
  margin: 0 0 36px;
  color: #fff;
  font-family: "Acumin Variable Concept", sans-serif;
  font-size: 1rem;
  line-height: 1.45;
  font-weight: 400;
  max-width: 520px;
}

.home-koyama-producto__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 285px;
  height: 64px;
  padding: 0 30px;
  background: #000;
  color: #fff;
  text-decoration: none;
  font-family: "Acumin Variable Concept", sans-serif;
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.0em;
  transition: all 0.25s ease;
}

.home-koyama-producto__btn:hover {
  background: #111;
  color: #fff;
}

.home-koyama-producto__image {
  flex: 0 0 50%;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  position: relative;
  z-index: 2;
  padding-right: 55px;
}

.home-koyama-producto__image img {
  display: block;
  width: 100%;
  max-width: 650px;
  height: auto;
  object-fit: contain;
}

/* Responsive */
@media (max-width: 1200px) {
  .home-koyama-producto__content {
    padding-left: 60px;
  }

  .home-koyama-producto__content h2 {
    font-size: 3rem;
  }

  .home-koyama-producto__image {
    padding-right: 20px;
  }

  .home-koyama-producto__image img {
    max-width: 560px;
  }
}

@media (max-width: 991px) {
  .home-koyama-producto__inner {
    min-height: auto;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding: 60px 0 40px;
  }

  .home-koyama-producto__content {
    flex: 1 1 100%;
    max-width: 100%;
    padding-left: 30px;
    padding-right: 30px;
  }

  .home-koyama-producto__image {
    flex: 1 1 100%;
    width: 100%;
    justify-content: center;
    padding-right: 0;
  }

  .home-koyama-producto__image img {
    max-width: 500px;
  }
}

@media (max-width: 640px) {
  .home-koyama-producto__inner {
    width: min(100% - 24px, 100%);
    padding: 46px 0 30px;
  }

  .home-koyama-producto__content {
    padding-left: 18px;
    padding-right: 18px;
  }

  .home-koyama-producto__content h2 {
    font-size: 2.35rem;
  }

  .home-koyama-producto__content p {
    font-size: 0.95rem;
    margin-bottom: 26px;
  }

  .home-koyama-producto__btn {
    min-width: 240px;
    height: 56px;
    font-size: 0.92rem;
  }

  .home-koyama-producto__image img {
    max-width: 360px;
  }
}
.pagina-inicio .koy-home-hero__content {
  max-width: 620px !important;
  margin-right: clamp(60px, 7vw, 130px) !important;
  transform: translateY(-4px) !important;
}

.pagina-inicio .koy-home-hero__content h1 {
  font-size: clamp(30px, 2.7vw, 46px) !important;
  line-height: 1.05 !important;
  font-weight: 700 !important;
  letter-spacing: 0.055em !important;
}

.pagina-inicio .koy-home-hero__content p {
  max-width: 620px !important;
  font-size: clamp(14px, 0.95vw, 16px) !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
}
/* ============================================================
   HOME — HERO PRINCIPAL CORREGIDO
   KOYAMA en una línea / SUSPENSION PARTS debajo
   Texto más a la derecha para no chocar con el auto
   ============================================================ */

.pagina-inicio .koy-home-hero {
  position: relative !important;
  min-height: clamp(330px, 31vw, 510px) !important;
  background-color: #050505 !important;
  background-image: url("../images/koyama-home-hero-rally.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  overflow: hidden !important;
}

.pagina-inicio .koy-home-hero__inner {
  width: 100% !important;
  min-height: clamp(330px, 31vw, 510px) !important;
  margin: 0 auto !important;
  position: relative !important;
  display: block !important;
}

.pagina-inicio .koy-home-hero__content {
  position: absolute !important;
  top: 50% !important;
  left: clamp(760px, 54vw, 980px) !important;
  transform: translateY(-50%) !important;
  width: 620px !important;
  max-width: 620px !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  z-index: 5 !important;
}

.pagina-inicio .koy-home-hero__content h1 {
  margin: 0 0 12px !important;
  padding: 0 !important;
  font-family: var(--title, sans-serif) !important;
  font-size: clamp(31px, 2.55vw, 46px) !important;
  line-height: 1.02 !important;
  font-weight: 700 !important;
  font-style: italic !important;
  letter-spacing: 0.065em !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  text-align: left !important;
}

.pagina-inicio .koy-home-hero__content h1 span {
  display: block !important;
  width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
}

.pagina-inicio .koy-home-hero__content p {
  margin: 0 !important;
  padding: 0 !important;
  width: 620px !important;
  max-width: 620px !important;
  font-family: var(--body, sans-serif) !important;
  font-size: clamp(14px, 0.95vw, 17px) !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
  letter-spacing: 0.015em !important;
  color: #ffffff !important;
  text-align: left !important;
}

/* Evita que reglas antiguas vuelvan a centrar o romper el título */
.pagina-inicio .koy-home-hero__content h1 br {
  display: none !important;
}

/* Responsive */
@media (max-width: 1100px) {
  .pagina-inicio .koy-home-hero__content {
    left: 52vw !important;
    width: 430px !important;
    max-width: 430px !important;
  }

  .pagina-inicio .koy-home-hero__content p {
    width: 430px !important;
    max-width: 430px !important;
  }
}

@media (max-width: 900px) {
  .pagina-inicio .koy-home-hero {
    min-height: 430px !important;
    background-position: center center !important;
  }

  .pagina-inicio .koy-home-hero__inner {
    min-height: 430px !important;
  }

  .pagina-inicio .koy-home-hero__content {
    position: absolute !important;
    left: 50% !important;
    top: 55% !important;
    transform: translate(-50%, -50%) !important;
    width: min(360px, calc(100% - 40px)) !important;
    max-width: 360px !important;
    text-align: center !important;
  }

  .pagina-inicio .koy-home-hero__content h1,
  .pagina-inicio .koy-home-hero__content p {
    text-align: center !important;
  }

  .pagina-inicio .koy-home-hero__content h1 {
    font-size: clamp(28px, 8vw, 40px) !important;
  }

  .pagina-inicio .koy-home-hero__content h1 span {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .pagina-inicio .koy-home-hero__content p {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 14px !important;
  }
}
/* ============================================================
   HOME — HERO / TÍTULO BOLD SIN INTERLINEADO
   ============================================================ */

.pagina-inicio .koy-home-hero__content {
  position: absolute !important;
  top: 50% !important;
  left: clamp(840px, 58vw, 1040px) !important;
  transform: translateY(-50%) !important;
  width: 620px !important;
  max-width: 620px !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  z-index: 5 !important;
}

.pagina-inicio .koy-home-hero__content h1 {
  margin: 0 0 12px !important;
  padding: 0 !important;
  font-family: var(--title, sans-serif) !important;
  font-size: clamp(30px, 2.45vw, 44px) !important;
  line-height: 0.86 !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: 0.0em !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  text-align: left !important;
}

.pagina-inicio .koy-home-hero__content h1 span {
  display: block !important;
  width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
  margin: 0 !important;
  padding: 0 !important;
}

.pagina-inicio .koy-home-hero__content p {
  margin: 0 !important;
  padding: 0 !important;
  width: 620px !important;
  max-width: 620px !important;
  font-family: var(--body, sans-serif) !important;
  font-size: clamp(19px, 0.95vw, 16px) !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
  letter-spacing: 0.01em !important;
  color: #ffffff !important;
  text-align: left !important;
}

/* Responsive */
@media (max-width: 1100px) {
  .pagina-inicio .koy-home-hero__content {
    left: 56vw !important;
    width: 430px !important;
    max-width: 430px !important;
  }

  .pagina-inicio .koy-home-hero__content p {
    width: 430px !important;
    max-width: 430px !important;
  }
}

@media (max-width: 900px) {
  .pagina-inicio .koy-home-hero__content {
    left: 50% !important;
    top: 55% !important;
    transform: translate(-50%, -50%) !important;
    width: min(360px, calc(100% - 40px)) !important;
    max-width: 360px !important;
    text-align: center !important;
  }

  .pagina-inicio .koy-home-hero__content h1,
  .pagina-inicio .koy-home-hero__content p {
    text-align: center !important;
  }

  .pagina-inicio .koy-home-hero__content h1 {
    font-size: clamp(28px, 8vw, 40px) !important;
    line-height: 0.88 !important;
  }

  .pagina-inicio .koy-home-hero__content h1 span {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .pagina-inicio .koy-home-hero__content p {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 14px !important;
  }
}
/* ============================================================
   HOME — AJUSTE FINAL SECCIÓN ELIGE LA CALIDAD
   Más fiel al PDF / imagen de referencia
   ============================================================ */

.pagina-inicio .koy-home-calidad {
  min-height: 520px !important;
  background-color: #080808 !important;
  background-image: url("../images/fondo-seccion.jpg") !important;
  background-size: cover !important;
  background-position: center center !important;
  overflow: visible !important;
}

.pagina-inicio .koy-home-calidad::after {
  height: 56px !important;
}

.pagina-inicio .koy-home-calidad__inner {
  width: min(1180px, calc(100% - 80px)) !important;
  min-height: 520px !important;
  grid-template-columns: 54% 46% !important;
  align-items: center !important;
  gap: 24px !important;
}

.pagina-inicio .koy-home-calidad__text {
  max-width: 720px !important;
  padding-top: 36px !important;
  transform: translateY(8px) !important;
}

.pagina-inicio .koy-home-calidad__text h2 {
  margin: 0 0 22px !important;
  font-size: clamp(26px, 2.35vw, 40px) !important;
  line-height: 1.12 !important;
  font-weight: 800 !important;
  letter-spacing: 0.055em !important;
}

.pagina-inicio .koy-home-calidad__text p {
  margin: 0 0 34px !important;
  max-width: 690px !important;
  font-size: clamp(14px, 0.95vw, 16px) !important;
  line-height: 1.65 !important;
  font-weight: 500 !important;
}

.pagina-inicio .koy-home-calidad__btn {
  min-width: 230px !important;
  height: 58px !important;
  font-size: 15px !important;
}

.pagina-inicio .koy-home-calidad__image {
  min-height: 520px !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
}

.pagina-inicio .koy-home-calidad__image img {
  height: clamp(430px, 36vw, 590px) !important;
  transform: translate(80px, 52px) !important;
}
/* ============================================================
   HOME — FORZAR FONDO VISIBLE EN "ELIGE LA CALIDAD"
   ============================================================ */

.pagina-inicio .koy-home-calidad {
  position: relative !important;
  min-height: 520px !important;
  padding: 0 !important;
  background-color: #080808 !important;
  background-image: none !important;
  overflow: visible !important;
  isolation: isolate !important;
}

.pagina-inicio .koy-home-calidad::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url("../images/fondo-seccion.jpg") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: 1 !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

.pagina-inicio .koy-home-calidad::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -1px !important;
  height: 56px !important;
  background: #ffffff !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.pagina-inicio .koy-home-calidad__inner {
  position: relative !important;
  z-index: 2 !important;
  width: min(1180px, calc(100% - 80px)) !important;
  min-height: 520px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 54% 46% !important;
  align-items: center !important;
  gap: 24px !important;
}

.pagina-inicio .koy-home-calidad__text,
.pagina-inicio .koy-home-calidad__image {
  position: relative !important;
  z-index: 3 !important;
}
/* ============================================================
   HOME — USAR EL MISMO FONDO DEL PARTIAL EN "ELIGE LA CALIDAD"
   ============================================================ */

.pagina-inicio .koy-home-calidad {
  position: relative !important;
  min-height: 520px !important;
  padding: 0 !important;
  margin: 0 !important;
  background-color: #050505 !important;
  background-image: url("../images/fondo-seccion.jpg") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  overflow: visible !important;
}

/* Anula capas anteriores que podían estar tapando el fondo */
.pagina-inicio .koy-home-calidad::before {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* Franja blanca inferior como en la referencia */
.pagina-inicio .koy-home-calidad::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -1px !important;
  height: 56px !important;
  background: #ffffff !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.pagina-inicio .koy-home-calidad__inner {
  position: relative !important;
  z-index: 2 !important;
  width: min(1180px, calc(100% - 80px)) !important;
  min-height: 520px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 54% 46% !important;
  align-items: center !important;
  gap: 24px !important;
  background: transparent !important;
}

.pagina-inicio .koy-home-calidad__text {
  position: relative !important;
  z-index: 3 !important;
  max-width: 720px !important;
  padding-top: 36px !important;
  transform: translateY(8px) !important;
  background: transparent !important;
}

.pagina-inicio .koy-home-calidad__image {
  position: relative !important;
  z-index: 3 !important;
  min-height: 520px !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
  background: transparent !important;
}

.pagina-inicio .koy-home-calidad__image img {
  display: block !important;
  height: clamp(430px, 36vw, 590px) !important;
  width: auto !important;
  max-width: none !important;
  object-fit: contain !important;
  transform: translate(80px, 52px) !important;
}
/* ============================================================
   HOME — FONDO DEFINITIVO ELIGE LA CALIDAD
   ============================================================ */

.pagina-inicio .koy-home-calidad {
  position: relative !important;
  min-height: 520px !important;
  padding: 0 !important;
  margin: 0 !important;
  background-color: #050505 !important;
  background-image: url("../images/fondo-seccion.jpg") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  overflow: visible !important;
}

.pagina-inicio .koy-home-calidad::before {
  content: none !important;
  display: none !important;
}

.pagina-inicio .koy-home-calidad::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -1px !important;
  height: 56px !important;
  background: #ffffff !important;
  z-index: 1 !important;
}

.pagina-inicio .koy-home-calidad__inner {
  position: relative !important;
  z-index: 2 !important;
  background: transparent !important;
}
/* ============================================================
   FIX DIRECTO — FONDO SECCIÓN ELIGE LA CALIDAD
   No depende de body.pagina-inicio
   ============================================================ */

section.koy-home-calidad,
.koy-home-calidad {
  position: relative !important;
  min-height: 520px !important;
  padding: 0 !important;
  margin: 0 !important;
  background-color: #050505 !important;
  background-image: url("../images/fondo-seccion.jpg") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  overflow: visible !important;
}

section.koy-home-calidad::before,
.koy-home-calidad::before {
  content: none !important;
  display: none !important;
  background: none !important;
}

section.koy-home-calidad::after,
.koy-home-calidad::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -1px !important;
  height: 56px !important;
  background: #ffffff !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

section.koy-home-calidad .koy-home-calidad__inner,
.koy-home-calidad .koy-home-calidad__inner {
  position: relative !important;
  z-index: 2 !important;
  width: min(1180px, calc(100% - 80px)) !important;
  min-height: 520px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 54% 46% !important;
  align-items: center !important;
  gap: 24px !important;
  background: transparent !important;
}

section.koy-home-calidad .koy-home-calidad__text,
.koy-home-calidad .koy-home-calidad__text,
section.koy-home-calidad .koy-home-calidad__image,
.koy-home-calidad .koy-home-calidad__image {
  position: relative !important;
  z-index: 3 !important;
  background: transparent !important;
}

section.koy-home-calidad .koy-home-calidad__image,
.koy-home-calidad .koy-home-calidad__image {
  min-height: 520px !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
}

section.koy-home-calidad .koy-home-calidad__image img,
.koy-home-calidad .koy-home-calidad__image img {
  display: block !important;
  height: clamp(430px, 36vw, 590px) !important;
  width: auto !important;
  max-width: none !important;
  object-fit: contain !important;
  transform: translate(80px, 52px) !important;
}
/* ============================================================
   HOME — SECCIÓN ELIGE LA CALIDAD / MAQUETACIÓN FINAL
   ============================================================ */

.koy-home-calidad {
  position: relative !important;
  min-height: 520px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

.koy-home-calidad::before {
  content: none !important;
  display: none !important;
}

.koy-home-calidad::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -1px !important;
  height: 56px !important;
  background: #ffffff !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.koy-home-calidad__inner {
  width: min(1180px, calc(100% - 80px)) !important;
  min-height: 520px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 54% 46% !important;
  align-items: center !important;
  gap: 24px !important;
  position: relative !important;
  z-index: 2 !important;
  background: transparent !important;
}

.koy-home-calidad__text {
  max-width: 720px !important;
  padding-top: 28px !important;
  transform: translateY(4px) !important;
  position: relative !important;
  z-index: 3 !important;
  background: transparent !important;
}

.koy-home-calidad__text h2 {
  margin: 0 0 22px !important;
  font-family: var(--title, sans-serif) !important;
  font-size: clamp(28px, 2.55vw, 44px) !important;
  line-height: 1.12 !important;
  font-weight: 800 !important;
  font-style: italic !important;
  letter-spacing: 0.055em !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  text-align: left !important;
}

.koy-home-calidad__text p {
  margin: 0 0 34px !important;
  max-width: 690px !important;
  font-family: var(--body, sans-serif) !important;
  font-size: clamp(14px, 0.95vw, 16px) !important;
  line-height: 1.65 !important;
  font-weight: 500 !important;
  color: #ffffff !important;
  text-align: left !important;
}

.koy-home-calidad__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 230px !important;
  height: 58px !important;
  padding: 0 30px !important;
  background: #ed1117 !important;
  color: #ffffff !important;
  font-family: var(--title, sans-serif) !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  font-style: italic !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}

.koy-home-calidad__image {
  min-height: 520px !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
  position: relative !important;
  z-index: 3 !important;
  background: transparent !important;
}

.koy-home-calidad__image img {
  display: block !important;
  height: clamp(430px, 36vw, 590px) !important;
  width: auto !important;
  max-width: none !important;
  object-fit: contain !important;
  transform: translate(80px, 52px) !important;
}
/* ============================================================
   HOME — ELIGE LA CALIDAD / AJUSTE FINAL SIN LETTER-SPACING
   ============================================================ */

.koy-home-calidad {
  position: relative !important;
  min-height: 520px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

.koy-home-calidad::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -1px !important;
  height: 64px !important;
  background: #ffffff !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

.koy-home-calidad__inner {
  width: min(1180px, calc(100% - 80px)) !important;
  min-height: 520px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 52% 48% !important;
  align-items: center !important;
  gap: 20px !important;
  position: relative !important;
  z-index: 2 !important;
  background: transparent !important;
}

.koy-home-calidad__text {
  max-width: 680px !important;
  padding-top: 0 !important;
  transform: translateY(-8px) !important;
  position: relative !important;
  z-index: 3 !important;
  background: transparent !important;
}

.koy-home-calidad__text h2 {
  margin: 0 0 24px !important;
  font-family: var(--title, sans-serif) !important;
  font-size: clamp(30px, 2.75vw, 48px) !important;
  line-height: 1.08 !important;
  font-weight: 800 !important;
  font-style: italic !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  text-align: left !important;
}

.koy-home-calidad__text p {
  margin: 0 0 36px !important;
  max-width: 600px !important;
  font-family: var(--body, sans-serif) !important;
  font-size: clamp(14px, 0.95vw, 16px) !important;
  line-height: 1.6 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  color: #ffffff !important;
  text-align: left !important;
}

.koy-home-calidad__btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 220px !important;
  height: 56px !important;
  padding: 0 30px !important;
  background: #ed1117 !important;
  color: #ffffff !important;
  font-family: var(--title, sans-serif) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  font-style: italic !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}

.koy-home-calidad__image {
  min-height: 520px !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
  position: relative !important;
  z-index: 3 !important;
  background: transparent !important;
}

.koy-home-calidad__image img {
  display: block !important;
  height: clamp(390px, 32vw, 520px) !important;
  width: auto !important;
  max-width: none !important;
  object-fit: contain !important;
  transform: translate(34px, 48px) !important;
}

/* Quitar separación de caracteres en cualquier texto interno de esta sección */
.koy-home-calidad *,
.koy-home-calidad *::before,
.koy-home-calidad *::after {
  letter-spacing: 0 !important;
}
.home-koyama-producto__btn {
    transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease !important;
    will-change: transform !important;
  }

  .home-koyama-producto__btn:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.35) !important;
    background: #111111 !important;
  }

  .home-koyama-producto__btn:active {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.28) !important;
  }
/* ============================================================
   FIX — ELIMINAR ESPACIO BLANCO SUPERIOR EN PÁGINA 404
   ============================================================ */

body.error404,
body.error404 html {
  margin: 0 !important;
  padding: 0 !important;
  background: #050505 !important;
}

body.error404 #page,
body.error404 .site,
body.error404 main,
body.error404 .site-main,
body.error404 .content-area,
body.error404 .entry-content {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.error404 .koy-404,
body.error404 .koyama-404,
body.error404 .error-404,
body.error404 .page-404,
body.error404 section {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.error404 .koy-404 {
  min-height: 100vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
/* ============================================================
   FOOTER — ENLACES FUNCIONALES SIN ROMPER DISEÑO
   ============================================================ */

footer a {
  color: inherit;
  text-decoration: none;
}

footer a:hover {
  color: #ed1117;
}

.footer-contact li a {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  color: inherit;
  text-decoration: none;
}

.footer-contact li a:hover strong,
.footer-contact li a:hover span {
  color: #ed1117;
}

.footer-nav .footer-link {
  color: #ffffff;
  text-decoration: none;
  cursor: pointer;
}

.footer-nav .footer-link.red {
  color: #ed1117;
}

.footer-nav .footer-link:hover {
  color: #ed1117;
}

.footer-logo-center a {
  display: inline-block;
}

.modal-contact-data a {
  color: inherit;
  text-decoration: none;
}

.modal-contact-data a:hover {
  color: #ed1117;
}
/* ============================================================
   FOOTER — ICONOS REDES SIEMPRE BLANCOS
   ============================================================ */

.footer-social .social-icons a,
.footer-social .social-icons a:visited {
  color: #ffffff !important;
}

.footer-social .social-icons a i,
.footer-social .social-icons a:visited i {
  color: #ffffff !important;
}

.footer-social .social-icons a:hover,
.footer-social .social-icons a:focus,
.footer-social .social-icons a:hover i,
.footer-social .social-icons a:focus i {
  color: #ffffff !important;
}

.footer-social .social-icons a:hover {
  background: #ed1117 !important;
  border-color: #ed1117 !important;
}
/* ============================================================
   KOYAMA — MOBILE FIXES (375px–480px)
   Cubre viewports pequeños que faltaban
   ============================================================ */

@media (max-width: 480px) {
  /* Container */
  .container {
    padding: 0 16px;
  }

  /* Topbar: ocultar en mobile pequeño */
  .topbar {
    display: none !important;
  }

  /* Hero home */
  .hero-home {
    height: 300px;
  }
  .hero-home .hero-content {
    padding: 0 16px;
  }
  .hero-home .hero-text h1 {
    font-size: 32px;
  }

  /* Sección calidad */
  .seccion-calidad .sc-text h2 {
    font-size: 26px;
  }
  .seccion-calidad .sc-image img {
    max-height: 200px;
  }

  /* Carousel */
  .carousel-slide {
    flex: 0 0 100%;
    padding: 0 8px;
  }
  .productos-carousel {
    padding: 48px 0 48px;
  }

  /* CTA section */
  .cta-encuentra .cta-text h2 {
    font-size: 28px;
  }
  .cta-encuentra .cta-text {
    padding: 36px 0 32px;
  }

  /* Footer */
  .footer-main {
    padding: 36px 0 28px;
  }
  .footer-main .container {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .footer-bottom .container {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .footer-newsletter h4 {
    font-size: 22px;
  }
  .newsletter-form button {
    width: 100%;
  }

  /* Modal */
  .modal-body {
    padding: 20px 16px;
  }
  .modal-header {
    padding: 16px 20px;
  }
  .modal-header h2 {
    font-size: 16px;
  }

  /* Productos grid */
  .productos-grid .container {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .product-card img {
    max-width: 180px;
    height: 150px;
  }

  /* Blog / Instagram */
  .instagram-grid,
  .blog-grid {
    grid-template-columns: 1fr;
  }
  .page-hero .container {
    padding-top: 36px;
    padding-bottom: 36px;
  }
  .page-hero h1 {
    font-size: 30px;
  }

  /* Catálogo */
  .catalogo-hero h1 {
    font-size: 26px;
  }
  .catalogo-toolbar .container {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* padding-top: 135px at 980px already defined above */

/* ================================================================
   KOYAMA — RESPONSIVE MOBILE FIXES v2
   Corrige: navbar gap, seccion-calidad, catalogo, ingenieria, beneficios
   ================================================================ */

/* --- FIX GLOBAL: sin espacio lateral blanco --- */
html, body {
  overflow-x: hidden !important;
  max-width: 100% !important;
}

/* --- FIX: body padding-top cuando topbar está oculta (768px) --- */
@media (max-width: 768px) {
  .topbar {
    display: none !important;
  }
  .navbar,
  .navbar-preview-redesign {
    top: 0 !important;
    height: 90px !important;
  }
  .navbar .container,
  .nav-main-row {
    height: 90px !important;
  }
  body {
    padding-top: 90px !important;
  }
  .nav-right {
    top: 90px !important;
    height: calc(100vh - 90px) !important;
  }
}
  body {
    padding-top: 90px !important;
  }
  /* topbar ya tiene display:none, navbar height = 90px */
}

/* --- FIX: SECCIÓN 2 — "ELIGE LA CALIDAD" (seccion-calidad) --- */
/* Imagen más grande + sobresale hacia la sección de abajo */
@media (max-width: 900px) {
  .seccion-calidad {
    overflow: visible !important;
    padding-bottom: 0 !important;
  }
  .seccion-calidad .container {
    padding-bottom: 0 !important;
  }
  .seccion-calidad .sc-image {
    margin-bottom: -120px !important;
    justify-content: center !important;
    position: relative !important;
    z-index: 4 !important;
  }
  .seccion-calidad .sc-image img {
    max-height: 400px !important;
    width: auto !important;
  }
  /* La sección siguiente (carousel) necesita padding-top para acomodar el desborde */
  .productos-carousel {
    padding-top: 140px !important;
  }
}

@media (max-width: 600px) {
  .seccion-calidad .sc-image {
    margin-bottom: -100px !important;
  }
  .seccion-calidad .sc-image img {
    max-height: 330px !important;
  }
  .productos-carousel {
    padding-top: 115px !important;
  }
}

/* --- FIX: SECCIÓN 3 — "CATÁLOGO DE PRODUCTOS" --- */
/* Imagen centrada, más abajo, sobresale hacia la sección de abajo */
@media (max-width: 980px) {
  /* Forzar columna única en catalogo */
  .koy-home-catalogo__inner,
  body.pagina-inicio .koy-home-catalogo__inner {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Texto primero */
  .koy-home-catalogo__text,
  body.pagina-inicio .koy-home-catalogo__text {
    order: 1 !important;
    text-align: center !important;
    max-width: 100% !important;
    padding: 36px 0 0 !important;
  }

  .koy-home-catalogo__text h2,
  body.pagina-inicio .koy-home-catalogo__text h2 {
    text-align: center !important;
  }

  .koy-home-catalogo__text p,
  body.pagina-inicio .koy-home-catalogo__text p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Imagen centrada abajo, desborda hacia sección siguiente */
  .koy-home-catalogo__image,
  body.pagina-inicio .koy-home-catalogo__image {
    order: 2 !important;
    min-height: auto !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    overflow: visible !important;
    margin-bottom: -100px !important;
    position: relative !important;
    z-index: 4 !important;
  }

  .koy-home-catalogo__image img,
  body.pagina-inicio .koy-home-catalogo__image img {
    display: block !important;
    height: clamp(260px, 55vw, 380px) !important;
    width: auto !important;
    max-width: 90% !important;
    transform: translate(0, 40px) !important;
    margin: 0 auto !important;
    object-fit: contain !important;
  }

  /* Sección siguiente necesita padding para acomodar el desborde */
  .koy-home-ingenieria {
    padding-top: 130px !important;
  }
}

@media (max-width: 600px) {
  .koy-home-catalogo__image img,
  body.pagina-inicio .koy-home-catalogo__image img {
    height: clamp(220px, 60vw, 300px) !important;
    transform: translate(0, 30px) !important;
  }
  .koy-home-catalogo__image,
  body.pagina-inicio .koy-home-catalogo__image {
    margin-bottom: -80px !important;
  }
  .koy-home-ingenieria {
    padding-top: 105px !important;
  }
}

/* --- FIX: SECCIÓN 4 — "INGENIERÍA JAPONESA" --- */
/* Imagen más pequeña y bien encuadrada en mobile */
@media (max-width: 980px) {
  .koy-home-ingenieria__image,
  body.pagina-inicio .koy-home-ingenieria__image {
    height: auto !important;
    justify-content: center !important;
    align-items: center !important;
  }

  .koy-home-ingenieria__image img,
  body.pagina-inicio .koy-home-ingenieria__image img {
    width: min(80vw, 360px) !important;
    height: auto !important;
    max-height: 360px !important;
    object-fit: contain !important;
    transform: none !important;
  }

  .koy-home-ingenieria__text h2,
  body.pagina-inicio .koy-home-ingenieria__text h2 {
    text-align: center !important;
    font-size: clamp(24px, 7vw, 36px) !important;
  }

  .koy-home-ingenieria__text p,
  body.pagina-inicio .koy-home-ingenieria__text p {
    text-align: center !important;
    max-width: 540px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

@media (max-width: 600px) {
  .koy-home-ingenieria__image img,
  body.pagina-inicio .koy-home-ingenieria__image img {
    width: min(70vw, 280px) !important;
    max-height: 280px !important;
  }
}

/* --- FIX: SECCIÓN 5 — BENEFICIOS (franja roja con iconos) --- */
/* Iconos más pequeños, centrados, columna única en mobile */
@media (max-width: 900px) {
  .koy-benefits-strip {
    padding: 32px 0 !important;
  }

  .koy-benefits-strip .container {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    max-width: 320px !important;
    margin: 0 auto !important;
  }

  .koy-benefit {
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 16px !important;
    min-height: auto !important;
  }

  .koy-benefit__icon {
    width: 38px !important;
    height: 38px !important;
    flex-shrink: 0 !important;
  }

  .koy-benefit span {
    font-size: 13px !important;
    letter-spacing: 0.5px !important;
  }
}

@media (max-width: 600px) {
  .koy-benefits-strip .container {
    max-width: calc(100% - 40px) !important;
    gap: 16px !important;
  }

  .koy-benefit__icon {
    width: 32px !important;
    height: 32px !important;
  }

  .koy-benefit span {
    font-size: 12px !important;
  }
}

/* --- FIX: NAV-LOGO alineación correcta en mobile --- */
@media (max-width: 980px) {
  .navbar .container,
  .nav-main-row {
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  .nav-logo {
    padding-left: 16px !important;
    padding-right: 0 !important;
    display: flex !important;
    align-items: center !important;
  }

  .nav-logo img {
    height: 48px !important;
    max-height: 48px !important;
    width: auto !important;
    display: block !important;
  }

  .nav-toggle {
    margin-right: 16px !important;
  }
}


/* --- FIX: Ingenieria inner min-height en mobile --- */
@media (max-width: 980px) {
  .pagina-inicio .koy-home-ingenieria__inner,
  body.pagina-inicio .koy-home-ingenieria__inner {
    min-height: auto !important;
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    padding: 40px 0 60px !important;
    width: min(100% - 40px, 600px) !important;
  }

  .pagina-inicio .koy-home-ingenieria,
  body.pagina-inicio .koy-home-ingenieria {
    min-height: auto !important;
  }
}
/* ============================================================
   BLOG — ARTÍCULOS DINÁMICOS
   ============================================================ */

.blog-card a {
  color: inherit;
  text-decoration: none;
}

.blog-card h3 a {
  color: #050505;
  text-decoration: none;
}

.blog-card h3 a:hover {
  color: #ed1117;
}

.blog-img {
  display: block;
  width: 100%;
  height: 210px;
  overflow: hidden;
  background: #f2f2f2;
}

.blog-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.blog-pagination {
  margin-top: 46px;
  text-align: center;
}

.blog-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  margin: 0 4px;
  padding: 0 10px;
  background: #f4f4f4;
  color: #050505;
  font-family: var(--body, sans-serif);
  font-size: 14px;
  text-decoration: none;
}

.blog-pagination .page-numbers.current,
.blog-pagination .page-numbers:hover {
  background: #ed1117;
  color: #ffffff;
}
/* ============================================================
   SINGLE BLOG KOYAMA
   ============================================================ */

body.pagina-single-blog,
body.pagina-single-blog * {
  letter-spacing: 0 !important;
}

.koy-single-post {
  background: #ffffff;
}

.koy-single-hero {
  background: #f8f8f8;
  padding: 70px 0 55px;
  text-align: left;
}

.koy-single-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
  font-family: var(--body, sans-serif);
  font-size: 13px;
  color: #777777;
}

.koy-single-breadcrumb a {
  color: #777777;
  text-decoration: none;
}

.koy-single-breadcrumb a:hover {
  color: #ed1117;
}

.koy-single-breadcrumb strong {
  color: #050505;
  font-weight: 600;
}

.koy-single-category {
  margin-bottom: 14px;
  font-family: var(--body, sans-serif);
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  color: #ed1117;
}

.koy-single-hero h1 {
  max-width: 850px;
  margin: 0 0 20px;
  font-family: var(--title, sans-serif);
  font-size: clamp(34px, 4vw, 68px);
  line-height: 0.98;
  font-weight: 800;
  font-style: italic;
  text-transform: uppercase;
  color: #050505;
}

.koy-single-meta {
  display: flex;
  align-items: center;
  gap: 20px;
  font-family: var(--body, sans-serif);
  font-size: 14px;
  color: #777777;
}

.koy-single-meta i {
  color: #ed1117;
}

.koy-single-featured {
  padding: 50px 0 0;
  background: #ffffff;
}

.koy-single-featured img {
  display: block;
  width: 100%;
  max-height: 520px;
  object-fit: cover;
  object-position: center;
}

.koy-single-content {
  padding: 55px 0 90px;
  background: #ffffff;
}

.koy-single-article {
  max-width: 850px;
  margin: 0 auto;
  font-family: var(--body, sans-serif);
  font-size: 17px;
  line-height: 1.75;
  color: #222222;
}

.koy-single-article p {
  margin: 0 0 24px;
}

.koy-single-article h2,
.koy-single-article h3,
.koy-single-article h4 {
  margin: 42px 0 18px;
  font-family: var(--title, sans-serif);
  font-style: italic;
  font-weight: 800;
  line-height: 1.05;
  color: #050505;
  text-transform: uppercase;
}

.koy-single-article h2 {
  font-size: clamp(26px, 2.5vw, 40px);
}

.koy-single-article h3 {
  font-size: clamp(22px, 2vw, 32px);
}

.koy-single-article ul,
.koy-single-article ol {
  margin: 0 0 26px 22px;
  padding: 0;
}

.koy-single-article li {
  margin-bottom: 10px;
}

.koy-single-article img {
  max-width: 100%;
  height: auto;
}

.koy-single-article a {
  color: #ed1117;
  text-decoration: none;
  font-weight: 600;
}

.koy-single-article a:hover {
  text-decoration: underline;
}

.koy-single-back {
  max-width: 850px;
  margin: 50px auto 0;
}

.koy-single-back a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 24px;
  background: #ed1117;
  color: #ffffff;
  font-family: var(--title, sans-serif);
  font-size: 14px;
  font-weight: 800;
  font-style: italic;
  text-transform: uppercase;
  text-decoration: none;
  transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease;
}

.koy-single-back a:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 28px rgba(0,0,0,.28);
  background: #d90000;
}

@media (max-width: 700px) {
  .koy-single-hero {
    padding: 48px 0 42px;
  }

  .koy-single-meta {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .koy-single-featured {
    padding-top: 32px;
  }

  .koy-single-content {
    padding: 38px 0 70px;
  }

  .koy-single-article {
    font-size: 16px;
    line-height: 1.65;
  }
}
/* ============================================================
   FIX — BLOG Y ARTÍCULOS NO DEBEN QUEDAR TAPADOS POR HEADER
   ============================================================ */

/* Página principal del blog */
body.pagina-blog .page-hero {
  padding-top: 230px !important;
  padding-bottom: 70px !important;
  margin-top: 0 !important;
}

/* Si la página de blog empieza directo en Instagram o Artículos */
body.pagina-blog .instagram-section,
body.pagina-blog .blog-articles {
  position: relative !important;
  z-index: 1 !important;
}

/* Entrada individual del blog */
body.pagina-single-blog .koy-single-hero {
  padding-top: 230px !important;
  padding-bottom: 60px !important;
  margin-top: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Imagen destacada y contenido del artículo */
body.pagina-single-blog .koy-single-featured,
body.pagina-single-blog .koy-single-content {
  position: relative !important;
  z-index: 1 !important;
}

/* Evita que el header tape elementos por sombra o capa */
body.pagina-blog .navbar,
body.pagina-single-blog .navbar,
body.pagina-blog .topbar,
body.pagina-single-blog .topbar {
  z-index: 9999 !important;
}

/* Responsive */
@media (max-width: 900px) {
  body.pagina-blog .page-hero {
    padding-top: 145px !important;
    padding-bottom: 48px !important;
  }

  body.pagina-single-blog .koy-single-hero {
    padding-top: 145px !important;
    padding-bottom: 42px !important;
  }
}

@media (max-width: 600px) {
  body.pagina-blog .page-hero {
    padding-top: 130px !important;
  }

  body.pagina-single-blog .koy-single-hero {
    padding-top: 130px !important;
  }
}
/* ============================================================
   SINGLE BLOG — COMPARTIR Y ARTÍCULOS RELACIONADOS
   ============================================================ */

body.pagina-single-blog .koy-single-share,
body.single-post .koy-single-share {
  max-width: 860px;
  margin: 54px auto 18px;
  padding-top: 34px;
  border-top: 1px solid #eeeeee;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
}

body.pagina-single-blog .koy-single-share h3,
body.single-post .koy-single-share h3 {
  margin: 0;
  font-family: var(--body, sans-serif);
  font-size: 20px;
  line-height: 1;
  font-weight: 700;
  color: #050505;
}

body.pagina-single-blog .koy-single-share__icons,
body.single-post .koy-single-share__icons {
  display: flex;
  align-items: center;
  gap: 14px;
}

body.pagina-single-blog .koy-single-share__icons a,
body.single-post .koy-single-share__icons a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  color: #ed1117;
  font-size: 23px;
  text-decoration: none;
  transition: transform .25s ease, color .25s ease;
}

body.pagina-single-blog .koy-single-share__icons a:hover,
body.single-post .koy-single-share__icons a:hover {
  transform: translateY(-5px);
  color: #050505;
}

body.pagina-single-blog .koy-related-posts,
body.single-post .koy-related-posts {
  max-width: 1080px;
  margin: 62px auto 0;
}

body.pagina-single-blog .koy-related-posts__head,
body.single-post .koy-related-posts__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 30px;
}

body.pagina-single-blog .koy-related-posts__head h2,
body.single-post .koy-related-posts__head h2 {
  margin: 0;
  font-family: var(--body, sans-serif);
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.15;
  font-weight: 700;
  color: #050505;
  text-transform: none;
}

body.pagina-single-blog .koy-related-posts__head a,
body.single-post .koy-related-posts__head a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--body, sans-serif);
  font-size: 14px;
  font-weight: 700;
  color: #ed1117;
  text-decoration: none;
  transition: transform .25s ease;
}

body.pagina-single-blog .koy-related-posts__head a:hover,
body.single-post .koy-related-posts__head a:hover {
  transform: translateX(4px);
}

body.pagina-single-blog .koy-related-posts__grid,
body.single-post .koy-related-posts__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 26px;
}

body.pagina-single-blog .koy-related-card,
body.single-post .koy-related-card {
  background: #ffffff;
  border: 1px solid #e5e5e5;
  border-radius: 14px;
  overflow: hidden;
  position: relative;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

body.pagina-single-blog .koy-related-card:hover,
body.single-post .koy-related-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 34px rgba(0,0,0,.12);
  border-color: rgba(237,17,23,.28);
}

body.pagina-single-blog .koy-related-card__image,
body.single-post .koy-related-card__image {
  display: block;
  width: 100%;
  height: 185px;
  background: #f2f2f2;
  overflow: hidden;
}

body.pagina-single-blog .koy-related-card__image img,
body.single-post .koy-related-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  margin: 0;
  transition: transform .35s ease;
}

body.pagina-single-blog .koy-related-card:hover .koy-related-card__image img,
body.single-post .koy-related-card:hover .koy-related-card__image img {
  transform: scale(1.05);
}

body.pagina-single-blog .koy-related-card__body,
body.single-post .koy-related-card__body {
  position: relative;
  padding: 18px 48px 24px 20px;
  min-height: 128px;
}

body.pagina-single-blog .koy-related-card__cat,
body.single-post .koy-related-card__cat {
  margin: 0 0 10px;
  font-family: var(--body, sans-serif);
  font-size: 13px;
  line-height: 1.2;
  color: #777777;
}

body.pagina-single-blog .koy-related-card h3,
body.single-post .koy-related-card h3 {
  margin: 0;
  font-family: var(--title, sans-serif);
  font-size: 17px;
  line-height: 1.25;
  font-weight: 800;
  font-style: italic;
  color: #050505;
  text-transform: none;
}

body.pagina-single-blog .koy-related-card h3 a,
body.single-post .koy-related-card h3 a {
  color: #050505;
  text-decoration: none;
}

body.pagina-single-blog .koy-related-card h3 a:hover,
body.single-post .koy-related-card h3 a:hover {
  color: #ed1117;
}

body.pagina-single-blog .koy-related-card__arrow,
body.single-post .koy-related-card__arrow {
  position: absolute;
  right: 20px;
  bottom: 24px;
  color: #050505;
  font-size: 18px;
  text-decoration: none;
  transition: transform .25s ease, color .25s ease;
}

body.pagina-single-blog .koy-related-card__arrow:hover,
body.single-post .koy-related-card__arrow:hover {
  transform: translateX(4px);
  color: #ed1117;
}

@media (max-width: 900px) {
  body.pagina-single-blog .koy-related-posts__grid,
  body.single-post .koy-related-posts__grid {
    grid-template-columns: 1fr;
  }

  body.pagina-single-blog .koy-related-card__image,
  body.single-post .koy-related-card__image {
    height: 220px;
  }
}

@media (max-width: 600px) {
  body.pagina-single-blog .koy-single-share,
  body.single-post .koy-single-share {
    flex-direction: column;
    gap: 12px;
    margin-top: 42px;
  }

  body.pagina-single-blog .koy-related-posts__head,
  body.single-post .koy-related-posts__head {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }
}
/* ============================================================
   SINGLE BLOG — EXTRACTO EN ARTÍCULOS RECOMENDADOS
   ============================================================ */

.koy-related-card__body {
  padding: 18px 48px 28px 20px !important;
  min-height: 165px !important;
}

.koy-related-card__excerpt {
  margin: 10px 0 0 !important;
  font-family: var(--body, sans-serif) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  font-weight: 400 !important;
  font-style: normal !important;
  color: #555555 !important;
  text-transform: none !important;
}

.koy-related-card__arrow {
  bottom: 26px !important;
}
/* ============================================================
   FIX — MODAL DISTRIBUIDOR POR ENCIMA DEL HEADER
   ============================================================ */

.modal-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  background: rgba(0, 0, 0, 0.78) !important;
  display: none;
  align-items: center !important;
  justify-content: center !important;
  padding: 40px 20px !important;
  overflow-y: auto !important;
}

.modal-overlay.active,
.modal-overlay.is-active,
.modal-overlay.visible,
body.modal-open .modal-overlay {
  display: flex !important;
}

.modal-box {
  position: relative !important;
  z-index: 1000000 !important;
  margin: auto !important;
  max-height: calc(100vh - 80px) !important;
  overflow-y: auto !important;
}

.navbar,
.navbar-preview-redesign,
.topbar {
  z-index: 9999 !important;
}
/* ============================================================
   RESPONSIVE — BLOG LATEST COMO CARRUSEL EN MÓVIL
   Aplica a la sección de blog repetida en páginas internas
   ============================================================ */

@media (max-width: 768px) {

  .koy-blog-latest {
    overflow: hidden !important;
    position: relative !important;
  }

  .koy-blog-latest .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: hidden !important;
  }

  .koy-blog-latest__title,
  .koy-blog-latest h2 {
    width: calc(100% - 40px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  .koy-blog-latest .koy-blog-grid,
  .koy-blog-latest .blog-grid,
  .koy-blog-latest .koy-blog-latest__grid {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 0 !important;
    width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    scroll-behavior: smooth !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 0 20px 28px !important;
    margin: 0 !important;
  }

  .koy-blog-latest .koy-blog-grid::-webkit-scrollbar,
  .koy-blog-latest .blog-grid::-webkit-scrollbar,
  .koy-blog-latest .koy-blog-latest__grid::-webkit-scrollbar {
    display: none !important;
  }

  .koy-blog-latest .koy-blog-card,
  .koy-blog-latest .blog-card,
  .koy-blog-latest article {
    flex: 0 0 calc(100vw - 40px) !important;
    max-width: calc(100vw - 40px) !important;
    width: calc(100vw - 40px) !important;
    scroll-snap-align: center !important;
    margin: 0 10px !important;
    box-sizing: border-box !important;
  }

  .koy-blog-latest .koy-blog-card:first-child,
  .koy-blog-latest .blog-card:first-child,
  .koy-blog-latest article:first-child {
    margin-left: 0 !important;
  }

  .koy-blog-latest .koy-blog-card:last-child,
  .koy-blog-latest .blog-card:last-child,
  .koy-blog-latest article:last-child {
    margin-right: 0 !important;
  }

  .koy-blog-latest .koy-blog-card__image,
  .koy-blog-latest .blog-img,
  .koy-blog-latest article img {
    width: 100% !important;
  }

  .koy-blog-latest .koy-blog-card__image,
  .koy-blog-latest .blog-img {
    height: 300px !important;
    overflow: hidden !important;
  }

  .koy-blog-latest .koy-blog-card__image img,
  .koy-blog-latest .blog-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
  }

  /* Flechas del carrusel */
  .koy-blog-mobile-arrow {
    display: flex !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 46px !important;
    height: 70px !important;
    align-items: center !important;
    justify-content: center !important;
    background: #ed1117 !important;
    color: #ffffff !important;
    border: 0 !important;
    border-radius: 0 !important;
    font-size: 24px !important;
    line-height: 1 !important;
    z-index: 20 !important;
    cursor: pointer !important;
  }

  .koy-blog-mobile-arrow.prev {
    left: 14px !important;
  }

  .koy-blog-mobile-arrow.next {
    right: 14px !important;
  }

  .koy-blog-mobile-arrow i {
    color: #ffffff !important;
  }

  /* Puntos */
  .koy-blog-mobile-dots {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 9px !important;
    width: 100% !important;
    margin: 2px auto 0 !important;
    padding-bottom: 8px !important;
  }

  .koy-blog-mobile-dots button {
    width: 12px !important;
    height: 12px !important;
    border-radius: 50% !important;
    border: 0 !important;
    padding: 0 !important;
    background: #d8d8d8 !important;
    cursor: pointer !important;
  }

  .koy-blog-mobile-dots button.is-active {
    background: #ed1117 !important;
  }
}

@media (min-width: 769px) {
  .koy-blog-mobile-arrow,
  .koy-blog-mobile-dots {
    display: none !important;
  }
}
/* ============================================================
   AJUSTE — BOTONES MÁS PEQUEÑOS CARRUSEL BLOG RESPONSIVE
   ============================================================ */

@media (max-width: 768px) {
  .koy-blog-mobile-arrow {
    width: 34px !important;
    height: 50px !important;
    font-size: 17px !important;
  }

  .koy-blog-mobile-arrow.prev {
    left: 10px !important;
  }

  .koy-blog-mobile-arrow.next {
    right: 10px !important;
  }

  .koy-blog-mobile-dots button {
    width: 9px !important;
    height: 9px !important;
  }

  .koy-blog-mobile-dots {
    gap: 7px !important;
  }
}
/* ============================================================
   FIX — OCULTAR CLONES DEL CARRUSEL BLOG EN DESKTOP
   ============================================================ */

@media (min-width: 769px) {
  .koy-blog-latest .koy-blog-clone {
    display: none !important;
  }
}

@media (max-width: 768px) {
  .koy-blog-latest .koy-blog-clone {
    display: block !important;
  }
}
/* ============================================================
   PRODUCTOS — IMÁGENES CLICKEABLES
   ============================================================ */

.product-card-img-link {
  display: block;
  width: 100%;
  text-decoration: none;
  cursor: pointer;
}

.product-card-img-link img {
  transition: transform .28s ease, filter .28s ease;
}

.product-card-img-link:hover img {
  transform: translateY(-6px) scale(1.03);
  filter: drop-shadow(0 14px 18px rgba(0,0,0,.16));
}

.product-card h3 {
  margin-top: 18px;
}

.product-card-cremalleras {
  grid-column: 1 / -1;
  max-width: 340px;
  justify-self: start;
}
/* ============================================================
   FIX — CATÁLOGO NO DEBE QUEDAR TAPADO POR EL HEADER
   ============================================================ */

body.page-template-page-catalogo .catalogo-hero,
body.page-template-page-catalogo .koy-catalogo-hero,
body.page-template-page-catalogo .page-hero,
body.page-template-page-catalogo .catalogo-banner,
body.page-template-page-catalogo section:first-of-type {
  padding-top: 230px !important;
  margin-top: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Por si la plantilla no tiene body_class */
.catalogo-hero,
.koy-catalogo-hero,
.catalogo-banner {
  padding-top: 230px !important;
}

/* Mantiene el header por encima, pero sin tapar el contenido */
body.page-template-page-catalogo .navbar,
body.page-template-page-catalogo .topbar {
  z-index: 9999 !important;
}

/* Responsive */
@media (max-width: 900px) {
  body.page-template-page-catalogo .catalogo-hero,
  body.page-template-page-catalogo .koy-catalogo-hero,
  body.page-template-page-catalogo .page-hero,
  body.page-template-page-catalogo .catalogo-banner,
  body.page-template-page-catalogo section:first-of-type,
  .catalogo-hero,
  .koy-catalogo-hero,
  .catalogo-banner {
    padding-top: 145px !important;
  }
}

@media (max-width: 600px) {
  body.page-template-page-catalogo .catalogo-hero,
  body.page-template-page-catalogo .koy-catalogo-hero,
  body.page-template-page-catalogo .page-hero,
  body.page-template-page-catalogo .catalogo-banner,
  body.page-template-page-catalogo section:first-of-type,
  .catalogo-hero,
  .koy-catalogo-hero,
  .catalogo-banner {
    padding-top: 130px !important;
  }
}
/* =========================
   SECCIÓN LUCHO ALAYZA
========================= */

.nos-lucho {
  position: relative;
  background: #000;
  overflow: hidden;
  padding: 0;
}

.nos-lucho::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to right, rgba(0,0,0,.35) 0%, rgba(0,0,0,.12) 45%, rgba(0,0,0,0) 100%),
    url('<?php echo esc_url($u . '/images/koyama-nosotros-bg-hero.png'); ?>') center center / cover no-repeat;
  opacity: 1;
  z-index: 1;
}

.nos-lucho__inner {
  position: relative;
  z-index: 2;
  width: min(1180px, calc(100% - 80px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 46% 54%;
  align-items: center;
  min-height: 470px;
  gap: 36px;
}

/* FOTO */
.nos-lucho__photo {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  height: 100%;
}

.nos-lucho__photo img {
  display: block;
  width: clamp(300px, 26vw, 430px);
  max-width: 100%;
  height: auto;
  transform: translateY(18px);
}

/* TEXTO */
.nos-lucho__content {
  max-width: 650px;
  color: #ffffff;
  padding: 40px 0;
}

.nos-lucho__title {
  margin: 0;
  font-family: var(--title, sans-serif);
  font-size: clamp(38px, 3.8vw, 62px);
  line-height: .95;
  font-style: italic;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0 !important;
}

.nos-lucho__title .white {
  color: #ffffff;
}

.nos-lucho__title .red {
  color: #ed1117;
}

.nos-lucho__subtitle {
  margin: 8px 0 0;
  font-family: var(--title, sans-serif);
  font-size: clamp(17px, 1.2vw, 23px);
  line-height: 1;
  font-style: italic;
  font-weight: 800;
  text-transform: uppercase;
  color: #ffffff;
  letter-spacing: 0 !important;
}

.nos-lucho__line {
  display: block;
  width: 92px;
  height: 4px;
  background: #ed1117;
  margin: 14px 0 30px;
}

/* ITEMS */
.nos-lucho__features {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px 38px;
  max-width: 690px;
}

.nos-lucho__feature {
  display: grid;
  grid-template-columns: 44px 1fr;
  align-items: start;
  gap: 14px;
}

.nos-lucho__icon {
  width: 44px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  color: #ed1117;
  font-size: 30px;
  line-height: 1;
}

.nos-lucho__feature p {
  margin: 0;
  font-family: var(--body, sans-serif);
  font-size: 15px;
  line-height: 1.35;
  font-weight: 600;
  color: #ffffff;
  letter-spacing: 0 !important;
}

.nos-lucho__feature:nth-child(3) {
  grid-column: 1 / 2;
}

/* RESPONSIVE */
@media (max-width: 980px) {
  .nos-lucho {
    padding: 46px 0 0;
  }

  .nos-lucho__inner {
    width: min(100% - 36px, 520px);
    grid-template-columns: 1fr;
    min-height: auto;
    gap: 22px;
  }

  .nos-lucho__photo {
    justify-content: center;
  }

  .nos-lucho__photo img {
    width: min(330px, 82vw);
    transform: translateY(0);
  }

  .nos-lucho__content {
    max-width: 100%;
    padding: 0 0 46px;
  }

  .nos-lucho__title {
    font-size: clamp(36px, 10vw, 52px);
  }

  .nos-lucho__subtitle {
    font-size: 18px;
  }

  .nos-lucho__features {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .nos-lucho__feature:nth-child(3) {
    grid-column: auto;
  }
}
/* REDES SOCIALES BLOG */
.redes-grid {
  display: flex;
  align-items: flex-start;
  gap: 0;
  margin-top: 32px;
}

.red-card {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
}

.red-card__img-link {
  width: 100%;
  max-width: 420px;
  text-decoration: none;
}

.red-card__img {
  width: 100%;
  aspect-ratio: 4/3;
  border: 2px solid #ed1117;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  background: #f5f5f5;
  transition: background .2s ease;
  padding: 24px;
  text-align: center;
}

.red-card__img:hover {
  background: #ffeaea;
}

.red-card__icon {
  font-size: 36px;
  color: #ed1117;
}

.red-card__img span {
  font-family: var(--title, sans-serif);
  font-size: 15px;
  font-weight: 800;
  font-style: italic;
  text-transform: uppercase;
  color: #050505;
  line-height: 1.2;
}

.red-card__label {
  font-family: var(--title, sans-serif);
  font-size: 17px;
  font-weight: 800;
  font-style: italic;
  color: #050505;
  text-align: center;
  margin: 0;
}

.red-card__divider {
  width: 1px;
  background: #ed1117;
  align-self: stretch;
  margin: 0 40px;
  min-height: 200px;
}

@media (max-width: 700px) {
  .redes-grid {
    flex-direction: column;
    gap: 40px;
  }
  .red-card__divider {
    width: 100%;
    height: 1px;
    min-height: auto;
    margin: 0;
  }
}
@media (max-width: 900px) {
  /* Menos aire arriba del título en hero blog */
  .pagina-blog .page-hero {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
    min-height: auto !important;
  }

  /* "Ver perfil" baja debajo del título */
  .pagina-blog .section-title {
    flex-wrap: wrap !important;
  }

  .pagina-blog .section-title .title-line {
    display: none !important;
  }

  .pagina-blog .section-title a.link-red {
    width: 100% !important;
    margin-top: 4px !important;
  }
}
/* Rally piloto — overlay + texto centrado verticalmente */
@media (max-width: 1100px) {
  .nos-rally-piloto {
    position: relative !important;
  }
  .nos-rally-piloto::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: rgba(0, 0, 0, 0.55) !important;
    z-index: 1 !important;
    pointer-events: none !important;
  }
  .nos-rally-piloto__inner {
    position: relative !important;
    z-index: 2 !important;
    align-items: center !important;
    justify-items: center !important;
  }
  .nos-rally-piloto__text p {
    text-align: center !important;
  }
}

/* Seguridad — imagen centrada + overlay muy oscuro */
@media (max-width: 1100px) {
body.pagina-nosotros .nos-seguridad {
    background-position: 90% center !important;
}
  }
  .nos-seguridad::after {
    background: rgba(0, 0, 0, 0.75) !important;
  }
}
.carousel-slide a {
  display: block;
  text-decoration: none;
  color: inherit;
}
.carousel-slide a img {
  cursor: pointer;
  transition: transform 0.25s ease, opacity 0.25s ease;
}
.carousel-slide a:hover img {
  opacity: 0.85;
  transform: scale(1.02);
}