/* ============================================================
   COLÉGIO ALTERNATIVO — catalogo.css
   Estilos específicos desta página. Requer base.css.
   ============================================================ */

.nav-link:hover, .nav-link.active { color: var(--sky); background: var(--ice); }

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

.segment-group { margin-bottom: 3.5rem; }

.segment-label { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; }

.segment-label-line { flex: 1; height: 2px; background: var(--line); border-radius: 2px; }

.segment-label-text { font-size: 0.78rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; white-space: nowrap; padding: 0.4rem 1.2rem; border-radius: 50px; }

.segment-label-text.infantil { background: #fff3e0; color: #e65100; }

.segment-label-text.fund1 { background: #e8f5e9; color: #2e7d32; }

.segment-label-text.fund2 { background: #e3f2fd; color: #1565c0; }

.segment-label-text.medio { background: #fce4ec; color: #c62828; }

.catalog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1.2rem; }

.catalog-card { display: flex; align-items: center; justify-content: center; background: var(--white); border: 2px solid var(--line); border-radius: var(--radius); padding: 1.5rem 1rem; text-align: center; font-weight: 700; font-size: 0.97rem; color: var(--ink); transition: var(--transition); cursor: pointer; box-shadow: var(--shadow-sm); position: relative; overflow: hidden; gap: 10px; flex-direction: column; }

.catalog-card::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, var(--sky-hover), var(--sky)); opacity: 0; transition: var(--transition); }

.catalog-card:hover { border-color: var(--sky); transform: translateY(-4px); box-shadow: var(--shadow-md); }

.catalog-card:hover::before { opacity: 1; }

.catalog-card:hover .card-icon, .catalog-card:hover .card-title, .catalog-card:hover .card-sub { color: white; }

.card-icon { font-size: 1.8rem; position: relative; z-index: 1; transition: var(--transition); }

.card-title { position: relative; z-index: 1; font-size: 1.05rem; font-weight: 800; color: var(--ink); transition: var(--transition); }

.card-sub { position: relative; z-index: 1; font-size: 0.78rem; font-weight: 500; color: var(--ink-3); transition: var(--transition); }

.catalog-card:hover .card-arrow { opacity: 1; transform: translateX(0); }

.card-arrow { position: absolute; bottom: 0.8rem; right: 0.9rem; opacity: 0; transform: translateX(-6px); transition: var(--transition); z-index: 1; }

.card-arrow svg { width: 16px; height: 16px; stroke: white; fill: none; stroke-width: 2.5; }

@media (max-width: 768px) {
  .catalog-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
}

@media (max-width: 480px) {
  .catalog-grid { grid-template-columns: 1fr 1fr; }
}