, so an element-qualified selector skipped it and the flagship non-resident guide rendered with no container at all — text flush against the left edge, no side padding. Match the class, not the tag. */ .doc{max-width:var(--maxw);margin:0 auto;padding:20px 28px 90px;display:grid;grid-template-columns:1fr;gap:0} .doc .body{max-width:var(--readw)} .doc h2{font-family:var(--serif);font-weight:600;font-size:clamp(24px,3vw,32px);letter-spacing:-.01em;margin:48px 0 14px;line-height:1.15} .doc h3{font-family:var(--serif);font-weight:600;font-size:clamp(19px,2.3vw,23px);margin:32px 0 10px} .doc p{font-size:17px;color:#e7e1d3;margin:0 0 18px;max-width:var(--readw)} .doc ul,.doc ol{margin:0 0 20px 22px;max-width:var(--readw)} .doc li{font-size:17px;color:#e7e1d3;margin-bottom:9px;line-height:1.6} .doc strong{color:var(--ink)} .doc a.inl{color:var(--gold);border-bottom:1px solid rgba(216,178,90,.4);transition:.2s} .doc a.inl:hover{border-color:var(--gold)} .doc .lead{font-family:var(--serif);font-size:20px;color:var(--soft);line-height:1.55;margin-bottom:28px} /* ---- callout / disclosure / advice (shared with home) ---- */ /* .disclose is defined once, near the bottom of this file, next to .ad-label. It used to be declared here too, in 10.5px uppercase mono; the later rule only overrode family and size, so text-transform and letter-spacing leaked through and every disclosure still rendered in full caps. Keep it in one place. */ .note{border:1px solid var(--line);border-left:3px solid var(--red);background:rgba(227,92,79,.06); padding:18px 20px;margin:26px 0;max-width:var(--readw)} .note .nt{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--red);margin-bottom:8px} .note p{font-size:15px;color:var(--soft);margin:0} .advice{font-family:var(--sans);font-size:13px;color:var(--soft);font-style:italic;margin-top:26px; max-width:var(--readw);border-top:1px solid var(--line);padding-top:16px;line-height:1.6} .vflag{color:var(--gold);font-family:var(--mono);font-size:.82em;font-style:normal; background:rgba(216,178,90,.12);padding:1px 5px;border:1px dashed rgba(216,178,90,.5);white-space:nowrap} /* ---- offer button (shared) ---- */ .offer{display:inline-flex;align-items:center;gap:11px;font-family:var(--mono);font-size:12px;letter-spacing:.09em; text-transform:uppercase;font-weight:600;background:var(--cta);color:#fff;padding:14px 22px;margin:6px 8px 6px 0; border:1px solid var(--cta);transition:.22s} .offer:hover{background:var(--cta-hover);transform:translateY(-1px)} .offer.ghost{background:transparent;color:var(--ink);border-color:var(--line)} .offer.ghost:hover{border-color:var(--red)} .offer .via{font-weight:400;font-size:10px;color:rgba(255,255,255,.72);letter-spacing:.05em} .offer.ghost .via{color:var(--soft)} /* ---- card grids (indexes) ---- */ .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2px; background:var(--line);border:1px solid var(--line);margin:34px 0} .card{background:var(--bg);padding:26px 24px;transition:background .25s;display:flex;flex-direction:column;gap:10px} .card:hover{background:rgba(242,237,225,.04)} .card .k{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--red)} .card h3{font-family:var(--serif);font-weight:600;font-size:21px;line-height:1.2} .card p{font-size:14px;color:var(--soft);line-height:1.55} .card .more{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--soft);margin-top:auto} .card:hover .more{color:var(--red)} /* ---- state grid (compact) ---- */ .states-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin:32px 0} .states-grid a{background:var(--bg);padding:14px 16px;font-family:var(--sans);font-size:14px;color:var(--ink); display:flex;justify-content:space-between;align-items:center;transition:background .2s} .states-grid a:hover{background:rgba(227,92,79,.1)} .states-grid a .ab{font-family:var(--mono);font-size:10px;color:var(--soft)} /* ---- meta row (blog posts) ---- */ .pmeta{font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--soft);margin-top:20px;display:flex;gap:16px;flex-wrap:wrap} .pmeta .tag{color:var(--red)} /* ---- key-facts table ---- */ .facts{width:100%;border-collapse:collapse;margin:26px 0;max-width:var(--readw);font-family:var(--sans)} .facts th,.facts td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:top} .facts th{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--soft);width:42%} .facts td{color:var(--ink)} /* ---- FAQ (also feeds FAQ schema) ---- */ .faq{margin:32px 0;max-width:var(--readw)} .faq details{border-bottom:1px solid var(--line);padding:4px 0} .faq summary{font-family:var(--serif);font-weight:600;font-size:18px;padding:16px 0;cursor:pointer;list-style:none; display:flex;justify-content:space-between;gap:16px} .faq summary::-webkit-details-marker{display:none} .faq summary::after{content:"+";color:var(--red);font-family:var(--mono);font-weight:400} .faq details[open] summary::after{content:"–"} .faq details p{font-size:15px;color:var(--soft);padding:0 0 18px;line-height:1.6} /* ---- related / next ---- */ .related{border-top:1px solid var(--line);margin-top:60px;padding-top:34px;max-width:var(--maxw)} .related .k{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:18px} /* ---- footer (shared, with mandatory disclaimer) ---- */ footer.site{border-top:1px solid var(--line);margin-top:20px;background:rgba(0,0,0,.25)} .foot-in{max-width:var(--maxw);margin:0 auto;padding:44px 28px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px} .foot-in h4{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--soft);margin-bottom:14px} .foot-in a{display:block;font-size:14px;color:var(--ink);opacity:.82;margin-bottom:9px;transition:opacity .2s} .foot-in a:hover{opacity:1;color:var(--red)} .foot-brand{font-family:var(--display);font-weight:800;font-size:20px;margin-bottom:12px} .foot-brand .r{color:var(--red)} .foot-dis{font-size:12px;color:var(--soft);line-height:1.6;max-width:44ch} .foot-bar{border-top:1px solid var(--line);padding:18px 28px;max-width:var(--maxw);margin:0 auto; display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap; font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--soft)} @media(max-width:820px){ .foot-in{grid-template-columns:1fr 1fr} .mast nav{display:none} .mast .cta{margin-left:auto} } .pending{color:var(--soft,#6b6459);font-size:.94em;font-style:italic} a.pending{border-bottom:1px solid rgba(0,0,0,.18);text-decoration:none} a.pending:hover{color:var(--red,#a8231b)} /* --- Conformidade: avisos que precisam ser claros e visiveis --------------- */ /* Nao e site do governo. Estas paginas citam orgaos reais e linkam para .gov, entao o aviso fica acima da dobra, nao so no rodape. */ /* This sits as a direct child of , outside the .doc container, so margin:0 on the left put it flush against the viewport edge — ~30px left of the

and of every paragraph, growing with viewport width. On 73 pages the one notice that has to read as deliberate looked like a layout mistake. The margin-left below reproduces the container's own geometry: centre a --maxw column, then step in by its 28px padding, and never go under 28px on narrow screens. / .gov-note{max-width:var(--readw);margin:18px 28px 4px; margin-left:max(28px, calc((100% - var(--maxw)) / 2 + 28px));padding:12px 14px; border-left:3px solid var(--red,#a8231b);background:rgba(168,35,27,.05); font-family:var(--sans);font-size:13.5px;line-height:1.6;color:var(--ink,#15120b)} .gov-note strong{font-weight:600} / Conexao material divulgada ANTES do link comercial, na mesma caixa. / .ad-label{font-family:var(--sans);font-size:13px;line-height:1.5; color:var(--soft,#5c5446);margin:0 0 10px} / Divulgacao completa: legivel, nao miudinha. Sentence case de proposito — a frase inteira em caixa alta e mais dificil de ler, e isto e justamente o texto que a FTC espera que o visitante consiga ler sem esforco. / .disclose{font-family:var(--sans);font-size:13px;line-height:1.65; color:var(--soft,#5c5446);max-width:var(--readw);margin:22px 0; border:1px solid var(--line);border-left:2px solid var(--gold);padding:12px 15px} .disclose b{color:var(--gold)} / --- elements only the content generator emits ----------------------------- internal/apply-content.js renders a markdown subset, and three of its outputs had no rule anywhere in this file:
for "---", for backticks, and a list inside a .note (which is how a piece's Sources block is built). Unstyled, an renders as the browser's default inset 3D groove -- two grey lines on a near-black page -- and .note li inherited .doc li at 17px inside a 15px callout. Nothing else on the site uses these three, so nothing else moves. / .doc hr{border:0;border-top:1px solid var(--line);margin:38px 0;max-width:var(--readw)} .doc code{font-family:var(--mono);font-size:.88em;color:var(--gold); background:rgba(216,178,90,.09);padding:1px 5px;border-radius:2px} .note ul,.note ol{margin:0 0 0 20px} .note li{font-size:15px;color:var(--soft);margin-bottom:5px;line-height:1.6} / ---- mobile menu (details/summary, no JS) — added 26/08/2026 after the UX audit measured that below 820px the nav disappears with no replacement. Native gives keyboard and focus handling for free. ---- / .mnav{display:none;position:relative;margin-left:auto} .mnav summary{list-style:none;display:flex;align-items:center;gap:8px;cursor:pointer; font-family:var(--mono);font-size:11px;letter-spacing:.09em;text-transform:uppercase; color:var(--ink);border:1px solid var(--line);padding:9px 13px;user-select:none} .mnav summary::-webkit-details-marker{display:none} .mnav-ico{display:inline-flex;flex-direction:column;gap:3px;width:14px} .mnav-ico i{display:block;height:1.5px;background:currentColor} .mnav[open] summary{background:var(--ink);color:var(--bg)} .mnav-panel{position:absolute;right:0;top:calc(100% + 10px);z-index:60;min-width:230px; display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--line); box-shadow:0 14px 40px rgba(0,0,0,.18);padding:6px 0} .mnav-panel a{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase; color:var(--ink);padding:12px 20px;border-bottom:1px solid var(--line)} .mnav-panel a:last-child{border-bottom:none} .mnav-panel a[aria-current="page"]{color:var(--red,#8d3b2f);font-weight:600} @media(max-width:820px){.mast .mnav{display:block}.mast .cta{display:none} / .mast nav{display:none} acima vence .mnav-panel por especificidade; reabre o painel / .mast nav.mnav-panel{display:flex;gap:0;margin-left:0}} / nearby-states strip inside Keep reading — internal-link mesh (audit 26/08/2026) */ .related .nearby{margin:26px 0 0;padding-top:18px;border-top:1px solid var(--line); font-size:13.5px;color:var(--soft);line-height:2} .related .nearby .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em; text-transform:uppercase;margin-right:10px} .related .nearby a{color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line)} .related .nearby a:hover{text-decoration-color:var(--red)}