:root{--bg:#f8fafc;--text:#0f172a;--line:#e5e9f2;--card:#fff;--primary:#1e88e5;--radius:16px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px system-ui}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.btn{background:var(--primary);color:#fff;border:none;border-radius:12px;padding:10px 16px;font-weight:700}
.field input,.field select{padding:12px;border:1px solid var(--line);border-radius:10px;outline:none}


/* === Header unificado (Aduana Orán) === */
.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: linear-gradient(90deg, #1e88e5, #1565c0);
  color: #fff;
  padding: 14px 28px;
  font-weight: 600;
  border-radius: 0 0 16px 16px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}
.topbar .brand {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.5px;
}
/* === Header unificado profesional (Aduana Orán) === */
.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: linear-gradient(90deg, #1e88e5, #1565c0);
  color: #fff;
  padding: 14px 28px;
  font-weight: 600;
  border-radius: 0 0 16px 16px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}
.topbar .brand {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.5px;
}
.btn-home {
  background: transparent;
  color: #fff;
  border: 2px solid #fff;
  border-radius: 10px;
  padding: 6px 20px;
  text-decoration: none;
  font-weight: 700;
  transition: all .2s ease;
}
.btn-home:hover {
  background: #fff;
  color: #1565c0;
}
/* === Tipografía y layout unificados (Aduana Orán) === */
:root{
  --title-size: 34px;
  --subtitle-size: 20px;
  --title-weight: 800;
  --container-w: 1120px;
  --radius: 16px;
}

/* Contenedores */
.container, .wrap, .content {
  max-width: var(--container-w);
  margin: 0 auto;
  padding: 16px;
}

/* Títulos principales */
h1, .page-title {
  font-size: var(--title-size);
  line-height: 1.2;
  font-weight: var(--title-weight);
  margin: 0 0 16px;
  letter-spacing: 0.2px;
}

/* Subtítulos */
h2, .subtitle {
  font-size: var(--subtitle-size);
  line-height: 1.3;
  font-weight: 700;
  margin: 0 0 12px;
}

/* Tarjetas */
.card {
  border-radius: var(--radius);
}

/* Botones */
.btn, .btn-home {
  font-weight: 700;
  border-radius: 10px;
}

/* Campos */
.field input, .field select, .field textarea {
  border-radius: 10px;
}

/* Resultados/aside: asegurar look consistente */
.resultado, .result {
  border-radius: 12px;
}

/* === Espaciado main unificado === */
main.site { padding: 20px 0; }
header.topbar + main.site { padding-top: 28px; }


/* === GLOBAL FONT ENFORCE === */
html, body, * { font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Ubuntu, Cantarell, 'Noto Sans', Arial !important; }
h1, .page-title { font-size: 34px !important; font-weight: 800 !important; }
h2, .subtitle { font-size: 20px !important; font-weight: 700 !important; }

/* === OPTIONAL: hide legacy nav bars if present (safe common names) === */
.header, .site-header, .main-header, .navbar, .app-header { display: none !important; }


/* === FIX: Oculta figura azul decorativa en el portal principal === */
.hero::before,
.hero::after,
.portal-title::before,
.portal-title::after {
  display: none !important;
  content: none !important;
}
.hero > div:empty,
.portal-title > div:empty {
  display: none !important;
}