*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Georgia,'Times New Roman',serif;line-height:1.8;color:#222;background:#f4f1eb}
.astro-R1cbArQB{max-width:1100px;margin:0 auto;padding:0 24px}
.astro-bNKsQFyg{background:linear-gradient(135deg,#2c3e50,#34495e);color:#fff;padding:48px 0;text-align:center;margin-bottom:48px}
.astro-bNKsQFyg h1{font-size:36px;letter-spacing:2px;text-transform:uppercase;margin-bottom:6px}
.astro-bNKsQFyg p{font-size:16px;opacity:.8;font-style:italic}
.astro-bNKsQFyg .astro-h2ad1Fb4{color:#fff;text-decoration:none;font-size:20px;letter-spacing:1px;text-transform:uppercase}
.astro-pdHfrdj6{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:28px}
.astro-Npk3p9ej{background:#fff;border-radius:4px;box-shadow:0 2px 12px rgba(0,0,0,.08);padding:28px;transition:box-shadow .2s}
.astro-Npk3p9ej:hover{box-shadow:0 4px 20px rgba(0,0,0,.14)}
.astro-Npk3p9ej h2{font-size:22px;margin-bottom:10px;line-height:1.3}
.astro-Npk3p9ej h2 a{color:#2c3e50;text-decoration:none}
.astro-Npk3p9ej .astro-pBZiRTvL{font-size:12px;color:#888;margin-bottom:10px;text-transform:uppercase;letter-spacing:1px}
.astro-Npk3p9ej p{font-size:15px;color:#555;margin-bottom:14px}
.astro-NrRFFq2V{color:#e74c3c;text-decoration:none;font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.5px}
.astro-vVf6SuOu{max-width:780px;margin:0 auto;padding:0 24px 60px}
.astro-vVf6SuOu h1{font-size:36px;margin-bottom:10px;line-height:1.2}
.astro-vVf6SuOu .astro-pBZiRTvL{font-size:13px;color:#888;display:block;margin-bottom:28px;text-transform:uppercase;letter-spacing:1px}
.astro-vVf6SuOu h2{font-size:24px;margin:36px 0 14px}
.astro-vVf6SuOu h3{font-size:19px;margin:28px 0 10px}
.astro-vVf6SuOu p{margin-bottom:18px;font-size:17px}
.astro-vVf6SuOu ul,.astro-vVf6SuOu ol{margin:0 0 18px 28px}
.astro-vVf6SuOu a{color:#e74c3c}
.astro-vVf6SuOu img{max-width:100%;height:auto;border-radius:4px;margin:20px 0}
.astro-YERQk74y{border-top:2px solid #ddd;padding:28px 0;margin-top:48px;text-align:center;font-size:13px;color:#888}
.astro-YERQk74y a{color:#888}
.astro-OlE9834R{border-top:1px solid #ccc;border-bottom:1px solid #ccc;padding:14px 0;margin-bottom:28px;font-size:14px;color:#888;font-style:italic;text-align:center}
.astro-z84P3TC1{background:#f9f3e3;padding:16px 20px;margin-top:28px;font-size:13px;color:#7a6230;border-radius:4px}
.astro-KAB8NnWZ{font-size:11px;color:#888;margin:-22px 0 28px;text-transform:uppercase;letter-spacing:1.5px}
.astro-xsAAAhqb{margin:0 0 28px}
.astro-1vEdBUt6{width:100%;height:auto;border-radius:4px}
.astro-nKHdsZCy{margin:28px 0}
.astro-eyJyxEtg{width:100%;height:auto;border-radius:4px}
.astro-LgB6y25m{border-top:2px solid #ddd;margin-top:40px;padding-top:24px}
.astro-LgB6y25m h4{font-size:16px;text-transform:uppercase;letter-spacing:1px;margin-bottom:16px;color:#888}
.mag-related-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mag-related-item a{color:#2c3e50;text-decoration:none;font-size:15px}
.mag-related-item a:hover{color:#e74c3c}
/* === Theme === */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Playfair+Display:wght@400;700&display=swap');
body{font-family:'Inter',sans-serif;color:#2c3333;background:#fafdf7}
.astro-bNKsQFyg{background:#2c3333;color:#fff}
.astro-bNKsQFyg h1{font-family:'Playfair Display',serif;color:#fff}
.astro-bNKsQFyg p{color:rgba(255,255,255,.75)}
.astro-bNKsQFyg a{color:#fff;text-decoration:none}
.card h2{font-family:'Playfair Display',serif}
.card h2 a{color:#2c3333}
.card h2 a:hover{color:#a6bb8d}
.read-more{color:#a6bb8d}
.article-content h1{font-family:'Playfair Display',serif}
.article-content h2{font-family:'Playfair Display',serif}
.article-content a{color:#a6bb8d}
.article-content img{border-radius:8px}
.affiliate-disclosure{border-radius:8px}
.ymyl-disclaimer{border-radius:8px}
/* === Custom === */
/*
  vs-usa-es — visa-inmigracion-usa-guia-es
  Persona: Andrés Carmona, coordinador de logística transfronteriza, Tijuana.
  Voice: metódico, curtido en papeleo aduanero, traduce el trámite migratorio
  a español llano sin dramatismo ni "truco garantizado".
  Palette: azul aduana #1E3A5C + rojo sello #B8452C sobre papel oficial frío.
  Fonts: PT Serif (encabezados, documento serio) + Public Sans (cuerpo, USWDS).
  Distinto de im-visa-es (marrón-jade cálido, diario personal, minimal).
*/

@import url('https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@0,400;0,700;1,400&family=Public+Sans:wght@400;500;600;700&display=swap');

/* === TOKENS === */

:root {
  --primary:      #1E3A5C;
  --primary-dark: #142A44;
  --accent:       #B8452C;
  --accent-light: #F0DCD3;
  --bg:           #F5F7FA;
  --bg-alt:       #E9EDF2;
  --surface:      #FFFFFF;
  --fg:           #1B2430;
  --muted:        #5B6472;
  --border:       #D7DCE3;
  --link:         #2A5788;
  --link-hover:   #B8452C;

  --fh: 'PT Serif', Georgia, serif;
  --fb: 'Public Sans', system-ui, sans-serif;

  --r:    4px;
  --r-lg: 8px;

  --prose-max: 68ch;
}

/* === BASE === */

:root body {
  font-family: var(--fb);
  font-size: 17px;
  line-height: 1.7;
  color: var(--fg);
  background: var(--bg);
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
}

:root ::selection {
  background: var(--primary);
  color: #fff;
}

/* === TYPOGRAPHY === */

:root h1,
:root h2,
:root h3,
:root h4,
:root h5,
:root h6 {
  font-family: var(--fh);
  font-weight: 700;
  line-height: 1.25;
  color: var(--primary);
  margin-top: 1.6em;
  margin-bottom: 0.5em;
}

:root h1 { font-size: 2.25rem; letter-spacing: -0.01em; }
:root h2 { font-size: 1.6rem; }
:root h3 { font-size: 1.25rem; }
:root h4 { font-size: 1.05rem; }
:root h5 { font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.06em; }
:root h6 { font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); }

:root p {
  max-width: var(--prose-max);
  margin: 0 0 1.2em;
}

:root a {
  color: var(--link);
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-underline-offset: 3px;
  transition: color 0.15s ease;
}

:root a:hover { color: var(--link-hover); }

:root strong, :root b { font-weight: 600; }
:root em, :root i     { font-style: italic; }

:root blockquote {
  margin: 1.75em 0;
  padding: 1em 1.4em;
  border-left: 3px solid var(--accent);
  background: var(--accent-light);
  border-radius: 0 var(--r) var(--r) 0;
  font-style: italic;
  color: var(--fg);
}

:root blockquote p { margin: 0; max-width: none; }

:root ul,
:root ol {
  padding-left: 1.4em;
  margin: 0 0 1.2em;
}

:root li {
  margin-bottom: 0.4em;
  line-height: 1.65;
  max-width: var(--prose-max);
}

:root ul li::marker { color: var(--accent); }
:root ol li::marker { color: var(--primary); font-weight: 700; }

:root hr {
  border: none;
  border-top: 1px solid var(--border);
  margin: 2.5em 0;
}

:root img {
  max-width: 100%;
  height: auto;
  border-radius: var(--r);
}

/* === HEADER === */

:root .astro-bNKsQFyg {
  background: var(--primary);
  color: #fff;
  padding: 2.75rem 1.5rem 2.25rem;
  text-align: center;
  border-bottom: 3px solid var(--accent);
}

:root .astro-bNKsQFyg h1 {
  font-family: var(--fh);
  font-size: 2.1rem;
  font-weight: 700;
  color: #fff;
  margin: 0 0 0.35rem;
  max-width: none;
}

:root .astro-bNKsQFyg p {
  color: rgba(255, 255, 255, 0.8);
  font-size: 1rem;
  margin: 0 auto;
  max-width: 680px;
}

:root .astro-bNKsQFyg a { color: #fff; text-decoration: none; }
:root .astro-bNKsQFyg a:hover { color: var(--accent-light); }

/* === NAV === */

:root nav {
  background: var(--primary-dark);
  padding: 0.6rem 1.5rem;
  display: flex;
  gap: 1.5rem;
  flex-wrap: wrap;
}

:root nav a {
  color: rgba(255, 255, 255, 0.82);
  text-decoration: none;
  font-size: 0.86rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  transition: color 0.15s ease;
}

:root nav a:hover { color: #fff; }

/* === CARDS (portada / listados) === */

:root .card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r);
  padding: 1.4rem;
  margin-bottom: 1.5rem;
  transition: box-shadow 0.18s ease, border-color 0.18s ease;
}

:root .card:hover {
  border-color: var(--primary);
  box-shadow: 0 3px 12px rgba(30, 58, 92, 0.12);
}

:root .card h2 {
  font-size: 1.2rem;
  margin-top: 0;
  margin-bottom: 0.45rem;
  max-width: none;
}

:root .card h2 a { color: var(--primary); text-decoration: none; }
:root .card h2 a:hover { color: var(--accent); }

:root .card p {
  color: var(--muted);
  font-size: 0.94rem;
  margin-bottom: 0.8rem;
  max-width: none;
}

:root .card time,
:root .card .date {
  font-size: 0.76rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

:root .read-more {
  color: var(--primary);
  font-size: 0.88rem;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 2px solid var(--accent);
  padding-bottom: 1px;
  transition: color 0.15s ease, border-color 0.15s ease;
}

:root .read-more:hover { color: var(--accent); border-color: var(--primary); }

/* === ARTICLE CONTENT === */

:root .article-content {
  max-width: 720px;
  margin: 0 auto;
  padding: 2.5rem 1.5rem;
  font-size: 17px;
  line-height: 1.75;
}

:root .article-content h1 {
  font-size: 2rem;
  color: var(--primary);
  border-bottom: 3px solid var(--accent);
  padding-bottom: 0.3em;
  max-width: none;
}

:root .article-content h2 {
  font-size: 1.5rem;
  color: var(--primary);
  border-left: 4px solid var(--accent);
  padding-left: 0.6em;
  margin-top: 2.5em;
  margin-bottom: 0.55em;
  max-width: none;
}

:root .article-content h3 {
  font-size: 1.15rem;
  color: var(--fg);
  margin-top: 1.8em;
  max-width: none;
}

:root .article-content p { max-width: var(--prose-max); }

:root .article-content a {
  color: var(--link);
  text-decoration-color: var(--accent);
}

:root .article-content a:hover { color: var(--link-hover); }

:root .article-content img { border-radius: var(--r); margin: 1.75em 0; }

:root .article-content blockquote {
  border-left-color: var(--accent);
  background: var(--accent-light);
}

:root .article-content table {
  border-collapse: collapse;
  width: 100%;
  margin: 1.5em 0;
  font-size: 0.92rem;
}

:root .article-content table th {
  background: var(--primary);
  color: #fff;
  padding: 0.55em 0.8em;
  text-align: left;
  font-family: var(--fh);
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.03em;
}

:root .article-content table td {
  padding: 0.5em 0.8em;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}

:root .article-content table tr:nth-child(even) { background: var(--bg-alt); }

/* === FOOTER === */

:root footer {
  background: var(--primary-dark);
  color: rgba(255, 255, 255, 0.72);
  padding: 2rem 1.5rem;
  text-align: center;
  font-size: 0.84rem;
  margin-top: 3rem;
}

:root footer a { color: rgba(255, 255, 255, 0.88); text-decoration: underline; }
:root footer a:hover { color: var(--accent-light); }

/* === RESPONSIVE === */

@media (max-width: 640px) {
  :root body { font-size: 16px; }

  :root .astro-bNKsQFyg { padding: 2rem 1rem 1.75rem; }
  :root .astro-bNKsQFyg h1 { font-size: 1.75rem; }
  :root .article-content { padding: 1.75rem 1rem; }

  :root h1 { font-size: 1.7rem; }
  :root h2 { font-size: 1.35rem; }
  :root h3 { font-size: 1.1rem; }
}

/* === R2 fixes (2026-07-11T05:10:30.743508+00:00) === */

/* Tabla comparativa: el HTML real usa <article> sin clase .article-content,
   así que las reglas de tabla se dirigen al selector de etiqueta. */
article table {
  border-collapse: collapse;
  width: 100%;
  margin: 1.5em 0;
  font-size: 0.92rem;
}

article table th {
  background: var(--primary);
  color: #fff;
  padding: 0.55em 0.8em;
  text-align: left;
  font-family: var(--fh);
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.03em;
}

article table td {
  padding: 0.5em 0.8em;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}

article table tr:nth-child(even) { background: var(--bg-alt); }

/* Aviso de afiliación: párrafo de varias líneas, alineado a la izquierda
   como el resto del artículo en vez de centrado. */
.astro-OlE9834R {
  text-align: left;
  max-width: var(--prose-max);
  margin-left: auto;
  margin-right: auto;
}

/* === R3 fixes (2026-07-11T05:50:34.731892+00:00) === */

/* El aviso de afiliación arranca en el mismo borde izquierdo que los
   párrafos vecinos, en vez de quedar centrado como tarjeta aparte. */
.astro-OlE9834R {
  text-align: left;
  max-width: var(--prose-max);
  margin-left: 0;
  margin-right: 0;
}