/* Kissna opinions archive — readable pink presentation, scoped to this microsite. */
:root { --op-pink: #c92f72; --op-pink-dark: #861a4b; --op-pink-soft: #fff2f7; --op-ink: #35232c; --op-muted: #4e3c45; --op-line: #efd5e1; }
.opiniones-page .content-section { border-color: var(--op-line); box-shadow: 0 10px 28px rgba(104, 33, 67, .06); }
.opiniones-page .content-section > h2 { color: var(--op-ink); font-size: clamp(1.65rem, 3vw, 2.15rem); line-height: 1.13; }
.opiniones-page .content-section > p { color: var(--op-muted); max-width: 68ch; font-size: 1rem; font-weight: 500; line-height: 1.7; }
.opiniones-page .eyebrow { color: var(--op-pink); }

/* Archive numbers: each figure is independently legible rather than one run-on row. */
.opiniones-page .review-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 26px 0 20px; padding: 11px; border-radius: 18px; background: linear-gradient(135deg, var(--op-pink-dark), #ba2766); box-shadow: 0 12px 26px rgba(134, 26, 75, .18); }
.opiniones-page .review-summary > div { min-height: 112px; padding: 18px 16px; display: flex; flex-direction: column; justify-content: center; border: 1px solid rgba(255,255,255,.42); border-radius: 11px; background: rgba(255,255,255,.98); }
.opiniones-page .review-summary strong { color: var(--op-pink-dark); font-size: clamp(1.5rem, 3vw, 2.2rem); line-height: 1; letter-spacing: -.04em; }
.opiniones-page .review-summary span { margin-top: .55rem; color: #4e3c45; font-size: .82rem; font-weight: 800; line-height: 1.35; }

/* Year and source controls retain their HTML semantics and get a clear selected state. */
.opiniones-page .reviews-year-nav, .opiniones-page .source-filter { display: flex; flex-wrap: wrap; gap: 9px; margin: 18px 0; }
.opiniones-page .reviews-year-nav a, .opiniones-page .source-filter button { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .55rem .85rem; border: 1px solid #e9c5d5; border-radius: 999px; background: #fff; color: var(--op-pink-dark); font: inherit; font-size: .88rem; font-weight: 800; text-decoration: none; cursor: pointer; transition: background-color .16s ease, border-color .16s ease, color .16s ease, transform .16s ease; }
.opiniones-page .reviews-year-nav a span { min-width: 1.35rem; padding: .1rem .35rem; border-radius: 999px; background: var(--op-pink-soft); color: var(--op-pink-dark); font-size: .75rem; text-align: center; }
.opiniones-page .reviews-year-nav a[aria-current="page"], .opiniones-page .source-filter button.is-active { border-color: var(--op-pink); background: var(--op-pink); color: #fff; box-shadow: 0 5px 14px rgba(170, 29, 87, .2); }
.opiniones-page .reviews-year-nav a[aria-current="page"] span { background: rgba(255,255,255,.22); color: #fff; }
.opiniones-page .reviews-year-nav a:hover, .opiniones-page .source-filter button:hover { border-color: var(--op-pink); background: var(--op-pink-soft); }
.opiniones-page .reviews-year-nav a[aria-current="page"]:hover, .opiniones-page .source-filter button.is-active:hover { background: var(--op-pink-dark); }
.opiniones-page .reviews-year-nav a:focus-visible, .opiniones-page .source-filter button:focus-visible { outline: 3px solid var(--op-pink-dark); outline-offset: 3px; }

/* Testimonial cards: high-contrast text, pink accent, and a calm reading rhythm. */
.opiniones-page .reviews-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 28px 0; }
.opiniones-page .review-card { position: relative; padding: 24px; overflow: hidden; border: 1px solid var(--op-line); border-radius: 15px; background: #fff; box-shadow: 0 8px 22px rgba(79, 25, 48, .06); }
.opiniones-page .review-card::before { content: "“"; position: absolute; top: 6px; right: 16px; color: rgba(201, 47, 114, .11); font-family: Georgia, serif; font-size: 5rem; line-height: 1; }
.opiniones-page .review-card:hover { border-color: #e5a7c2; box-shadow: 0 12px 30px rgba(126, 22, 70, .12); }
/* The inherited legacy stylesheet sets cards to display:flex, so explicitly honor hidden filtered cards. */
.opiniones-page .review-card[hidden] { display: none !important; }
.opiniones-page .review-stars { margin: 0 0 14px; color: var(--op-pink); font-size: .95rem; letter-spacing: .16em; }
.opiniones-page .review-card blockquote { position: relative; margin: 0; color: var(--op-ink); font-size: 1rem; font-weight: 550; line-height: 1.72; }
.opiniones-page .review-card blockquote p { margin: 0; }
.opiniones-page .review-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .38rem; margin-top: 20px; padding: 10px 12px; border-radius: 8px; background: var(--op-pink-dark); color: #fff; font-size: .8rem; font-weight: 650; line-height: 1.45; }
.opiniones-page .review-meta strong { color: #fff; font-size: .85rem; }
.opiniones-page .review-meta span, .opiniones-page .review-meta time { color: #fff; }
.opiniones-page .review-meta [aria-hidden="true"] { color: #ffd4e5; font-weight: 900; }
.opiniones-page .review-meta time { white-space: nowrap; }
.opiniones-page .archive-help { padding: 14px 16px; border-left: 4px solid var(--op-pink); border-radius: 0 9px 9px 0; background: var(--op-pink-soft); color: var(--op-muted); font-size: .92rem; line-height: 1.6; }
.opiniones-page .transparency { margin-top: 20px; color: var(--op-muted); font-size: .84rem !important; line-height: 1.6 !important; }
/* Keep filter feedback available to screen readers without adding a visible line under the controls. */
.opiniones-page .filter-status { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.opiniones-page .archive-pagination { display: flex; flex-wrap: wrap; gap: 9px; margin: 28px 0 0; padding-top: 22px; border-top: 1px solid var(--op-line); }
.opiniones-page .archive-pagination a { display: inline-flex; align-items: center; min-height: 42px; padding: .55rem .85rem; border: 1px solid #e9c5d5; border-radius: 999px; background: #fff; color: var(--op-pink-dark); font-size: .86rem; font-weight: 800; text-decoration: none; }
.opiniones-page .archive-pagination a:hover { border-color: var(--op-pink); background: var(--op-pink-soft); }
.opiniones-page .archive-pagination a:focus-visible { outline: 3px solid var(--op-pink-dark); outline-offset: 3px; }

@media (max-width: 800px) { .opiniones-page .review-summary { gap: 7px; padding: 8px; } .opiniones-page .review-summary > div { min-height: 100px; padding: 14px 11px; } .opiniones-page .reviews-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 500px) { .opiniones-page .review-card { padding: 20px; } .opiniones-page .reviews-grid { grid-template-columns: 1fr; } .opiniones-page .reviews-year-nav, .opiniones-page .source-filter { gap: 7px; } .opiniones-page .reviews-year-nav a, .opiniones-page .source-filter button { min-height: 39px; padding: .48rem .7rem; font-size: .82rem; } }
@media (prefers-reduced-motion: reduce) { .opiniones-page .reviews-year-nav a, .opiniones-page .source-filter button { transition: none; } }