/* legalfq.com, Law Office of Fernando Quinones.
   Palette follows the FQLaw Obsidian theme (FileMaker web palette): lightcyan surfaces, gold accent,
   lightyellow highlight, two grays, near-black type. Gold and the light grays are decoration only;
   every text color passes WCAG AA (4.5:1) on its background. Body text 17px (USCIS asks 14px minimum).
   Restyled 2026-10-17 from the letterhead look (gray band, Baskerville, navy links). */
:root{
  --cyan:#e0ffff;        /* surfaces: header band, section pills */
  --yellow:#ffffe0;      /* highlight: hover, consultation card */
  --gold:#ffd700;        /* accent: borders, underlines, focus ring */
  --gold-dk:#c8a600;     /* accent on white where gold is too faint (borders only) */
  --gold-text:#6e5a00;   /* gold-family TEXT color, 6.7:1 on white */
  --gray-soft:#d3d3d3;   /* quiet borders */
  --gray-bg:#f6f7f8;     /* footer, tiles */
  --muted:#4a4a4a;       /* secondary text, 8.9:1 on white */
  --ink:#1a1a1a;         /* primary text */
  --bg:#ffffff
}
*{box-sizing:border-box}
html{font-size:17px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Avenir,"Avenir Next",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;line-height:1.6}

/* links: near-black with a dark-gold underline; hover lights up yellow, like the theme */
a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--gold-dk);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{background:var(--yellow);color:var(--gold-text);text-decoration-color:var(--gold-text)}
a:focus-visible{outline:2px solid var(--ink);outline-offset:2px;box-shadow:0 0 0 5px var(--gold);border-radius:2px}

.skip{position:absolute;left:-999px;top:0;background:var(--yellow);padding:.5rem 1rem;z-index:10}
.skip:focus{left:1rem}

/* header band: lightcyan with a gold rule */
.band{background:var(--cyan);border-bottom:3px solid var(--gold);text-align:center;padding:1.1rem 1rem}
.band .firm{font-weight:800;font-size:1.3rem;letter-spacing:.02em;color:var(--ink);text-decoration:none}
.band .firm:hover{background:none;text-decoration:underline;text-decoration-color:var(--gold-dk)}

/* nav: quiet by default, gold on the current page and on hover */
nav.top{border-bottom:1px solid var(--gray-soft);background:var(--bg)}
nav.top ul{list-style:none;margin:0 auto;padding:0 1rem;max-width:60rem;display:flex;flex-wrap:wrap;gap:.25rem 1.5rem}
nav.top li a{display:inline-block;padding:.7rem .2rem;font-size:.95rem;font-weight:600;text-decoration:none;color:var(--ink);border-bottom:3px solid transparent}
nav.top li a:hover{background:var(--yellow);color:var(--ink);border-bottom-color:var(--gold)}
nav.top li a[aria-current="page"]{border-bottom-color:var(--gold);font-weight:800}
nav.top li.lang{margin-left:auto}
nav.top li.lang a{text-decoration:underline;text-decoration-color:var(--gold-dk);text-decoration-thickness:2px}

main{max-width:42rem;margin:0 auto;padding:1.75rem 1rem 3rem}
h1{font-size:2rem;font-weight:800;line-height:1.2;margin:.5rem 0 1rem;color:var(--ink)}
/* H2: the theme's section pill, lightcyan with a gold left border, uppercase */
h2{display:inline-block;font-size:.92rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;line-height:1.35;color:var(--ink);background:var(--cyan);border-left:4px solid var(--gold);border-radius:4px;padding:.38rem .95rem;margin:2rem 0 .75rem}
h3{font-size:1.05rem;font-weight:800;color:var(--gold-text);margin:1.5rem 0 .4rem}
p,li{max-width:42rem}
p{margin:0 0 1rem}
ul{padding-left:1.3rem}
strong{font-weight:800}
.lede{font-size:1.15rem;color:var(--muted)}

/* consultation card: lightyellow highlight, gold edge */
.card{background:var(--yellow);border:1px solid var(--gray-soft);border-left:4px solid var(--gold);padding:1rem 1.25rem;margin:1.75rem 0;border-radius:4px}
.card p:last-child{margin-bottom:0}

/* practice-area tiles: white, hairline gray, gold top edge */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:1rem;margin:.25rem 0 1.5rem;padding:0;list-style:none}
.grid li{background:var(--bg);border:1px solid var(--gray-soft);border-top:3px solid var(--gold);padding:.9rem 1rem;border-radius:4px}
.grid li strong{display:block;margin-bottom:.2rem}

.updated{color:var(--muted);font-size:.95rem}
address{font-style:normal}

footer{background:var(--gray-bg);border-top:1px solid var(--gray-soft);margin-top:2rem;padding:1.5rem 1rem 2.5rem;color:var(--muted);font-size:.95rem}
footer .inner{max-width:60rem;margin:0 auto;display:flex;flex-wrap:wrap;gap:1rem 2.5rem;justify-content:space-between}
footer p{margin:0 0 .4rem}

@media (max-width:40rem){html{font-size:16px}h1{font-size:1.65rem}nav.top ul{gap:.25rem 1rem}}
@media print{nav.top,.skip{display:none}.band,h2,.card{background:none}}
/* practice-area icons (decorative, alt=""): drawn for the site 2026-10-17, palette colors only, no people */
.grid li .ico{display:block;width:48px;height:48px;margin:0 0 .5rem}