/*
   ____  _   _ ____    _    _   _   _
  |  _ \| | | | __ )  / \  | | | | | |
  | | | | | | |  _ \ / _ \ | | | | | |
  | |_| | |_| | |_) / ___ \| |_| |_| |
  |____/ \___/|____/_/   \_\_____\___/

  Dubalu — Plataforma Buen Gobierno · 2026
*/

/* Shared partials for all secondary pages */
.topbar { display: flex; align-items: center; justify-content: space-between; padding: 10px 0; color: var(--text-muted); font-size: 12.5px; }
.topbar a:hover { color: var(--ink-900); }

/* Breadcrumbs */
.crumbs { display:flex; align-items:center; gap: 10px; padding: 24px 0 12px; font-size: 12.5px; color: var(--text-muted); }
.crumbs a:hover { color: var(--ink-900); }
.crumbs .sep { opacity: .5; }

/* Page hero (compact) */
.page-hero { padding: 40px 0 56px; border-bottom: 1px solid var(--border); }
.page-hero h1 { margin: 14px 0 12px; }
.page-hero .lead { max-width: 60ch; }

/* Generic content frame */
.frame {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-xl); padding: 40px;
}

/* Choice cards */
.choices { display:grid; gap: 16px; }
.choice {
  display: flex; gap: 20px; align-items: flex-start; padding: 22px;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.choice:hover { border-color: var(--ink-900); transform: translateY(-2px); }
.choice h3 { margin: 0 0 4px; font-size: 1.05rem; font-family: var(--font-display); font-weight: 500; }
.choice p { margin: 0; font-size: 14px; color: var(--text-soft); }
.choice .arrow { margin-left:auto; align-self:center; opacity: .5; transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease); }
.choice:hover .arrow { opacity: 1; transform: translateX(4px); }