/* ════ AGROPET® — Estilos del Sistema A (páginas de geo-targeting /soluciones/) ════
   Se carga SOLO en las páginas de soluciones, ADEMÁS de styles.css (reutiliza sus
   variables :root: --green, --green-light, --teal-800, --teal-900, etc.). */

.breadcrumb { font-size: .85rem; color: rgba(255,255,255,.7); }
.breadcrumb a { color: rgba(255,255,255,.85); text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }
.breadcrumb [aria-current] { color: var(--green-light, #8ed98e); }

/* Hero de la página geo (oscuro, centrado) */
.geo-hero { background: var(--teal-900, #0e342d); color: #fff; padding: 2.4rem 0 3rem; }
.geo-hero .container { max-width: 50rem; }
.geo-hero h1 { font-size: clamp(1.7rem, 4vw, 2.7rem); line-height: 1.12; margin: .6rem 0 .8rem; }
.geo-hero .accent { color: var(--green-light, #8ed98e); }
.geo-hero .geo-lead { font-size: 1.1rem; color: rgba(255,255,255,.85); max-width: 42rem; }
.geo-hero .geo-ctas { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.4rem; }

/* Rejilla dolor → solución */
.pain-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1.1rem; margin-top: 1.6rem; }
.pain-card { background: #fff; border: 1px solid rgba(18,63,54,.12); border-radius: 14px; padding: 1.3rem 1.25rem; }
.pain-card h3 { margin: 0 0 .45rem; font-size: 1.08rem; color: var(--teal-800, #123f36); }
.pain-card p { margin: 0; color: #41514c; font-size: .96rem; line-height: 1.5; }
.pain-card .tag { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--green, #3e9a4a); margin-bottom: .5rem; }

/* Tabla de calibres recomendados */
.cal-table { width: 100%; border-collapse: collapse; margin-top: 1.1rem; font-size: .95rem; }
.cal-table th, .cal-table td { text-align: left; padding: .7rem .8rem; border-bottom: 1px solid rgba(18,63,54,.12); }
.cal-table th { background: rgba(95,192,106,.1); color: var(--teal-800, #123f36); font-weight: 700; }
.cal-table td:first-child { font-weight: 700; color: var(--green, #3e9a4a); white-space: nowrap; }

/* FAQ acordeón accesible (details/summary nativo) */
.faq { margin-top: 1.4rem; display: grid; gap: .7rem; }
.faq details { border: 1px solid rgba(18,63,54,.14); border-radius: 12px; background: #fff; overflow: hidden; }
.faq summary { cursor: pointer; padding: 1rem 1.1rem; font-weight: 650; color: var(--teal-800, #123f36); list-style: none; position: relative; padding-inline-end: 2.4rem; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; inset-inline-end: 1.1rem; top: 50%; transform: translateY(-50%); font-size: 1.3rem; color: var(--green, #3e9a4a); transition: transform .2s; }
.faq details[open] summary::after { content: "−"; }
.faq .faq-a { padding: 0 1.1rem 1.1rem; color: #41514c; line-height: 1.55; }

/* Banda de confianza (certificaciones / fabricado en Europa) */
.trust-band { background: rgba(95,192,106,.08); border-block: 1px solid rgba(18,63,54,.1); }
.trust-band .container { display: flex; flex-wrap: wrap; align-items: center; gap: 1.2rem 2rem; justify-content: center; text-align: center; padding-block: 1.4rem; }
.trust-band .trust-item { display: flex; align-items: center; gap: .6rem; font-weight: 600; color: var(--teal-800, #123f36); font-size: .95rem; }

/* Bloque de enlaces internos (a marca / blog) */
.related-links { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.2rem; }
.related-links a { display: inline-block; padding: .5rem .9rem; border: 1px solid rgba(18,63,54,.16); border-radius: 999px; text-decoration: none; color: var(--teal-800, #123f36); font-size: .9rem; font-weight: 600; }
.related-links a:hover { background: rgba(95,192,106,.12); }

/* RTL: las propiedades lógicas (inset-inline, padding-inline) ya se adaptan solas. */
[dir="rtl"] .geo-hero .geo-lead { margin-inline: 0; }