/* self-hosted-fonts-marker */
/* Self-hosted fonts (Playfair Display + Hanken Grotesk, latin + latin-ext, variable). No third-party request. */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: italic;
  font-weight: 400 800;
  font-display: swap;
  src: url(/fonts/hankengrotesk-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: italic;
  font-weight: 400 800;
  font-display: swap;
  src: url(/fonts/hankengrotesk-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/fonts/hankengrotesk-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/fonts/hankengrotesk-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400 900;
  font-display: swap;
  src: url(/fonts/playfairdisplay-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 400 900;
  font-display: swap;
  src: url(/fonts/playfairdisplay-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url(/fonts/playfairdisplay-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url(/fonts/playfairdisplay-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* =========================================================
   Brazil USA Translations — revamp prototype
   Design system: trust navy + warm gold + accept green on warm cream
   Type: Playfair Display (display) + Hanken Grotesk (body/UI)
   ========================================================= */

:root{
  /* color */
  --c-navy:#0E3A5C;
  --c-navy-deep:#0A2A43;
  --c-navy-700:#1B5183;
  --c-gold:#E8A13C;
  --c-gold-dark:#CC861F;
  --c-green:#1B8A5A;
  --c-green-soft:#E8F4ED;
  --c-cream:#FBF7F0;
  --c-cream-2:#F4ECDD;
  --c-white:#FFFFFF;
  --c-text:#1E2D38;
  --c-muted:#5C6B78;
  --c-border:#E7DDCB;
  --c-border-cool:#E3E9EE;
  --c-star:#E8A13C;
  /* Correction red, used on the false-friends table. Both clear AA on --c-paper:
     --c-red 6.4:1, --c-red-deep 8.8:1. */
  --c-red:#B3261E;
  --c-red-deep:#8F1D17;
  /* Warning amber for the "not always" mark. --c-gold-dark is only 2.96:1 on
     --c-paper, which fails AA for a text glyph; this is 5.1:1. */
  --c-amber-deep:#96620F;

  /* lifted from inline values (Hallmark token pass) */
  --c-paper:#FFFDFA;
  --c-paper-warm:#fffaf2;
  --c-prose:#3D5347;
  --c-green-deep:#14532D;
  --c-green-ink:#0E3B20;
  --c-green-mid:#1C6B3C;
  --c-green-night:#0B2E19;
  --c-gold-soft:#F6C878;
  --c-gold-lift:#F2B45A;
  --c-gold-shade:#DE9327;
  --c-gold-mark:#DDB055;
  --c-navy-ink:#08233A;
  --c-sky-tint:#cfe0ee;
  --c-foot-dim:#7f9bb2;
  --c-foot-text:#aec4d6;

  /* type */
  --font-display:'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body:'Hanken Grotesk', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;

  /* shape */
  --r-sm:8px; --r-md:12px; --r-lg:18px; --r-xl:24px;
  --shadow-sm:0 1px 2px rgba(14,58,92,.06), 0 2px 8px rgba(14,58,92,.05);
  --shadow-md:0 6px 24px rgba(14,58,92,.10);
  --shadow-lg:0 18px 50px rgba(14,58,92,.16);
  --shadow-xl:0 30px 80px -20px rgba(14,58,92,.35), 0 2px 6px rgba(14,58,92,.08);
  --ring:0 0 0 3px rgba(232,161,60,.9), 0 0 0 5px rgba(10,42,67,.7);

  /* motion + texture */
  --ease:cubic-bezier(.22,1,.36,1);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");

  --container:1180px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--c-text);
  background:var(--c-cream);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:var(--c-navy);text-decoration:none}
h1,h2,h3{font-family:var(--font-display);font-optical-sizing:auto;line-height:1.12;color:var(--c-navy-deep);margin:0;text-wrap:balance}
p{margin:0 0 1rem;text-wrap:pretty}
::selection{background:rgba(232,161,60,.35);color:var(--c-navy-deep)}
:focus-visible{outline:3px solid var(--c-navy-deep);outline-offset:2px}
/* On the dark footer and final-CTA the navy ring vanishes; switch it to gold there. */
.finalcta :focus-visible,.site-footer :focus-visible{outline-color:var(--c-gold)}
.skip-link{position:absolute;left:1rem;top:-80px;z-index:200;background:var(--c-navy-deep);color:#fff;font-weight:700;padding:.7rem 1.1rem;border-radius:0 0 10px 10px;transition:top .2s var(--ease)}
.skip-link:focus{top:0}
.container{max-width:var(--container);margin:0 auto;padding:0 24px;width:100%}
.ic{width:1em;height:1em;fill:currentColor;flex:none}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55em;
  font-family:var(--font-body);font-weight:700;font-size:1rem;
  padding:.8rem 1.4rem;border-radius:var(--r-md);border:2px solid transparent;
  cursor:pointer;transition:transform .16s var(--ease), box-shadow .22s var(--ease), background .22s var(--ease), color .22s var(--ease), border-color .22s var(--ease);
  line-height:1;white-space:nowrap;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn--gold{background:linear-gradient(180deg,var(--c-gold-lift) 0%,var(--c-gold) 55%,var(--c-gold-shade) 100%);color:var(--c-navy-deep);
  box-shadow:0 10px 24px -8px rgba(204,134,31,.55), inset 0 1px 0 rgba(255,255,255,.45), inset 0 -1px 0 rgba(0,0,0,.08)}
.btn--gold:hover{background:linear-gradient(180deg,#F6BC66 0%,#EAA744 55%,#D18A1F 100%);
  box-shadow:0 16px 32px -10px rgba(204,134,31,.6), inset 0 1px 0 rgba(255,255,255,.5), inset 0 -1px 0 rgba(0,0,0,.08)}
.btn--gold-line{background:var(--c-white);color:var(--c-gold-dark);border-color:var(--c-gold)}
.btn--gold-line:hover{background:linear-gradient(180deg,var(--c-gold-lift) 0%,var(--c-gold) 55%,var(--c-gold-shade) 100%);color:var(--c-navy-deep);
  box-shadow:0 10px 24px -8px rgba(204,134,31,.5)}
/* WhatsApp-green CTA: the "Send my documents on WhatsApp" button, matched to the
   green of the guided chat popup it opens. Dark ink on bright green passes AA. */
.btn--wa{background:linear-gradient(180deg,#2ee06f 0%,#25d366 55%,#1eb958 100%);color:#04231a;
  box-shadow:0 10px 24px -8px rgba(18,140,80,.55), inset 0 1px 0 rgba(255,255,255,.4), inset 0 -1px 0 rgba(0,0,0,.1)}
.btn--wa:hover{background:linear-gradient(180deg,#33e675 0%,#20c25f 55%,#149748 100%);
  box-shadow:0 16px 32px -10px rgba(18,140,80,.6), inset 0 1px 0 rgba(255,255,255,.45), inset 0 -1px 0 rgba(0,0,0,.1)}
.btn--navy{background:linear-gradient(180deg,var(--c-green-mid) 0%,var(--c-navy) 60%,var(--c-navy-deep) 100%);color:#fff;
  box-shadow:0 10px 24px -8px rgba(11,46,25,.5), inset 0 1px 0 rgba(255,255,255,.14)}
.btn--navy:hover{background:linear-gradient(180deg,#238049 0%,#175C33 60%,var(--c-navy-deep) 100%)}
.btn--ghost{background:var(--c-paper);color:var(--c-navy);border-color:var(--c-border-cool)}
.btn--ghost:hover{border-color:var(--c-navy);background:var(--c-paper);box-shadow:var(--shadow-sm)}
.btn--ghost-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.btn--ghost-light:hover{background:rgba(255,255,255,.12);border-color:#fff}
.btn--block{width:100%}
.btn--lg{padding:1rem 1.6rem;font-size:1.05rem}

/* ---------- shared section bits ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:.5em;font-weight:800;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--c-navy-700);margin-bottom:.9rem;
  background:rgba(27,81,131,.08);border:1px solid rgba(27,81,131,.16);border-radius:999px;padding:.38rem .8rem;
}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.75}
.eyebrow--gold{color:var(--c-gold-dark);background:rgba(232,161,60,.12);border-color:rgba(232,161,60,.3)}
.section-title{font-size:clamp(1.8rem,3.4vw,2.7rem);font-weight:600;letter-spacing:-.015em;margin-bottom:.9rem}
.section-head{max-width:720px;margin:0 auto 2.6rem;text-align:center}
.section-lede{color:var(--c-muted);font-size:1.1rem;margin-top:.9rem}
.link-arrow{display:inline-flex;align-items:center;gap:.4em;font-weight:700;color:var(--c-navy);margin-top:.4rem}
.link-arrow .ic{transition:transform .15s ease}
.link-arrow:hover .ic{transform:translateX(3px)}
section{padding:clamp(3rem,6vw,5.5rem) 0}

.stars{display:inline-flex;gap:2px;color:var(--c-star)}
.stars svg{width:20px;height:20px;fill:currentColor}
.stars--sm svg{width:16px;height:16px}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(251,247,240,.86);
  -webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);
  border-bottom:1px solid var(--c-border);box-shadow:0 4px 18px rgba(14,59,32,.05);
  transition:box-shadow .25s var(--ease),background .25s var(--ease)}
.site-header.is-scrolled{background:rgba(251,247,240,.96);box-shadow:0 10px 34px rgba(14,59,32,.12)}
/* The header bar is allowed ~20px more width than the 1180 body container so the wider
   Portuguese nav (Servicos / Como funciona / Ferramentas (EN) / ...) clears the wordmark
   with room to spare. 10px a side is below the threshold of looking misaligned. */
.site-header__inner{display:flex;align-items:center;gap:1rem;min-height:66px;max-width:1200px}
.brand{display:inline-flex;align-items:center;gap:.6rem;min-width:0}
.brand__mark{display:block;width:30px;height:30px;flex:none}
.brand__mark svg{width:100%;height:100%;display:block}
.brand__name{font-family:var(--font-display);font-weight:700;font-size:1.12rem;color:var(--c-navy-deep);
  line-height:1;letter-spacing:.005em;white-space:nowrap}
.brand__name em{font-style:normal;color:#8F6714}
.mainnav{display:flex;gap:1.5rem;margin-left:auto}
.mainnav a{font-weight:600;color:var(--c-text);font-size:.98rem;padding:.3rem 0;position:relative}
/* institutional nav: small tracked caps on the top level only; dropdown items stay sentence case */
.mainnav a.navitem__top{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;font-weight:600;white-space:nowrap}
.mainnav a::after{content:"";position:absolute;left:0;bottom:-2px;height:2px;width:0;background:var(--c-gold);transition:width .18s ease}
.mainnav a:hover::after{width:100%}
.site-header__cta{flex:none;display:flex;align-items:center;gap:.6rem}
.langsw{font-weight:700;font-size:.74rem;letter-spacing:.08em;color:var(--c-navy-700);
  border:1px solid var(--c-border);border-radius:7px;padding:.4rem .55rem;line-height:1;transition:.15s}
.langsw:hover{border-color:var(--c-gold);color:var(--c-gold-dark)}
.navtoggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;margin-left:auto}
.navtoggle span{width:24px;height:2px;background:var(--c-navy-deep);border-radius:2px;transition:transform .22s var(--ease),opacity .18s ease}
.navtoggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.navtoggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.navtoggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobilenav{display:none;flex-direction:column;gap:.2rem;padding:0 24px 1rem}
.mobilenav a{padding:.7rem .2rem;border-bottom:1px solid var(--c-border);font-weight:600}
.mobilenav .btn{margin-top:.7rem}

/* ---------- header social icons: desktop bar (hides with .site-header__cta) + mobile menu row */
.head__social{display:flex;align-items:center;gap:.1rem}
.head__social a{display:inline-flex;align-items:center;justify-content:center;width:29px;height:29px;border-radius:50%;color:var(--c-navy-700);transition:.15s}
.head__social a:hover{background:rgba(14,58,92,.08)}
.head__social .ic{width:16px;height:16px}
/* brand colors so the header + mobile-menu icons read at a glance (footer stays theme-muted) */
.head__social .social--facebook{color:#1877F2}
.head__social .social--instagram{color:#E4405F}
.head__social .social--youtube{color:#F00}
/* mobile menu: same brand chips as the footer (white glyph on platform color) */
.mnav__social{display:flex;justify-content:center;gap:.8rem;padding:.9rem 0 .2rem}
.mnav__social a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border-radius:50%;color:#fff}
.mnav__social .social--facebook{background:#1877F2}
.mnav__social .social--instagram{background:radial-gradient(circle at 30% 110%,#FDF497 0%,#FD5949 45%,#D6249F 60%,#285AEB 90%)}
.mnav__social .social--youtube{background:#F00}
.mnav__social .ic{width:22px;height:22px}
.mobilenav.is-open{display:flex;max-height:calc(100dvh - 60px);overflow-y:auto;overscroll-behavior:contain}

/* services dropdown + multi-page nav */
.mainnav{gap:.8rem}
.navitem{position:relative;display:flex;align-items:center}
.navitem--has-menu > a{display:inline-flex;align-items:center;gap:.25em}
/* Hover bridge: a full-menu-width strip across the gap between the trigger and the
   open menu, so a diagonal move toward the menu's outer edges keeps :hover alive and
   it does not snap shut. It hangs off the menu, so it is always exactly the menu's
   width (EN or the wider PT) and is only active while the menu is open, which means
   it never over-triggers the menu from stray hovering elsewhere in the header. */
.navmenu::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.mainnav a.is-active::after{width:100%}
.navchev{width:15px;height:15px;fill:currentColor;color:var(--c-navy-700);transition:transform .18s ease}
.navitem--has-menu:hover .navchev,.navitem--has-menu:focus-within .navchev{transform:rotate(180deg)}

/* nav color rhythm: the brand's gold / green alternation, with Free tools as the standout
   gold pill. amber-deep + green-mid are the AA-passing shades for small text on the cream
   header; raw --c-gold / --c-green fail there (see the palette notes). Every top item is
   white-space:nowrap (set on .navitem__top above) so a label like "How it works" never
   breaks onto two lines, and the tightened .mainnav gap keeps the whole row on one line
   next to the social icons and the CTA. The Free tools pill is sized to sit level with the
   text items (line-height:1 + trimmed padding) instead of bulging taller than the row. */
.navitem--services>.navitem__top,.navitem--faq>.navitem__top{color:var(--c-amber-deep)}
.navitem--how>.navitem__top,.navitem--contact>.navitem__top{color:var(--c-green-mid)}
.navitem--services .navchev,.navitem--tools .navchev{color:inherit}
.navitem--tools>.navitem__top{background:var(--c-gold);color:var(--c-navy-deep);font-weight:700;
  border-radius:999px;padding:.32rem .62rem;line-height:1}
.navitem--tools>.navitem__top::after{display:none}
.navitem--tools>.navitem__top:hover{background:var(--c-gold-lift)}
/* same rhythm in the mobile menu */
.mobilenav .mnav--services,.mobilenav .mnav--faq{color:var(--c-amber-deep)}
.mobilenav .mnav--how,.mobilenav .mnav--contact{color:var(--c-green-mid)}
.mobilenav .mnav--tools{background:var(--c-gold);color:var(--c-navy-deep);font-weight:700;
  border-radius:10px;padding:.7rem .8rem;border-bottom:0;margin:.2rem 0}
.navmenu{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(10px);min-width:330px;
  background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);
  padding:.5rem;display:flex;flex-direction:column;gap:.05rem;
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .16s ease,transform .16s ease;z-index:60}
.navitem--has-menu:hover .navmenu,.navitem--has-menu:focus-within .navmenu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(8px)}
.navmenu a{display:block;padding:.6rem .8rem;border-radius:var(--r-sm);font-weight:600;font-size:.94rem;color:var(--c-navy-deep);white-space:nowrap}
.navmenu a::after{display:none}
.navmenu a:hover{background:var(--c-cream-2)}
.navmenu a.navmenu__all{margin-top:.3rem;border-top:1px solid var(--c-border);color:var(--c-gold-dark);display:flex;align-items:center;gap:.3em}
.navmenu__all svg,.navmenu__all .ic{width:16px;height:16px}
.mobilenav__label{padding:.8rem .2rem .3rem;font-weight:800;font-size:.74rem;text-transform:uppercase;letter-spacing:.09em;color:var(--c-navy-700)}
.mobilenav a.mobilenav__sub{padding:.55rem .2rem .55rem 1rem;font-weight:500;color:var(--c-muted);font-size:.95rem}
.mobilenav a.mobilenav__sub:hover{color:var(--c-navy)}

/* related services block */
.related{padding:3.2rem 0;background:var(--c-cream-2)}
.related__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem;margin-top:1.2rem}
.related__link{display:flex;align-items:center;justify-content:space-between;gap:.6em;background:var(--c-paper);
  border:1px solid var(--c-border);border-radius:var(--r-md);padding:.85rem 1.1rem;font-weight:600;color:var(--c-navy-deep);
  transition:border-color .18s var(--ease),box-shadow .18s var(--ease),transform .18s var(--ease)}
.related__link:hover{border-color:var(--c-gold);box-shadow:var(--shadow-sm);transform:translateY(-2px)}
.related__link .ic{color:var(--c-gold-dark);transition:transform .18s var(--ease)}
.related__link:hover .ic{transform:translateX(3px)}
.related__more{margin-top:1.3rem;color:var(--c-muted);font-size:.95rem}
.related__more a{font-weight:600}

.jumplinks{margin:1.9rem 0 .4rem;text-align:center}
.jumplinks__label{display:block;font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;font-weight:700;color:var(--c-muted);margin-bottom:.85rem}
.jumplinks__row{display:flex;flex-wrap:wrap;justify-content:center;gap:.55rem;max-width:780px;margin:0 auto}
.jumplinks__pill{display:inline-flex;align-items:center;gap:.4em;background:var(--c-paper);border:1px solid var(--c-border);border-radius:999px;padding:.48rem .95rem;font-weight:600;font-size:.92rem;line-height:1.2;color:var(--c-navy);text-decoration:none;transition:transform .18s var(--ease),border-color .18s var(--ease),box-shadow .18s var(--ease)}
.jumplinks__pill:hover{border-color:var(--c-gold);box-shadow:var(--shadow-sm);transform:translateY(-2px)}
.jumplinks__pill:focus-visible{outline:2px solid var(--c-gold-dark);outline-offset:2px}
.jumplinks__pill .ic{width:.9em;height:.9em;flex:none;color:var(--c-gold-dark)}

/* HTML sitemap */
.sitemap__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem 2.5rem;margin-bottom:2rem}
.sitemap__col h2{font-size:1.15rem;margin-bottom:.7rem;color:var(--c-navy-deep)}
.sitemap__list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.5rem}
.sitemap__list a{font-weight:600;color:var(--c-navy)}
.sitemap__list a:hover{color:var(--c-gold-dark)}
.sitemap__xml{padding-top:1.3rem;border-top:1px solid var(--c-border);color:var(--c-muted);font-size:.97rem}
.sitemap__xml a{font-weight:700}

/* comparison table (sworn vs certified) */
.cmp-wrap{overflow-x:auto;margin:1.5rem 0}
.cmp{width:100%;border-collapse:collapse;background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-md);overflow:hidden}
.cmp th,.cmp td{padding:.8rem 1rem;text-align:left;border-bottom:1px solid var(--c-border);vertical-align:top;font-size:.97rem}
.cmp thead th{background:var(--c-cream-2);font-family:var(--font-display);font-weight:600;color:var(--c-navy-deep)}
.cmp tbody td:first-child{font-weight:700;color:var(--c-navy-deep)}
.cmp tr:last-child td{border-bottom:0}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;padding:clamp(6rem,7.5vw,8.5rem) 0 clamp(3rem,5vw,4.5rem)}
.hero__bg{position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(1200px 520px at 78% -12%, rgba(232,161,60,.22), transparent 60%),
    radial-gradient(700px 420px at 108% 55%, rgba(27,81,131,.08), transparent 60%),
    radial-gradient(900px 620px at -6% 112%, rgba(27,138,90,.14), transparent 55%),
    linear-gradient(180deg, #fff 0%, var(--c-cream) 100%);
}
.hero__bg::after{content:"";position:absolute;inset:0;opacity:.45;
  background-image:var(--grain),radial-gradient(rgba(14,58,92,.05) 1px, transparent 1px);
  background-size:120px 120px,22px 22px;mix-blend-mode:multiply}
.hero__inner{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,4rem);align-items:start}
.hero__copy{max-width:560px}
.hero__doc{display:inline-flex;margin-bottom:.85rem;filter:drop-shadow(0 3px 6px rgba(14,59,32,.15))}
.hero__doc svg{width:56px;height:70px}
.hero__title{font-size:clamp(2.3rem,4.8vw,3.8rem);font-weight:600;letter-spacing:-.02em}
/* USCIS: bold, in the brand accent, no underline. Clean emphasis on the key word. */
.hero__title .hl{color:var(--c-gold-dark);font-weight:700;white-space:nowrap}
.hero__title .hl::after{content:none}
.hero__sub{font-size:1.18rem;color:var(--c-prose);margin-top:1.1rem;max-width:540px}
.hero__pills{list-style:none;display:flex;flex-wrap:wrap;gap:.6rem;padding:0;margin:1.4rem 0 0}
.hero__pills li{display:inline-flex;align-items:center;gap:.5em;background:var(--c-paper);border:1px solid var(--c-border);
  border-radius:999px;padding:.5rem .9rem;font-weight:600;font-size:.92rem;box-shadow:var(--shadow-sm);
  transition:transform .18s var(--ease),box-shadow .18s var(--ease),border-color .18s var(--ease)}
.hero__pills li:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:rgba(232,161,60,.5)}
.hero__pills .ic{color:var(--c-green)}
.hero__proof{display:flex;align-items:center;gap:.7rem;margin-top:1.5rem;flex-wrap:wrap}
.hero__proof-text{font-size:.92rem;color:var(--c-muted)}

/* ---------- calculator ---------- */
.calc{background:var(--c-paper);border:1px solid rgba(231,221,203,.9);border-radius:var(--r-xl);box-shadow:var(--shadow-xl);overflow:hidden;align-self:start}
.calc::before{content:"";display:block;height:4px;background:linear-gradient(90deg,var(--c-gold) 0%,var(--c-gold-soft) 45%,var(--c-green) 100%)}
.calc__head{padding:1.5rem 1.6rem 1.1rem;background:linear-gradient(180deg,#FFFDF8,#fff);border-bottom:1px solid var(--c-border)}
.calc__title{font-family:var(--font-display);font-size:1.45rem;font-weight:600;line-height:1.2;margin:0;color:var(--c-navy-deep)}
.calc__sub{font-size:.92rem;color:var(--c-muted);margin:.35rem 0 0}
.calc__body{padding:1.4rem 1.6rem .4rem}
.field{margin-bottom:1.2rem}
.field__label{display:block;font-weight:700;font-size:.95rem;margin-bottom:.5rem;color:var(--c-navy-deep)}
.field__opt{font-weight:500;color:var(--c-muted);font-size:.82rem;text-transform:none}
.field__help{font-size:.82rem;color:var(--c-muted);margin:.5rem 0 0}
/* Large-order notice. It only appears at 100+ pages, where the visitor needs to
   see that the figure is a rack rate we still confirm, so it reads louder than
   ordinary help text. */
.field__help--bulk{color:var(--c-navy-deep);font-weight:600;background:var(--c-cream);
  border-left:3px solid var(--c-gold);border-radius:0 var(--r-sm) var(--r-sm) 0;padding:.55rem .7rem}

.select-wrap{position:relative}
.select{width:100%;appearance:none;font-family:inherit;font-size:1rem;font-weight:600;color:var(--c-text);
  background:var(--c-cream);border:1.5px solid var(--c-border);border-radius:var(--r-md);
  padding:.85rem 2.6rem .85rem 1rem;cursor:pointer}
.select:focus{outline:none;border-color:var(--c-gold);box-shadow:var(--ring)}
.select-wrap__chev{position:absolute;right:1rem;top:50%;transform:translateY(-50%);color:var(--c-navy);pointer-events:none;width:20px;height:20px}

.stepper{display:flex;align-items:center;gap:.5rem;max-width:200px}
.stepper__btn{width:46px;height:46px;border-radius:var(--r-md);border:1.5px solid var(--c-border);background:var(--c-cream);
  color:var(--c-navy);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.2rem;transition:.15s}
.stepper__btn:hover{border-color:var(--c-navy);background:var(--c-paper)}
.stepper__btn .ic{width:20px;height:20px}
.stepper__input{width:72px;height:46px;text-align:center;font-family:inherit;font-size:1.15rem;font-weight:700;
  color:var(--c-navy-deep);border:1.5px solid var(--c-border);border-radius:var(--r-md);background:var(--c-paper);-moz-appearance:textfield}
.stepper__input::-webkit-outer-spin-button,.stepper__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.stepper__input:focus{outline:none;border-color:var(--c-gold);box-shadow:var(--ring)}

.dropzone{display:flex;align-items:center;gap:.7rem;border:1.5px dashed var(--c-border);border-radius:var(--r-md);
  padding:.9rem 1rem;background:var(--c-cream);cursor:pointer;transition:.15s;color:var(--c-muted);font-size:.92rem}
.dropzone:hover,.dropzone.is-drag{border-color:var(--c-gold);background:var(--c-paper-warm);color:var(--c-text)}
.dropzone.has-file{border-style:solid;border-color:var(--c-green);background:var(--c-green-soft);color:var(--c-green)}
.dropzone__ic{width:24px;height:24px;color:var(--c-navy)}
.dropzone.has-file .dropzone__ic{color:var(--c-green)}
.dropzone__browse{color:var(--c-navy);font-weight:700;text-decoration:underline}
.dropzone__input{display:none}

.optcards{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.optcard{cursor:pointer}
.optcard input{position:absolute;opacity:0;pointer-events:none}
.optcard__box{display:flex;align-items:center;justify-content:space-between;gap:.5rem;border:1.5px solid var(--c-border);
  border-radius:var(--r-md);padding:.75rem .9rem;background:var(--c-cream);transition:.15s;height:100%}
.optcard__main{display:flex;flex-direction:column}
.optcard__name{font-weight:700;font-size:.95rem;color:var(--c-navy-deep)}
.optcard__meta{font-size:.78rem;color:var(--c-muted)}
.optcard__price{font-weight:700;color:var(--c-green);font-size:.95rem;white-space:nowrap}
.optcard__per{font-weight:500;color:var(--c-muted);font-size:.72rem}
.optcard input:checked + .optcard__box{border-color:var(--c-gold);background:var(--c-paper-warm);box-shadow:0 0 0 1px var(--c-gold)}
.optcard input:focus-visible + .optcard__box{box-shadow:var(--ring)}

.addons{display:grid;gap:.55rem}
.addon{cursor:pointer}
.addon input{position:absolute;opacity:0;pointer-events:none}
.addon__box{display:flex;align-items:center;gap:.7rem;border:1.5px solid var(--c-border);border-radius:var(--r-md);
  padding:.7rem .9rem;background:var(--c-cream);transition:.15s}
.addon__tick{width:22px;height:22px;border-radius:6px;border:1.5px solid var(--c-border);background:var(--c-paper);flex:none;
  display:flex;align-items:center;justify-content:center;color:transparent;transition:.15s}
.addon__tick .ic{width:16px;height:16px}
.addon__label{font-weight:600;font-size:.95rem}
.addon__price{margin-left:auto;font-weight:700;color:var(--c-navy);white-space:nowrap}
.addon__per{font-weight:500;color:var(--c-muted);font-size:.72rem}
.addon input:checked + .addon__box{border-color:var(--c-green);background:var(--c-green-soft)}
.addon input:checked + .addon__box .addon__tick{background:var(--c-green);border-color:var(--c-green);color:#fff}
.addon input:focus-visible + .addon__box{box-shadow:var(--ring)}

.calc__summary{padding:1.2rem 1.6rem 1.6rem;background:var(--c-cream);border-top:1px solid var(--c-border)}
.summary__lines{list-style:none;margin:0 0 .6rem;padding:0;font-size:.92rem}
.summary__lines li{display:flex;justify-content:space-between;padding:.22rem 0;color:var(--c-muted)}
.summary__lines li span:last-child{font-weight:600;color:var(--c-text)}
.summary__total{display:flex;align-items:baseline;justify-content:space-between;border-top:1.5px solid var(--c-border);
  padding-top:.7rem;margin-bottom:.5rem}
.summary__total>span:first-child{font-weight:700;font-size:1rem;color:var(--c-navy-deep)}
.summary__amount{font-family:var(--font-display);font-weight:700;font-size:2.1rem;color:var(--c-green);line-height:1;font-variant-numeric:tabular-nums}
.summary__anchor{text-align:right;font-size:.8rem;color:var(--c-muted);margin:.15rem 0 0;font-style:italic}
/* prices and counts never jiggle: fixed-width digits wherever a number updates */
.summary__amount,.summary__lines,.stepper__input,.optcard__price,.calc__anchor{font-variant-numeric:tabular-nums}
/* ghost seal: the brand diamond at architectural scale behind the desktop hero copy,
   faint enough to read as watermark texture (typography-as-image, no stock photos) */
@media(min-width:981px){
  .hero--home .hero__bg::before{content:"";position:absolute;left:-140px;bottom:-170px;width:600px;height:600px;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M24 2L46 24 24 46 2 24z' fill='none' stroke='%2314532D' stroke-width='.9'/%3E%3Cpath d='M24 5.5L42.5 24 24 42.5 5.5 24z' fill='none' stroke='%2314532D' stroke-width='.5'/%3E%3Cpath d='M24 13l3 6.2 6.8.9-5 4.8 1.3 6.7-6.1-3.4-6.1 3.4 1.3-6.7-5-4.8 6.8-.9z' fill='%2314532D'/%3E%3C/svg%3E") no-repeat center/contain;
    opacity:.055;transform:rotate(-6deg)}
}
.summary__note{display:flex;align-items:flex-start;gap:.45em;font-size:.82rem;color:var(--c-muted);margin:.4rem 0 1rem}
.summary__note .ic{color:var(--c-green);margin-top:.15em}
.calc__summary .btn{margin-bottom:.6rem}
.summary__micro{text-align:center;font-size:.78rem;color:var(--c-muted);margin:.2rem 0 0}

/* ---------- trust strip ---------- */
.truststrip{background:linear-gradient(90deg,var(--c-navy-ink) 0%,var(--c-navy-deep) 30%,var(--c-navy) 55%,var(--c-navy-deep) 100%);padding:1.3rem 0;position:relative}
.truststrip::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(232,161,60,.55) 30%,rgba(232,161,60,.55) 70%,transparent)}
.truststrip__inner{display:flex;flex-wrap:wrap;gap:.7rem .8rem;align-items:center;justify-content:center}
.trust__item{display:inline-flex;align-items:center;gap:.5em;color:var(--c-sky-tint);font-size:.9rem;font-weight:600;letter-spacing:.01em}
.trust__item .ic{color:var(--c-gold);width:18px;height:18px}
.trust__item--star .stars{color:var(--c-star)}
/* Badge treatment: chips with a hairline gold rule and a tinted icon tile, borrowing the
   language of .chip and .fact__tick so they read as UI. Deliberately NOT seals or
   medallions, because we hold no accreditation and must not imply one. */
.trust__item--badge{gap:.55em;padding:.45rem .95rem .45rem .45rem;border-radius:999px;color:#fff;font-size:.88rem;
  background:rgba(255,255,255,.055);border:1px solid rgba(232,161,60,.30);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07)}
.trust__ic{width:26px;height:26px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
  background:rgba(232,161,60,.16);color:#E8A13C}
.trust__ic .ic{width:15px;height:15px}

/* ---------- band (de brasileiro) ---------- */
.band{background:var(--c-white)}
.band__inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.band__media{position:relative}
.brandcard{display:flex;align-items:center;justify-content:center;width:100%;min-height:clamp(340px,42vw,500px);border-radius:var(--r-xl);box-shadow:var(--shadow-xl);padding:2rem;text-align:center;position:relative;overflow:hidden;
  background:
    radial-gradient(120% 90% at 85% -10%, rgba(232,161,60,.30), transparent 55%),
    radial-gradient(100% 80% at 0% 112%, rgba(27,138,90,.28), transparent 55%),
    linear-gradient(160deg,#11466E 0%,var(--c-navy) 45%,var(--c-navy-deep) 100%)}
.brandcard::before{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.16;mix-blend-mode:overlay;pointer-events:none}
.brandcard::after{content:"";position:absolute;inset:10px;border:1px solid rgba(255,255,255,.16);border-radius:calc(var(--r-xl) - 8px);pointer-events:none}
.brandcard__inner{display:flex;flex-direction:column;align-items:center;gap:1rem;max-width:400px;position:relative;z-index:1}
.brandcard__inner svg{width:70px;height:70px;fill:var(--c-gold);filter:drop-shadow(0 10px 20px rgba(232,161,60,.45))}
.brandcard__name{font-family:var(--font-display);font-size:clamp(2.2rem,4.2vw,3.1rem);font-weight:700;color:#fff;line-height:1.1;text-shadow:0 2px 24px rgba(0,0,0,.25)}
.brandcard__tag{font-size:.95rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--c-gold)}
.band__media img{border-radius:var(--r-xl);box-shadow:var(--shadow-lg);width:100%;height:520px;object-fit:cover;object-position:center 30%}
.band__media-badge{position:absolute;left:1rem;bottom:1rem;background:var(--c-paper);color:var(--c-navy-deep);font-weight:700;font-size:.85rem;
  padding:.55rem .9rem;border-radius:999px;box-shadow:var(--shadow-md);display:inline-flex;align-items:center;gap:.45em}
.band__media-badge .ic{color:var(--c-green)}
.band__media-note{position:absolute;top:.8rem;left:.8rem;background:rgba(10,42,67,.85);color:#fff;font-size:.72rem;padding:.3rem .6rem;border-radius:6px;font-weight:600}
.band__copy p{color:var(--c-prose);font-size:1.08rem}
/* Author photo pulled 2026-08-19: when the media column is gone, collapse the split to one readable centered column. */
.band__inner:has(>.band__copy:only-child),.ivy__inner:has(>.ivy__copy:only-child){grid-template-columns:1fr;max-width:760px;margin-inline:auto}
.band__stats{display:flex;gap:2rem;margin-top:1.6rem;flex-wrap:wrap}
.stat{display:flex;flex-direction:column}
.stat__num{font-family:var(--font-display);font-weight:700;font-size:1.9rem;color:var(--c-navy);line-height:1}
.stat__lbl{font-size:.85rem;color:var(--c-muted);margin-top:.25rem;max-width:140px}

/* ---------- how it works ---------- */
.how{background:var(--c-cream)}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.step{background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-lg);padding:2rem 1.6rem 1.7rem;position:relative;box-shadow:var(--shadow-sm);
  transition:transform .22s var(--ease),box-shadow .22s var(--ease),border-color .22s var(--ease)}
.step:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:rgba(232,161,60,.45)}
.step__num{position:absolute;top:-18px;left:1.6rem;width:38px;height:38px;border-radius:50%;
  background:linear-gradient(180deg,var(--c-gold-lift),var(--c-gold-shade));
  color:var(--c-navy-deep);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:1.05rem;
  box-shadow:0 8px 16px -6px rgba(204,134,31,.55), inset 0 1px 0 rgba(255,255,255,.4)}
.step__ic{width:54px;height:54px;border-radius:var(--r-md);background:linear-gradient(160deg,var(--c-navy-700),var(--c-navy-deep));color:#fff;display:flex;align-items:center;justify-content:center;margin:.6rem 0 1rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.step__ic svg{width:28px;height:28px;fill:currentColor}
.step__title{font-size:1.25rem;font-weight:600;margin-bottom:.5rem}
.step p{color:var(--c-muted);font-size:.98rem;margin:0}

/* ---------- certificate ---------- */
.cert{background:var(--c-white)}
.cert__inner{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.cert__copy p{color:var(--c-prose);font-size:1.08rem}
.cert__facts-title{font-family:var(--font-display);font-size:1.22rem;color:var(--c-navy-deep);margin:1.8rem 0 .2rem}
.cert__facts{display:grid;gap:.8rem;margin:1.4rem 0 1.4rem}
.fact{display:flex;gap:.7rem;align-items:flex-start;font-size:.98rem}
.fact__tick{width:26px;height:26px;border-radius:50%;background:var(--c-green-soft);color:var(--c-green);flex:none;display:flex;align-items:center;justify-content:center}
.fact__tick .ic{width:16px;height:16px}
.fact div{color:var(--c-muted)}
.fact strong{color:var(--c-text)}

.cert__doc{display:flex;justify-content:center}
.doc{position:relative;background:var(--c-paper);width:100%;max-width:420px;border-radius:var(--r-md);
  border:1px solid var(--c-border);box-shadow:var(--shadow-lg);padding:2.2rem 2rem 1.8rem;
  background-image:linear-gradient(180deg,#fffdf8,#fff);transform:rotate(-1.2deg)}
.doc::before{content:"";position:absolute;inset:8px;border:1.5px solid var(--c-cream-2);border-radius:8px;pointer-events:none}
.doc__ribbon{position:absolute;top:-16px;right:24px;width:46px;height:46px;border-radius:50%;background:var(--c-gold);
  color:var(--c-navy-deep);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-md)}
.doc__ribbon .ic{width:24px;height:24px}
.doc__head{text-align:center;border-bottom:1px solid var(--c-border);padding-bottom:.9rem;margin-bottom:1rem}
.doc__brand{font-family:var(--font-display);font-weight:700;color:var(--c-navy);letter-spacing:.02em;margin:0;font-size:1rem}
.doc__title{font-family:var(--font-display);font-size:1.3rem;color:var(--c-navy-deep);margin:.2rem 0 0;font-weight:600}
.doc__lines{display:grid;gap:.5rem;margin:.9rem 0}
.doc__lines span{height:9px;border-radius:4px;background:var(--c-cream-2)}
.doc__lines span.short{width:55%}
.doc__quote{font-style:italic;color:#5b6b78;font-size:.92rem;border-left:3px solid var(--c-gold);padding-left:.9rem;margin:1rem 0}
.doc__sign{display:flex;align-items:flex-end;justify-content:space-between;margin-top:1.4rem}
.doc__sigline{display:flex;flex-direction:column}
.doc__signature{font-family:'Playfair Display',serif;font-style:italic;font-size:1.5rem;color:var(--c-navy-deep);border-bottom:1.5px solid var(--c-text);padding:0 1rem .1rem 0}
.doc__siglabel{font-size:.72rem;color:var(--c-muted);margin-top:.3rem;text-transform:uppercase;letter-spacing:.08em}
.doc__seal{width:74px;height:74px;border-radius:50%;border:2px dashed var(--c-green);color:var(--c-green);
  display:flex;align-items:center;justify-content:center;text-align:center;font-weight:800;font-size:.7rem;line-height:1.1;
  transform:rotate(-8deg);background:var(--c-green-soft)}
.doc__ref{text-align:center;font-size:.74rem;color:var(--c-muted);margin:1.2rem 0 0;letter-spacing:.04em}

/* ---------- documents grid ---------- */
.docs{background:var(--c-cream)}
.docgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.doccard{background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-lg);padding:1.5rem;
  display:flex;flex-direction:column;gap:.3rem;box-shadow:var(--shadow-sm);position:relative;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease)}
.doccard::after{content:"";position:absolute;top:1.4rem;right:1.3rem;width:20px;height:20px;opacity:0;transform:translateX(-6px);
  background-color:var(--c-gold-dark);transition:opacity .2s var(--ease),transform .2s var(--ease);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h12l-5-5 1.4-1.4L21 12l-7.6 6.4L12 17l5-5H5z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h12l-5-5 1.4-1.4L21 12l-7.6 6.4L12 17l5-5H5z'/%3E%3C/svg%3E") center/contain no-repeat}
.doccard:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--c-gold)}
.doccard:hover::after{opacity:1;transform:translateX(0)}
.doccard__ic{display:flex;align-items:flex-end;margin-bottom:.65rem;
  filter:drop-shadow(0 2px 4px rgba(14,59,32,.12))}
.doccard__ic svg{width:52px;height:65px}
.doccard:hover .doccard__ic{filter:drop-shadow(0 4px 8px rgba(14,59,32,.18))}
/* uniform 3x2 grid: identical cards, identical icons; consistency reads as competence */
@media(min-width:761px){
  .docgrid .doccard{align-items:center;text-align:center;padding:1.6rem 1.2rem 1.4rem}
  .docgrid .doccard__ic svg{width:56px;height:70px}
}
.doccard__name{font-weight:700;font-size:1.1rem;color:var(--c-navy-deep)}
.doccard__pt{color:var(--c-gold-dark);font-size:.85rem;font-style:italic}
.doccard__desc{color:var(--c-muted);font-size:.86rem;line-height:1.5;margin:.15rem 0 .3rem}
.doccard h2{font-size:1.17rem}
.docs__more{text-align:center;margin:2rem 0 0;font-size:1.05rem;color:var(--c-muted)}
.docs__more a{font-weight:700;color:var(--c-navy);text-decoration:underline;text-decoration-color:var(--c-gold)}

/* ---------- tools hub cards ---------- */
html{scrollbar-gutter:stable both-edges}
.docs--tools{padding-top:clamp(.75rem,2vw,1.25rem)}
.pagehero--center .pagehero__inner{max-width:900px;margin-inline:auto;text-align:center}
.pagehero--center .pagehero__sub{margin-inline:auto}
.pagehero--center .ff__byline{margin-inline:auto}
/* Breadcrumbs are a flex row, so text-align:center does not touch them; center the row itself. */
.pagehero--center .crumbs{justify-content:center}
/* Space between the hero answer paragraph and the byline that follows it (blog posts). */
.pagehero__sub + .ff__byline{margin-top:1.5rem}
/* Blog hero sits near the top: the standard hero carries ~96px of top padding, which left the
   breadcrumbs floating low. Pull the blog hero up so the crumbs sit just under the header.
   Two-class selector so it beats the later single-class `.pagehero{padding:...}` rule. */
.pagehero.pagehero--blog{padding-top:clamp(1.5rem,2.4vw,2rem)}
.pagehero__kicker2{font-size:clamp(1.02rem,1.7vw,1.22rem);font-weight:600;line-height:1.35;color:var(--c-green);margin:.55rem 0 0;letter-spacing:-.005em}
.pagehero--center .pagehero__kicker2{margin-inline:auto;max-width:640px}
.toolgrid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:stretch;max-width:900px;margin-inline:auto}
.toolcard{display:flex;flex-direction:column;background:var(--c-white);border:1px solid var(--c-border);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-sm);text-decoration:none;color:inherit;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.toolcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--c-gold)}
.toolcard__preview{padding:1.6rem;border-bottom:1px solid var(--c-border);display:flex;flex-direction:column;justify-content:center;min-height:228px}
.toolcard__preview--green{background:var(--c-green-soft)}
.toolcard__preview--gold{background:var(--c-cream-2)}
.tprev{background:var(--c-paper);border-radius:var(--r-md);box-shadow:var(--shadow-sm);padding:1rem 1.1rem;display:flex;flex-direction:column;gap:.55rem}
.tprev__head{display:flex;align-items:center;gap:.5rem;font-weight:700;color:var(--c-navy-deep);font-size:.92rem;padding-bottom:.55rem;border-bottom:1px solid var(--c-border-cool);margin-bottom:.15rem}
.tprev__head svg{width:16px;height:16px;fill:var(--c-gold-dark);flex:none}
.tprev__dest{color:var(--c-green)}
.tprev__row{display:flex;align-items:center;gap:.55rem;font-size:.92rem;color:var(--c-text)}
.tprev__ok{width:20px;height:20px;flex:none;border-radius:50%;background:var(--c-green-soft);display:inline-flex;align-items:center;justify-content:center}
.tprev__ok svg{width:12px;height:12px;fill:var(--c-green)}
.tprev--price{align-items:center;text-align:center;gap:.35rem;padding:1.4rem 1.1rem}
.tprev__label{font-size:.85rem;color:var(--c-muted);font-weight:600}
.tprev__price{font-family:var(--font-display);font-size:2.7rem;font-weight:700;color:var(--c-navy-deep);line-height:1}
.tprev__note{font-size:.85rem;color:var(--c-green);font-weight:700}
.toolcard__body{padding:1.5rem 1.6rem 1.7rem;display:flex;flex-direction:column;gap:.55rem;flex:1;text-align:center;align-items:center}
.toolcard__title{font-family:var(--font-display);font-size:1.5rem;color:var(--c-navy-deep);margin:.1rem 0 0}
.toolcard__desc{color:var(--c-muted);font-size:.98rem;line-height:1.55;flex:1;margin:0}
.toolcard__cta{margin-top:.7rem;align-self:center;display:inline-flex;align-items:center;gap:.4rem}
.toolcard__cta svg{width:16px;height:16px;fill:currentColor;transition:transform .18s var(--ease)}
.toolcard:hover .toolcard__cta svg{transform:translateX(3px)}

/* ---------- ivy ---------- */
.ivy{background:var(--c-white)}
.ivy__inner{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.ivy__media{position:relative}
.ivy__media img{border-radius:var(--r-xl);box-shadow:var(--shadow-lg);width:100%;height:480px;object-fit:cover;object-position:center 20%}
.ivy__placeholder-note{position:absolute;top:.8rem;left:.8rem;background:rgba(10,42,67,.85);color:#fff;font-size:.72rem;
  padding:.3rem .6rem;border-radius:6px;font-weight:600}
.ivy__copy p{color:var(--c-prose);font-size:1.08rem}
.ivy__chips{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.3rem 0 1.2rem}
/* The .storyband rules were removed with the unused Rio banner section. Nothing
   emitted them, and the background-url kept a 137KB jpg deploying. */
@media (max-width:760px){
  .hero{padding-top:2.4rem}
  .btn--lg{padding:.9rem 1.05rem;font-size:1rem}
  .btn--block{white-space:normal;line-height:1.25}
  section{padding:2.2rem 0}
  /* Phone layout: three rows. The two long badges each need a row of their own (225px
     and 211px against a ~335px content box, so pairing them is impossible without
     truncating the text), but "Signed personally by Ivy" and "Based in Florida" pair up
     once the padding is tight enough. Measured, not guessed: at .78rem padding the pair
     came to 345px and wrapped to four rows. */
  .truststrip__inner{gap:.45rem;justify-content:center}
  .trust__item--badge{font-size:.8rem;padding:.34rem .6rem .34rem .34rem;gap:.4em}
  .trust__ic{width:21px;height:21px}
  .trust__ic .ic{width:13px;height:13px}
  .how__more{text-align:center}
  .link-arrow{display:inline}
  .link-arrow .ic{vertical-align:-.12em}
}
.chip{display:inline-flex;align-items:center;gap:.4em;background:var(--c-cream);border:1px solid var(--c-border);
  border-radius:999px;padding:.45rem .85rem;font-weight:600;font-size:.88rem}
.chip .ic{color:var(--c-green)}

/* ---------- pricing ---------- */
.pricing{background:var(--c-cream)}
.pricetable{max-width:680px;margin:0 auto;background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-md)}
.pricerow{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.4rem;border-bottom:1px solid var(--c-border);transition:background .15s var(--ease)}
.pricerow span:first-child{flex:1}
.pricerow:not(.pricerow--head):hover{background:#FFFDF8}
.pricerow:last-child{border-bottom:0}
.pricerow--head{background:linear-gradient(90deg,var(--c-navy-ink),var(--c-navy-deep) 60%,var(--c-navy));color:var(--c-sky-tint);font-weight:700;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em}
.pricerow--head span:last-child{text-align:right}
.pricerow__val{font-weight:700;color:var(--c-navy-deep);flex-shrink:0;text-align:right;max-width:44%}
.pricerow__val em{font-style:normal;font-weight:500;color:var(--c-muted);font-size:.85rem}
.pricerow__val--free{color:var(--c-green)}
.pricing__cta{display:flex;flex-direction:column;align-items:center;gap:.8rem;margin-top:2rem;text-align:center}
.pricing__hint{font-size:.88rem;color:var(--c-muted);max-width:460px}

/* ---------- reviews ---------- */

/* ---------- guarantee ---------- */
.guarantee{background:linear-gradient(135deg,var(--c-navy) 0%,var(--c-navy-deep) 100%);position:relative;overflow:hidden}
.guarantee::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(700px 320px at 12% 0%, rgba(232,161,60,.16), transparent 60%)}
.guarantee::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.12;mix-blend-mode:overlay;pointer-events:none}
.guarantee .container{position:relative;z-index:1}
.guarantee__inner{display:flex;align-items:center;gap:1.8rem;flex-wrap:wrap;justify-content:center;text-align:left}
.guarantee__badge{width:84px;height:84px;flex:none;color:var(--c-gold)}
.guarantee__badge svg{width:100%;height:100%;fill:currentColor}
.guarantee__copy{flex:1;min-width:280px;color:#dfeaf3}
.guarantee__copy h2{color:#fff;font-size:1.8rem;font-weight:600;margin-bottom:.5rem}
.guarantee__copy p{margin:0;color:#bcd0e1}
/* Scope sentence under the promise. Muted against the band's #bcd0e1 body text so it
   reads as terms, not as a second competing promise. Needs its own margin because the
   rule above zeroes it and the two paragraphs would otherwise collide. */
.guarantee__copy .guarantee__fine{margin:.55rem 0 0;font-size:.9rem;color:#A9BED0}

/* ---------- faq ---------- */
.faq{background:var(--c-cream)}
.faqlist{max-width:780px;margin:0 auto;display:grid;gap:.8rem}
.faqitem{background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-md);padding:0 1.3rem;box-shadow:var(--shadow-sm);transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}
.faqitem[open]{border-color:rgba(232,161,60,.5);box-shadow:var(--shadow-md)}
.faqitem summary{list-style:none;cursor:pointer;font-weight:700;font-size:1.08rem;color:var(--c-navy-deep);
  padding:1.1rem 0;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.faqitem summary::-webkit-details-marker{display:none}
.faqitem__chev{width:22px;height:22px;color:var(--c-navy);transition:transform .2s ease;flex:none}
.faqitem[open] .faqitem__chev{transform:rotate(180deg)}
.faqitem p{color:var(--c-muted);margin:0 0 1.1rem;font-size:1rem}
.faq__more{text-align:center;margin:2rem 0 0}
.faq__more a{font-weight:700;display:inline-flex;align-items:center;gap:.4em}

/* ---------- final cta ---------- */
.finalcta{background:linear-gradient(135deg,#11466E 0%,var(--c-navy) 40%, var(--c-navy-deep) 100%);position:relative;overflow:hidden}
.finalcta::after{content:"";position:absolute;inset:0;
  background:
    radial-gradient(700px 300px at 80% 0%, rgba(232,161,60,.26), transparent 60%),
    radial-gradient(600px 300px at 8% 100%, rgba(27,138,90,.2), transparent 60%),
    var(--grain);
  background-size:auto,auto,120px 120px;opacity:.6;mix-blend-mode:normal;pointer-events:none}
.finalcta__inner{position:relative;text-align:center;max-width:680px;margin:0 auto}
.finalcta h2{color:#fff;font-size:clamp(1.8rem,4vw,2.6rem);font-weight:600}
.finalcta p{color:var(--c-sky-tint);font-size:1.12rem;margin:1rem auto 1.8rem;max-width:520px}
.finalcta__btns{display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap}

/* ---------- footer ---------- */
.site-footer{background:var(--c-navy-ink);color:var(--c-foot-text);padding:3.2rem 0 4.6rem;font-size:.94rem;position:relative}
.site-footer::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--c-gold) 0%,var(--c-gold-soft) 30%,var(--c-green) 70%,var(--c-navy-700) 100%)}
.foot a{transition:color .15s var(--ease),transform .15s var(--ease)}
.foot a:not(.brand--foot):not(.btn):hover{transform:translateX(3px)}
.site-footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:2rem}
.foot h2{font-family:var(--font-body);color:#fff;font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;margin:0 0 1rem}
.foot a{display:block;color:var(--c-foot-text);padding:.28rem 0;transition:color .15s}
.foot a:hover{color:#fff}
.foot__plain{display:block;padding:.28rem 0;color:var(--c-foot-dim)}
.foot a.brand--foot{display:inline-flex;align-items:center;gap:.7rem;margin-bottom:.9rem;padding:0}
.brand--foot .brand__name{color:#fff;font-size:1.1rem}
.brand--foot .brand__name em{color:var(--c-gold-mark)}
.foot--brand p{color:#8fa9bf;max-width:300px;margin:.4rem 0 1rem}
.trustpilot-link{display:inline-flex;align-items:center;gap:.5em;color:#fff;font-weight:600}
.site-footer__bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(255,255,255,.12);
  margin-top:2.4rem;padding-top:1.4rem;font-size:.85rem;color:var(--c-foot-dim);flex-wrap:wrap;gap:.6rem}
.site-footer__legal a{color:var(--c-foot-dim);margin-left:1rem}
.site-footer__legal a:hover{color:#fff}

/* ---------- modal ---------- */
.modal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:1.2rem}
.modal[hidden]{display:none}
.modal__backdrop{position:absolute;inset:0;background:rgba(10,42,67,.55);backdrop-filter:blur(3px)}
.modal__card{position:relative;background:var(--c-paper);border-radius:var(--r-xl);max-width:420px;width:100%;
  padding:2rem 1.8rem 1.8rem;box-shadow:var(--shadow-lg);text-align:center;animation:pop .2s ease}
@keyframes pop{from{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}
.modal__close{position:absolute;top:.9rem;right:.9rem;background:none;border:0;color:var(--c-muted);cursor:pointer;padding:6px}
.modal__close .ic{width:22px;height:22px}
.modal__lock{width:54px;height:54px;border-radius:50%;background:var(--c-green-soft);color:var(--c-green);
  display:flex;align-items:center;justify-content:center;margin:0 auto .9rem}
.modal__lock .ic{width:28px;height:28px}
.modal__card h3{font-size:1.4rem;font-weight:600}
.modal__demo{font-size:.85rem;color:var(--c-gold-dark);background:var(--c-paper-warm);border:1px dashed var(--c-gold);border-radius:var(--r-sm);padding:.5rem .8rem;margin:.8rem 0 1rem}
.modal__summary{list-style:none;margin:0 0 .8rem;padding:0;text-align:left;font-size:.92rem}
.modal__summary li{display:flex;justify-content:space-between;padding:.3rem 0;border-bottom:1px dashed var(--c-border);color:var(--c-muted)}
.modal__summary li span:last-child{color:var(--c-text);font-weight:600}
.modal__total{display:flex;justify-content:space-between;font-weight:700;font-size:1.2rem;color:var(--c-navy-deep);margin-bottom:1.2rem}
.modal__total span:last-child{color:var(--c-green)}
.modal__micro{font-size:.78rem;color:var(--c-muted);margin:.8rem 0 0}

/* ---------- hero trust line ---------- */
.hero__trust{margin-top:1.4rem;font-size:.92rem;color:var(--c-muted);font-weight:600}

/* ---------- checklist funnel band ---------- */
.funnel{background:var(--c-cream-2)}
.funnel__inner{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.funnel__copy p{color:var(--c-prose);font-size:1.08rem;margin:0 0 1.5rem}
.funnel__steps{display:grid;gap:.8rem}
.fstep{display:flex;align-items:center;gap:1rem;background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-md);padding:1rem 1.2rem;box-shadow:var(--shadow-sm)}
.fstep__n{width:36px;height:36px;flex:none;border-radius:50%;background:var(--c-gold);color:var(--c-navy-deep);font-weight:800;display:flex;align-items:center;justify-content:center}
.fstep strong{display:block;color:var(--c-navy-deep);font-size:1.02rem}
.fstep span{color:var(--c-muted);font-size:.9rem}

/* ---------- footer contact buttons (protect from .foot a) ---------- */
.foot__contactbtns{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.4rem}
.foot__contactbtns .btn{display:inline-flex;padding:.7rem 1.1rem}
.foot__contactbtns .btn--gold{color:var(--c-navy-deep)}
.foot__contactbtns .btn--gold:hover{color:var(--c-navy-deep)}
.foot__contactbtns .btn--ghost{background:var(--c-paper);color:var(--c-navy);border-color:var(--c-border-cool)}
.foot__contactbtns .btn--ghost:hover{color:var(--c-navy)}

/* ---------- footer social icons (protect from .foot a, same as the buttons above) ----------
   Brand-colored chips with white glyphs: on the dark footer, colored glyphs alone disappear,
   solid platform-color circles are the readable form. */
.foot__social{display:flex;gap:.65rem;margin-top:1rem}
.foot__social a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border-radius:50%;background:rgba(255,255,255,.08);color:#fff}
.foot__social .social--facebook{background:#1877F2}
.foot__social .social--instagram{background:radial-gradient(circle at 30% 110%,#FDF497 0%,#FD5949 45%,#D6249F 60%,#285AEB 90%)}
.foot__social .social--youtube{background:#F00}
/* :not() chain matches the .foot a hover rule's specificity so transform:none actually wins */
.foot__social a:not(.brand--foot):not(.btn):hover{transform:translateY(-2px);filter:brightness(1.12)}
.foot__social .ic{width:22px;height:22px}

/* ---------- floating action button (all pages) ---------- */
.fab{position:fixed;right:16px;bottom:16px;z-index:60;display:inline-flex;align-items:center;gap:.5em;
  background:linear-gradient(180deg,#F3B14C,var(--c-gold));color:var(--c-navy-deep);font-weight:800;font-size:.95rem;
  padding:.8rem 1.15rem;border-radius:999px;border:1px solid rgba(168,122,31,.5);
  box-shadow:0 8px 24px rgba(14,58,92,.32);
  transition:transform .15s var(--ease),box-shadow .15s var(--ease),opacity .15s var(--ease),visibility .15s var(--ease)}
.fab:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(14,58,92,.4);color:var(--c-navy-deep)}
.fab .ic{width:19px;height:19px;fill:currentColor;flex-shrink:0}
/* The fab exists only to jump to the calculator. While the calculator is on
   screen it is redundant, and on narrow phones it sits on top of the page
   stepper's "+" button. calculator.js toggles this class from an observer. */
.fab--hidden{opacity:0;visibility:hidden;transform:translateY(8px);pointer-events:none}

/* WhatsApp floating button: stacked above the price fab, always visible
   (calculator.js only toggles the first .fab, which is the price button). */
.fab-wa{position:fixed;right:16px;bottom:74px;z-index:60;display:inline-flex;align-items:center;gap:.5em;
  background:#25D366;color:#073d24;font-weight:800;font-size:.95rem;
  padding:.8rem 1.15rem;border-radius:999px;border:1px solid rgba(7,61,36,.35);
  box-shadow:0 8px 24px rgba(14,58,92,.32);
  transition:transform .15s var(--ease),box-shadow .15s var(--ease),opacity .15s var(--ease),visibility .15s var(--ease)}
.fab-wa:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(14,58,92,.4);color:#073d24}
.fab-wa .ic{width:19px;height:19px;fill:currentColor;flex-shrink:0}

/* Phones: two labelled pills stacked bottom-right ate a real slice of a 375px
   screen. The price fab keeps its label (it is the primary CTA and "Get your
   price" is the whole offer); WhatsApp drops to an icon-only circle, since the
   glyph is universally read and the button keeps its aria-label either way.
   Both hold a 44px touch target. .fab-wa's offset is the price fab's 12px
   bottom + its 44px height + an 8px gap. */
@media (max-width:480px){
  .fab,.fab-wa{right:12px;font-size:.85rem;min-height:44px}
  .fab{bottom:12px;padding:.6rem .9rem}
  .fab-wa{bottom:64px;width:44px;height:44px;padding:0;justify-content:center;border-radius:50%}
  .fab-wa span{display:none}
  .fab .ic,.fab-wa .ic{width:18px;height:18px}
}

/* ---------- inner page hero + breadcrumbs ---------- */
.pagehero{position:relative;padding:clamp(6rem,7.5vw,8.5rem) 0 clamp(1.8rem,4vw,2.8rem);
  background:
    radial-gradient(1100px 480px at 80% -14%, rgba(232,161,60,.18), transparent 60%),
    radial-gradient(800px 520px at -8% 118%, rgba(27,138,90,.10), transparent 55%),
    linear-gradient(180deg,#fff,var(--c-cream))}
.pagehero::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.4;
  background-image:var(--grain);background-size:120px 120px;mix-blend-mode:multiply}
.pagehero .container{position:relative;z-index:1}
.pagehero__inner{max-width:840px}
.pagehero__title{font-size:clamp(1.9rem,4vw,2.9rem);font-weight:600;letter-spacing:-.01em;margin:.2rem 0 0}
.pagehero__sub{font-size:1.15rem;color:var(--c-prose);margin:1rem 0 0;max-width:700px}
.pagehero__pills{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.2rem}
.pagehero__pills span{background:var(--c-paper);border:1px solid var(--c-border);border-radius:999px;padding:.45rem .9rem;font-weight:600;font-size:.9rem;box-shadow:var(--shadow-sm)}
.pagehero__btns{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.4rem}
.crumbs{font-size:.85rem;color:var(--c-muted);margin-bottom:.7rem;display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}
.crumbs a{color:var(--c-muted)}
.crumbs a:hover{color:var(--c-navy)}
.crumbs span:last-child{color:var(--c-text);font-weight:600}
.crumbs__sep{color:var(--c-border)}

/* ---------- prose + embedded calculator section ---------- */
.prose-section{background:var(--c-paper)}
.narrow{max-width:760px;margin:0 auto}
.prose-section p{font-size:1.1rem;color:var(--c-prose);margin:0 0 1.1rem}
.prose-section .cert__facts{margin-top:1.8rem}
.prose-sig{display:flex;gap:.55em;align-items:flex-start;margin:1.8rem 0 0;padding:.95rem 1.15rem;background:var(--c-green-soft);border-left:3px solid var(--c-green);border-radius:10px;font-size:1rem;color:var(--c-text);line-height:1.5}
.prose-sig .ic{color:var(--c-green);flex:none;margin-top:.12em}
.calcsection{background:var(--c-cream)}
.uploadsection{padding:1.4rem 0 3rem}
.uploadsection iframe{display:block;background:var(--c-paper);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}
.calcsection__inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,3.5rem);align-items:start}
.calcsection__intro .section-title{margin-bottom:.6rem}
.calcsection__intro p{color:var(--c-prose);font-size:1.08rem}

/* ---------- contact page ---------- */
/* The .contactform rules were removed with the inert demo form on /contact/.
   Contact now routes to WhatsApp, the secure upload, and the calculator. */
.contact__meta{margin-top:1.6rem;color:var(--c-muted);font-weight:600}

/* ---------- checklist tool ---------- */
.pagehero--tool{padding-top:clamp(5.5rem,6vw,7rem);padding-bottom:clamp(1rem,2vw,1.4rem)}
.pagehero--tool .pagehero__title{font-size:clamp(1.55rem,3vw,2.1rem)}
.pagehero--tool .pagehero__sub{font-size:1.05rem;max-width:660px;margin-top:.7rem}
.pagehero--tool .ck{margin-top:1.6rem;max-width:820px}

/* ---------- single-column tool pages: /secure-upload/, /thank-you/, /pt/envio-seguro/ ----------
   These three put a hero directly above ONE centred 760px column: the Jotform embed on the
   two upload pages, the "what happens next" prose on the confirmation page. Before this the
   hero rode the default 840px .pagehero__inner while the body below sat in .narrow (760px),
   so at 1440px the H1 started at x=324 and the form card at x=364. Nothing on the page shared
   an edge and the whole thing read as two layouts stacked by accident.
   Matching the hero column to .narrow IS the fix: eyebrow, H1, sub and card now all start on
   the same line, left and right.
   🛑 Scoped to its own modifier, NOT to .pagehero--tool. The checklist generator and the
   false-friends tool also use .pagehero--tool but carry their tool INSIDE the hero at 820px,
   so they are already self-consistent and must not be narrowed. */
.pagehero--narrow .pagehero__inner{max-width:760px}
/* The 660px sub cap is there to keep a readable measure inside an 840px hero. Inside a 760px
   column the column already IS the measure (~72 characters), so the cap only re-introduces a
   ragged right edge against the card below it. */
.pagehero--narrow .pagehero__sub{max-width:none}
/* .pagehero--tool bottoms out at ~22px while the section below opens with ~86px, which left
   the hero copy squashed against the fold line and a dead band under it. Even the two out. */
.pagehero--narrow{padding-bottom:clamp(1.9rem,3vw,2.6rem)}
.pagehero--narrow + .uploadsection{padding-top:clamp(1.9rem,3vw,2.6rem)}
.pagehero--narrow + .prose-section{padding-top:clamp(2.2rem,3.6vw,3.1rem)}

/* ---------- inline links in body copy ----------
   The global rule is a{color:var(--c-navy);text-decoration:none}. In a paragraph that means a
   #14532D link sitting inside #3D5347 prose with no underline and no weight change: two greens
   of near-identical luminance. "You can also message us on WhatsApp" was invisible as a link.
   Underline + 600 marks it without turning the paragraph into a row of buttons. The muted
   underline colour keeps it calm at rest and snaps to full strength on hover.
   :not(.btn) so gold/ghost CTA buttons that live inside prose are left alone.
   :not(:only-child) on list items is the navigation carve-out. /sitemap/, /services/ and
   /pt/servicos/ carry lists where EVERY item is a bare link; underlining those turns a clean
   index into a wall of rules. An anchor that is the sole element in its <li> is navigation,
   an anchor sitting next to other content is a link inside a sentence. Only the second gets
   the treatment. (Two PT list items pair a lone anchor with trailing text and so miss out;
   both still read as link lists, so that is the right side to err on.) */
.pagehero__sub a:not(.btn),
.prose-section p a:not(.btn),
.prose-section li a:not(.btn):not(:only-child){
  font-weight:600;
  text-decoration:underline;
  text-decoration-thickness:1.5px;
  text-underline-offset:3px;
  text-decoration-color:rgba(20,83,45,.42);
  transition:text-decoration-color .18s var(--ease),color .18s var(--ease)
}
.pagehero__sub a:not(.btn):hover,
.prose-section p a:not(.btn):hover,
.prose-section li a:not(.btn):not(:only-child):hover{
  color:var(--c-green-night);
  text-decoration-color:currentColor
}
.cktool{background:var(--c-cream)}
.ck__controls{display:grid;grid-template-columns:1fr 1fr;gap:1rem;background:var(--c-paper);border:1px solid var(--c-border);
  border-radius:var(--r-lg);padding:1.4rem;box-shadow:var(--shadow-sm)}
.ck__controls .field{margin-bottom:0}
.ck__results{margin-top:1.4rem}
.ck__status{display:flex;flex-direction:column;gap:.2rem;padding:1rem 1.2rem;border-radius:var(--r-md);margin-bottom:1.2rem;border-left:4px solid}
.ck__status strong{font-size:1.05rem}
.ck__status span{font-size:.95rem}
.ck__status--good{background:var(--c-green-soft);border-color:var(--c-green);color:#155f3e}
.ck__status--check{background:#fff7e8;border-color:var(--c-gold);color:#8a5a12}
.ck__status--ask{background:#fdeeee;border-color:#d9534f;color:#9a322f}
.ck__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.ck__col{background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-md);padding:1.2rem;box-shadow:var(--shadow-sm)}
.ck__col h3{font-family:var(--font-body);font-size:1rem;display:flex;align-items:center;gap:.4em;margin:0 0 .7rem;color:var(--c-navy-deep)}
.ck__col h3 .ic{width:18px;height:18px}
.ck__col ul{margin:0;padding-left:1.1rem;color:var(--c-muted);font-size:.92rem}
.ck__col li{margin-bottom:.5rem}
.ck__col:nth-child(1) h3 .ic{color:var(--c-green)}
.ck__col:nth-child(2) h3 .ic{color:#d9534f}
.ck__col:nth-child(3) h3 .ic{color:var(--c-navy)}
.ck__disclaimer{font-size:.85rem;color:var(--c-muted);margin:1.2rem 0 0;font-style:italic}
.ck__cta{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.2rem}
/* university finder + policy + USCIS detail */
.ckuni{margin-top:1.4rem}
.ckuni__box{position:relative;max-width:520px}
.ckuni__input{width:100%;font-family:inherit;font-size:1rem;border:1.5px solid var(--c-border);border-radius:var(--r-md);padding:.8rem 1rem;background:var(--c-paper);color:var(--c-text)}
.ckuni__input:focus{outline:none;border-color:var(--c-gold);box-shadow:var(--ring)}
.ckuni__list{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:20;background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-md);box-shadow:0 10px 28px rgba(16,31,44,.14);max-height:320px;overflow:auto}
.ckuni__item{display:flex;justify-content:space-between;align-items:center;gap:.6rem;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--c-border);padding:.7rem 1rem;font-family:inherit;font-size:.98rem;color:var(--c-text);cursor:pointer}
.ckuni__item:last-child{border-bottom:0}
.ckuni__item:hover{background:var(--c-cream)}
.ckuni__item:focus-visible{background:var(--c-cream);outline:2px solid var(--c-navy-deep);outline-offset:-2px}
.ckuni__item span{color:var(--c-muted);font-size:.82rem;font-weight:700;white-space:nowrap}
.ckuni__hint{font-size:.85rem;color:var(--c-muted);margin-top:.55rem}
.ckpol{margin-top:1.2rem;background:var(--c-paper);border:1px solid var(--c-border);border-left:4px solid var(--c-navy);border-radius:var(--r-md);padding:1.3rem 1.4rem;box-shadow:var(--shadow-sm)}
.ckpol__head{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap;margin-bottom:.6rem}
.ckpol__head strong{font-size:1.15rem;color:var(--c-navy-deep)}
.ckpol__head span{color:var(--c-muted);font-weight:700;font-size:.85rem}
.ckpol__sum{color:var(--c-prose);margin:0 0 .8rem}
.ckpol__facts{margin:0 0 .8rem;padding-left:1.1rem;color:var(--c-text)}
.ckpol__facts li{margin-bottom:.45rem}
.ckpol__quote{font-style:italic;color:var(--c-muted);border-left:3px solid var(--c-border);padding-left:.9rem;margin:.8rem 0;font-size:.95rem}
.ckpol__meta{margin:.2rem 0 .6rem}
.ckpol__meta a{color:var(--c-gold-dark);font-weight:700}
.ckpol__warn{font-size:.82rem;color:var(--c-muted);margin:.9rem 0 0;font-style:italic}
.ckdetail{margin-top:1.4rem;background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-lg);padding:1.4rem 1.5rem;box-shadow:var(--shadow-sm)}
.ckdetail h3{font-family:var(--font-body);font-size:1.1rem;color:var(--c-navy-deep);margin:0 0 .6rem}
.ckdetail p{color:var(--c-prose);margin:0 0 .7rem}
.ckdetail__quote{background:var(--c-cream);border-left:4px solid var(--c-gold);border-radius:var(--r-md);padding:.9rem 1.1rem;margin:.5rem 0 1rem;font-style:italic;color:var(--c-navy-deep)}
.ckdetail__list{margin:0 0 .8rem;padding-left:1.1rem;color:var(--c-text)}
.ckdetail__list li{margin-bottom:.55rem}
.ckdetail__src{font-size:.82rem;color:var(--c-muted);margin:.6rem 0 0}
/* Outbound citation line at the end of a page (build.source_note). Quiet on purpose:
   it is there to be checked, not to compete with the CTA above it. */
.srcband{padding:1.1rem 0 2rem}
.srcnote{font-size:.82rem;color:var(--c-muted);margin:0}
.srcnote a{color:var(--c-muted);text-decoration:underline}
.srcnote a:hover{color:var(--c-navy)}

/* =========================================================
   Motion (progressive enhancement, gated by html.anim from JS;
   killed entirely by the prefers-reduced-motion block below)
   ========================================================= */
@keyframes rise{from{opacity:0;transform:translateY(18px)}}
html.anim .hero__copy>*{animation:rise .6s var(--ease) backwards}
html.anim .hero__copy>*:nth-child(1){animation-delay:.04s}
html.anim .hero__copy>*:nth-child(2){animation-delay:.1s}
html.anim .hero__copy>*:nth-child(3){animation-delay:.16s}
html.anim .hero__copy>*:nth-child(4){animation-delay:.22s}
html.anim .hero__copy>*:nth-child(5){animation-delay:.28s}
html.anim .hero__copy>*:nth-child(6){animation-delay:.34s}
html.anim .hero .calc{animation:rise .7s var(--ease) .14s backwards}
html.anim .hero__lead>*{animation:rise .6s var(--ease) backwards}
html.anim .hero__lead>*:nth-child(1){animation-delay:.04s}
html.anim .hero__lead>*:nth-child(2){animation-delay:.1s}
html.anim .hero__lead>*:nth-child(3){animation-delay:.16s}
html.anim .hero__more>*{animation:rise .6s var(--ease) .2s backwards}
html.anim .rv{opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
html.anim .rv.in{opacity:1;transform:translateY(0)}

/* =========================================================
   Responsive
   ========================================================= */
/* Collapse to the hamburger before the full desktop nav can crowd the brand wordmark.
   Top-level items are white-space:nowrap (so "How it works" never wraps to two lines) and
   the header bar is capped at 1200px (.site-header__inner max-width). That cap is the key:
   whenever the desktop nav is shown, the row width is fixed at ~1152px of content, so the
   whole thing — brand, the full colored nav WITH the Free tools pill, the social icons and
   the CTA — always sits on one line with even spacing, in EN and in the wider Portuguese.
   We collapse at that same 1200px so the nav is only ever shown at a width where it fits;
   the mobile menu carries the language switch, social row and CTA, so nothing is lost.
   Only the nav switches here; the rest of the mobile layout stays at 760px. */
@media (max-width:1200px){
  .mainnav,.site-header__cta{display:none}
  .navtoggle{display:flex}
}
@media (max-width:980px){
  .hero__inner{grid-template-columns:1fr;gap:2rem}
  .calc{max-width:560px;width:100%;justify-self:center}
  .band__inner,.cert__inner,.ivy__inner,.funnel__inner,.calcsection__inner{grid-template-columns:1fr}
  .band__media{order:-1}
  .band__copy{text-align:center}
  .band__copy p{text-align:left}
  .band__copy .ivy__chips{justify-content:center}
  .ivy__media{order:-1;max-width:440px}
  .steps,.docgrid{grid-template-columns:1fr 1fr}
  .site-footer__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .mainnav,.site-header__cta{display:none}
  .navtoggle{display:flex}
  .site-header__inner{min-height:56px}
  .brand__mark{width:26px;height:26px}
  .brand__name{font-size:1.04rem}
  .steps,.toolgrid,.ck__cols,.ck__controls,.related__grid,.sitemap__grid{grid-template-columns:1fr}
  .jumplinks__pill{font-size:.86rem;padding:.42rem .8rem}
  /* documents stay a tidy 2-up grid of mini documents on phones */
  .docgrid{grid-template-columns:1fr 1fr;gap:.7rem}
  .doccard{padding:1.05rem .7rem .95rem;align-items:center;text-align:center;gap:.2rem}
  .doccard::after{display:none}
  .doccard__ic{margin-bottom:.5rem}
  .doccard__ic svg{width:53px;height:66px}
  .doccard__name{font-size:.93rem;line-height:1.25}
  .doccard__pt{font-size:.84rem;line-height:1.35}
  .band__media img,.ivy__media img{height:380px}
  .guarantee__inner{flex-direction:column;text-align:center}
  .optcards{grid-template-columns:1fr}
  .step{text-align:center;padding-top:2.4rem}
  .step__num{left:50%;transform:translateX(-50%)}
  .step__ic{margin:.6rem auto 1rem}
  .site-footer__grid{grid-template-columns:1fr;gap:2rem;text-align:center}
  .foot--brand p{margin-left:auto;margin-right:auto}
  .foot__contactbtns{flex-direction:column;align-items:center}
  .foot__contactbtns .btn{width:100%;max-width:300px;justify-content:center}
  .foot__social{justify-content:center}
  .site-footer__bottom{flex-direction:column;gap:.4rem;text-align:center}
  .hero__title{font-size:2.1rem}
}
@media (max-width:480px){
  body{font-size:16px}
  .container{padding:0 18px}
  /* .mobilenav is a sibling of the header container, so it does not inherit the
     inset above and its links would sit 6px further in than the logo. */
  .mobilenav{padding-left:18px;padding-right:18px}
  .site-footer__grid{grid-template-columns:1fr}
  .band__stats{gap:1.2rem}
  .finalcta__btns{flex-direction:column}
  .finalcta__btns .btn{width:100%}
}

/* =========================================================
   Behavioral homepage hero (.hero--home): a one-tap quote starter
   above the fold on mobile, a short reassuring lead, and the longer
   supporting copy below. Scoped to .hero--home so the shared .hero on
   the service pages is untouched. The chip picker + calc head styles
   are unscoped because calc_widget() is shared everywhere.
   ========================================================= */

/* lead + guarantee */
.hero__lead{max-width:560px}
.hero__more{max-width:560px}
.hero__more .hero__sub{margin-top:0}
.hero__more .hero__trust{font-size:.92rem;color:var(--c-muted);margin-top:1.2rem}
.hero__guarantee{display:inline-flex;align-items:center;gap:.5em;margin-top:1rem;
  font-weight:700;font-size:1.02rem;color:var(--c-green);line-height:1.25;
  background:var(--c-green-soft);border:1px solid rgba(20,83,45,.22);
  border-radius:999px;padding:.5rem .95rem}
.hero__guarantee svg{width:20px;height:20px;fill:currentColor;flex:none}


/* desktop: lead top-left, more below it, calc on the right spanning both.
   The 1fr spacer row absorbs a tall calc so lead and more stay tight. */
@media(min-width:981px){
  .hero--home .hero__inner{grid-template-rows:auto auto 1fr}
  .hero--home .hero__lead{grid-column:1;grid-row:1;align-self:start}
  .hero--home .hero__more{grid-column:1;grid-row:2;align-self:start}
  .hero--home .calc{grid-column:2;grid-row:1 / 4;align-self:start}
}

/* calculator head: price anchor + progress nudge */
.calc__headrow{display:flex;align-items:baseline;justify-content:space-between;gap:.6rem}
.calc__anchor{font-weight:800;color:var(--c-gold-dark);font-size:1rem;white-space:nowrap}
.calc__anchor-per{font-weight:600;color:var(--c-muted);font-size:.78rem;margin-left:.1em}
.calc__progress{height:6px;border-radius:999px;background:var(--c-cream-2);overflow:hidden;margin:.7rem 0 .45rem}
.calc__progress-bar{display:block;height:100%;width:20%;border-radius:999px;
  background:linear-gradient(90deg,var(--c-gold),var(--c-gold-soft));transition:width .5s var(--ease)}
.calc__step{font-size:.8rem;color:var(--c-muted);font-weight:600;margin:0}
@media(min-width:761px){.calc__steponly{display:none}}  /* desktop already shows the $19 anchor in the head row */

/* document picker chips (one tap starts the quote) */
.chips{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.chipopt,.chips__toggle{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.chip{display:inline-flex;align-items:center;font-weight:700;font-size:.9rem;line-height:1;
  padding:.6rem .85rem;border-radius:999px;background:var(--c-cream);border:1.5px solid var(--c-border);
  color:var(--c-text);cursor:pointer;transition:border-color .15s var(--ease),background .15s var(--ease),color .15s var(--ease)}
.chip:hover{border-color:var(--c-gold)}
.chipopt:checked + .chip{background:var(--c-green);border-color:var(--c-green);color:#fff}
.chipopt:focus-visible + .chip,.chips__toggle:focus-visible + .chip{box-shadow:var(--ring)}
.chip--more{background:transparent;border-style:dashed;color:var(--c-navy-700)}
.chip--more::after{content:" +";font-weight:800;margin-left:.15em}
.chips__more{display:none;flex-wrap:wrap;gap:.5rem;width:100%}
.chips__toggle:checked ~ .chips__more{display:flex}
.chips__toggle:checked + .chip--more{background:var(--c-cream);border-style:solid;color:var(--c-text)}
.chips__toggle:checked + .chip--more::after{content:" \2212"}

/* mobile: calculator first (above the fold), supporting copy after */
@media(max-width:980px){
  .hero--home .hero__inner{display:flex;flex-direction:column;grid-template-columns:none;gap:1.1rem}
  .hero--home .hero__lead{order:1;max-width:none;width:100%}
  .hero--home .calc{order:2;max-width:none;width:100%}
  .hero--home .hero__more{order:3;max-width:none;width:100%}
}

/* phone: compress the lead so the first calculator step clears the fold.
   The sub + pills only repeat what the calculator already says, so on
   phones they go; the trust line stays as the proof line under the card. */
@media(max-width:760px){
  .hero--home{padding-top:1.3rem}
  .hero--home .eyebrow{display:none}
  /* balance minimises the longest line, which on a phone strands "translation,"
     alone on a short middle line. pretty optimises the break instead and keeps
     the short line last, where a short line belongs. Measured 238/133/214 ->
     238/240/106 at 320px. */
  .hero--home .hero__title{font-size:1.6rem;line-height:1.22;letter-spacing:-.01em;text-wrap:pretty}
  /* This pill is a link, so it needs a real 44px touch target. At .42rem padding it
     measured 34px on a 375px viewport. A pseudo-element only extended the tap area
     upward, because the calculator that follows in the DOM paints over its lower
     half, so the padding is made real instead. */
  .hero--home .hero__guarantee{margin-top:.7rem;font-size:.92rem;padding:.72rem .9rem;min-height:44px}
  .hero--home .hero__guarantee svg{width:17px;height:17px}
  .hero--home .hero__more .hero__sub,
  .hero--home .hero__more .hero__pills{display:none}
  .hero--home .hero__more .hero__trust{text-align:center;font-size:.84rem;margin-top:0}
  .hero--home .calc__title{font-size:1.18rem}
  .calc__anchor{display:none}  /* the price anchor lives in the step line on phones */
  .calc__head{padding:1.05rem 1.15rem .85rem}
  .calc__body{padding:1.05rem 1.15rem .3rem}
  .calc__summary{padding:1.05rem 1.15rem 1.3rem}
  .field{margin-bottom:1rem}
  /* even 2-column chip grid instead of ragged wrapping */
  .chips{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
  .chip{justify-content:center;text-align:center;padding:.62rem .5rem;font-size:.84rem}
  .chips .chip{min-height:44px;box-sizing:border-box}
  .chips__more{display:none;grid-column:1 / -1;grid-template-columns:1fr 1fr;gap:.5rem}
  .chips__toggle:checked ~ .chips__more{display:grid}
}

/* reduced motion */
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* ---------------------------------------------------------------
   PROSE POLISH (privacy and other long-form pages)
   --------------------------------------------------------------- */
/* Section headings inside long-form prose. These are h2 so the outline never
   skips a level under the page h1. :not(.section-title) keeps this from
   overriding the big section heading used on shorter pages like /contact/. */
.prose-section h2:not(.section-title){font-size:1.45rem;margin:2.2rem 0 .6rem;color:var(--c-navy-deep)}
.prose-section h2:not(.section-title):first-child{margin-top:0}
/* Blog posts only: centered, larger, bolder section headers for editorial rhythm.
   Body paragraphs stay left-aligned. Scoped to .prose-section--blog so guide pages are unaffected. */
.prose-section--blog h2:not(.section-title){text-align:center;font-size:clamp(1.6rem,2.6vw,2.05rem);font-weight:700;margin:2.7rem 0 .7rem}
.prose-section h3{font-size:1.3rem;margin:2rem 0 .6rem;color:var(--c-navy-deep)}
.prose-section h3:first-child{margin-top:0}
.prose-section ul{margin:0 0 1.1rem;padding-left:1.2rem;color:var(--c-prose);font-size:1.05rem}
.prose-section li{margin:.35rem 0}
.privacy__updated{color:#6b7a6a;font-size:.95rem;margin-top:2rem}

/* ===============================================================
   CARTORIO THEME, baked in as the site's design (2026-07-14).
   Was concepts/theme-1.css layered as an overlay; folded in here
   so the live site IS the notary green + parchment + gold seal look.
   =============================================================== */
/* =========================================================
   CONCEPT 1 "CARTORIO" , notary heritage
   Bottle green + parchment + gold seal. EB Garamond display.
   Conversion angle: official-document authority (Trust & Authority).
   Layered AFTER styles.css, overrides only.
   ========================================================= */
:root{
  --c-navy:#14532D;
  --c-navy-deep:#0E3B20;
  --c-navy-700:var(--c-green-mid);
  --c-gold:#C9962E;
  --c-gold-dark:#8F6714; /* deep bronze: 4.68:1 on cream, so gold-family TEXT passes AA at any size */
  --c-green:#14532D;
  --c-green-soft:#EAF2E4;
  --c-cream:#FAF5E9;
  --c-cream-2:#F1E7CF;
  --c-text:#22301F;
  /* Was #5F6B54: 5.56:1 on paper, technically AA but a low-saturation olive that
     reads washed out at the 14.7px the checklist result columns use. #4C5643 is
     the same hue darkened to 7.61:1 (AAA) on paper and cream, 6.74:1 on green-soft,
     while staying 1.8:1 apart from --c-text so muted still reads as secondary. */
  --c-muted:#4C5643;
  --c-border:#E0D5B8;
  --c-border-cool:#E0D5B8;
  /* headings stay on the site's Fraunces so the hero is formatted exactly like the
     original (same size, weight, tracking, line breaks); only the palette changes here. */
  --r-sm:6px; --r-md:9px; --r-lg:14px; --r-xl:18px;
}
.hero__bg{background:
  radial-gradient(1100px 500px at 80% -12%, rgba(201,150,46,.25), transparent 60%),
  radial-gradient(900px 600px at -6% 112%, rgba(20,83,45,.12), transparent 55%),
  linear-gradient(180deg,#FFFDF6 0%,var(--c-cream) 100%)}
/* USCIS keeps the base bold-gold emphasis; no theme override needed */
/* eyebrow = notary stamp */
.eyebrow{border-radius:4px;border:1px dashed rgba(168,122,31,.55);background:rgba(201,150,46,.08);color:var(--c-gold-dark)}
.eyebrow--gold{border-color:rgba(168,122,31,.55);background:rgba(201,150,46,.08)}
.eyebrow::before{border-radius:1px}
/* double rule, like a certificate head */
.calc::before{height:7px;background:
  linear-gradient(180deg,var(--c-gold) 0 2px,transparent 2px 5px,var(--c-gold) 5px 7px)}
.calc{border-color:#D8C89F}
.calc__head{background:linear-gradient(180deg,#FFFDF4,#fff)}
.truststrip{background:linear-gradient(90deg,var(--c-green-night),var(--c-green-ink) 45%,var(--c-green-deep) 100%)}
.truststrip::before{background:linear-gradient(90deg,transparent,rgba(201,150,46,.6) 30%,rgba(201,150,46,.6) 70%,transparent)}
.trust__item--badge{border-color:rgba(201,150,46,.34)}
.trust__ic{background:rgba(201,150,46,.18);color:#E8A13C}
.step__ic{background:linear-gradient(160deg,var(--c-green-mid),var(--c-green-ink))}
.step__num{background:linear-gradient(180deg,var(--c-gold-mark),#A87A1F)}
.fstep__n{background:linear-gradient(180deg,var(--c-gold-mark),#A87A1F)}
.brandcard{background:
  radial-gradient(120% 90% at 85% -10%, rgba(201,150,46,.35), transparent 55%),
  radial-gradient(100% 80% at 0% 112%, rgba(28,107,60,.30), transparent 55%),
  linear-gradient(160deg,var(--c-green-mid) 0%,var(--c-green-deep) 45%,var(--c-green-ink) 100%)}
.brandcard::after{border-color:rgba(250,245,233,.22)}
.guarantee{background:linear-gradient(135deg,var(--c-green-deep) 0%,var(--c-green-ink) 100%)}
.finalcta{background:linear-gradient(135deg,var(--c-green-mid) 0%,var(--c-green-deep) 40%,var(--c-green-ink) 100%)}
.site-footer{background:var(--c-green-night)}
.site-footer::before{background:linear-gradient(90deg,var(--c-gold) 0%,var(--c-gold-mark) 40%,var(--c-green-mid) 100%)}
.pricerow--head{background:linear-gradient(90deg,var(--c-green-night),var(--c-green-ink) 60%,var(--c-green-deep))}
.doc__seal{border-color:var(--c-gold);color:var(--c-gold-dark);background:rgba(201,150,46,.1)}
/* .doccard__ic tile tint removed: the mini document illustrations carry their own colors */
.pagehero{background:
  radial-gradient(1100px 480px at 80% -14%, rgba(201,150,46,.2), transparent 60%),
  radial-gradient(800px 520px at -8% 118%, rgba(20,83,45,.1), transparent 55%),
  linear-gradient(180deg,#FFFDF6,var(--c-cream))}


/* hardening: no sideways scroll ever; long Portuguese words wrap instead of overflowing */
html,body{overflow-x:clip}
h1,h2,h3,.pagehero__title,.section-title{overflow-wrap:break-word}

/* sample-translation page: annotated mock of a delivered certified translation */
.sampledoc{position:relative;background:var(--c-paper);border:1px solid var(--c-border);border-radius:10px;padding:1.8rem 1.6rem;margin:1.4rem 0;box-shadow:0 10px 28px rgba(14,58,92,.08);overflow:hidden}
.sampledoc::before{content:attr(data-watermark);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:clamp(3rem,9vw,5.2rem);font-weight:700;color:rgba(30,45,56,.06);transform:rotate(-24deg);pointer-events:none;letter-spacing:.2em}
.sampledoc__tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--c-gold-dark);border:1px solid var(--c-gold-soft);border-radius:99px;padding:.25rem .7rem;margin-bottom:.9rem;background:var(--c-cream)}
.sampledoc__title{font-family:var(--font-display);font-size:1.35rem;color:var(--c-navy-deep);margin:0 0 .15rem}
.sampledoc__sub{color:var(--c-muted);font-size:.95rem;margin:0 0 1.1rem}
.sampledoc__row{display:grid;grid-template-columns:minmax(120px,38%) 1fr;gap:.4rem 1rem;padding:.5rem 0;border-bottom:1px dashed var(--c-border);font-size:.97rem}
.sampledoc__row:last-of-type{border-bottom:0}
.sampledoc__label{color:var(--c-muted);font-size:.85rem;letter-spacing:.02em}
.sampledoc__value{color:var(--c-text)}
.sampledoc__note{font-style:italic;color:var(--c-prose)}
/* Specimen signature. Sits above the dashed row rule so it reads as ink on a line.
   Deliberately in the navy ink colour, never black, so it does not read as a scan. */
/* Fixed width plus max-width:100%, rather than a percentage. The SVG sits in a 1fr grid
   track, where a percentage width depends on a track that is itself sizing to content;
   a px basis avoids relying on how that resolves, and max-width keeps it responsive. */
.coa-sig{display:block;width:230px;max-width:100%;height:auto;color:var(--c-navy-deep);margin:-.15rem 0 -.5rem}
.sampledoc__cap{margin:1rem 0 0;padding-top:.85rem;border-top:1px dashed var(--c-border);
  font-size:.82rem;line-height:1.5;color:var(--c-muted);font-style:normal}
.sampledoc__mark{display:inline-flex;align-items:center;justify-content:center;width:1.35rem;height:1.35rem;border-radius:50%;background:var(--c-gold);color:#fff;font-size:.78rem;font-weight:700;margin-left:.45rem;flex:none;font-style:normal}
.samplekey{margin:1rem 0 0;padding-left:0;list-style:none}
.samplekey li{display:flex;gap:.6rem;align-items:flex-start;margin:.55rem 0;font-size:.97rem}
.samplekey .sampledoc__mark{margin-left:0;margin-top:.15rem}
@media (max-width:560px){.sampledoc__row{grid-template-columns:1fr;gap:.1rem}.sampledoc{padding:1.3rem 1.05rem}}

/* ---------- false friends reference (/tools/portuguese-english-false-friends/) ---------- */
.ff__cta-lead{font-family:var(--font-display);font-weight:600;color:var(--c-navy-deep);font-size:1.15rem;margin:1.2rem 0 .1rem}
.ff__cta-note{color:var(--c-muted);font-size:.9rem;align-self:center}
/* Both of these live in the credits block that CLOSES the page, not above the content.
   Byline first, then the stat line, then the two citation lines, so the order is the
   reverse of what it was when they sat under the H1 and the margins swap with it. */
.ff__byline{color:var(--c-prose);font-size:.93rem;margin:0 0 .5rem;max-width:72ch}
.ff__statline{color:var(--c-muted);font-size:.93rem;margin:0 0 .9rem}
/* The author name must READ as a link. Sitewide `a{text-decoration:none}` left it at
   1.10:1 against the byline text, so colour alone carried it: invisible to a reader and
   a WCAG 1.4.1 failure. The click that matters here is a librarian or journalist
   checking the author is a real person before linking this page, so the affordance IS
   the feature, not a detail. An underline satisfies 1.4.1 whatever the colour does. */
.ff__byline a{text-decoration:underline;text-underline-offset:2px;font-weight:600}
.ff__cite{color:var(--c-muted);font-size:.9rem;font-style:italic}
.ff__row{content-visibility:auto;contain-intrinsic-size:auto 120px}
.ff__h2{font-family:var(--font-display);font-size:1.45rem;color:var(--c-navy-deep);margin:1.6rem 0 .8rem}
/* The section used to open with the stat line and byline, which carried no top margin,
   so the section padding alone set the gap under the hero. Now the first H2 opens it and
   its 1.6rem would stack on that padding. Kill the top margin on the first block only. */
.ff .container>.ff__h2:first-child{margin-top:0}
.ffhl{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin:0 0 1.8rem}
.ffhl__card{display:block;background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-md);padding:.9rem 1rem;text-decoration:none}
.ffhl__card:hover{border-color:var(--c-gold)}
.ffhl__pair{display:block;color:var(--c-navy-deep);margin-bottom:.25rem}
/* Same marks as the table rows: the X sits on the wrong equation ("prejudice =
   prejuízo"), the check on the correct translation underneath. */
.ffhl__pair::before{content:"\2717";color:var(--c-red);font-weight:700;margin-right:.35em}
.ffhl__fix{display:block;margin-top:.45rem;font-size:.9rem;font-weight:700;color:var(--c-green-ink)}
.ffhl__fix::before{content:"\2713";color:var(--c-green-mid);margin-right:.35em}
.ffhl__why{display:block;color:var(--c-prose);font-size:.9rem}
/* The consequence line. Separated by a rule and set in the correction red so an
   attorney scanning the grid reads the cost first and the definitions second. */
.ffhl__cost{display:block;margin-top:.55rem;padding-top:.55rem;border-top:1px solid var(--c-border);
  color:var(--c-red-deep);font-size:.88rem;font-weight:600}
.ff__jumpline{margin:-1rem 0 1.8rem}
.ff__controls{display:flex;flex-wrap:wrap;gap:1rem 1.4rem;align-items:flex-end;margin:1.4rem 0 .5rem}
.ff__searchwrap{flex:1 1 260px;max-width:420px}
.ff__search{width:100%;padding:.65rem .85rem;border:1px solid var(--c-border);border-radius:var(--r-md);font:inherit;font-size:1rem;background:var(--c-paper);color:var(--c-text)}
.ff__search:focus-visible{outline:none;box-shadow:var(--ring);border-color:var(--c-gold)}
.ffchip{display:inline-flex;align-items:center;font-weight:700;font-size:.88rem;line-height:1;padding:.55rem .8rem;border:1px solid var(--c-border);border-radius:999px;background:var(--c-paper);color:var(--c-navy-700);cursor:pointer}
.ffchip:hover{border-color:var(--c-gold)}
.ffchip:focus-visible{outline:none;box-shadow:var(--ring)}
.ffchip.is-on{background:var(--c-green);border-color:var(--c-green);color:#fff}
.ffchip--sev.is-on{background:var(--c-gold-dark);border-color:var(--c-gold-dark)}
.ff__count{color:var(--c-muted);font-size:.9rem;margin:.2rem 0 0;flex-basis:100%}
.ff__az{display:flex;flex-wrap:wrap;gap:.3rem;margin:.6rem 0 1rem}
.ff__az a{display:inline-flex;align-items:center;justify-content:center;min-width:1.9rem;padding:.3rem .35rem;border:1px solid var(--c-border);border-radius:var(--r-sm);text-decoration:none;font-size:.85rem;font-weight:700;color:var(--c-navy-700);background:var(--c-paper)}
.ff__az a:hover{border-color:var(--c-gold);color:var(--c-navy-deep)}
.ff-wrap{overflow-x:auto;margin:0 0 1.5rem}
.fftable{width:100%;border-collapse:collapse;background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-md);overflow:hidden}
.fftable th,.fftable td{padding:.75rem .9rem;text-align:left;border-bottom:1px solid var(--c-border);vertical-align:top;font-size:.95rem}
.fftable thead th{background:var(--c-cream-2);font-family:var(--font-display);font-weight:600;color:var(--c-navy-deep)}
.fftable [hidden]{display:none!important}
.ff__letter th{background:var(--c-cream-2);font-family:var(--font-display);font-weight:600;font-size:1.05rem;color:var(--c-navy-deep);padding:.5rem .9rem}
.ff__word{display:block;font-weight:700;color:var(--c-navy-deep)}
.ff__gloss{display:block;color:var(--c-prose);font-size:.92rem;margin-top:.15rem}
/* Every cell reads trap then solution, and the two have to be tellable apart at
   a glance on a 763-row table. The trap is struck through and greyed so it is
   visibly the thing NOT to write; the solution is red and bold because that is
   the one line someone came here for. Red is labelled "Correct" so the colour
   reads as "look here", not "this is the error".
   Contrast on --c-paper: trap 5.4:1, label 8.8:1, solution 6.4:1. */
.ff__trap{display:block;color:var(--c-muted);font-size:.88rem;margin-top:.25rem}
.ff__trap s{text-decoration-thickness:1.5px}
.ff__fix{display:block;font-size:.9rem;margin-top:.1rem}
.ff__fixlab{font-weight:700;color:var(--c-green-mid)}
.ff__fix em{font-style:normal;font-weight:700;color:var(--c-green-ink)}
/* The marks. CSS ::before, not markup: 1526 inline icons would add real weight
   to a page already at 1.4MB, and a glyph scales with its text for free. The
   words "Not" and "Correct" carry the same meaning, so the glyph is redundant
   for a screen reader rather than load-bearing. */
.ff__trap::before{content:"\2717";color:var(--c-red);font-weight:700;margin-right:.35em}
.ff__fix::before{content:"\2713";color:var(--c-green-mid);font-weight:700;margin-right:.35em}
/* "Not always" cells: the lookalike IS one of the valid translations, so it gets
   a warning, NOT a red X, and is emphasised rather than struck. A hard X on a
   word the green line then recommends is the same contradiction that shipped on
   365 of 1526 cells before the partial-overlap guard. Must stay AFTER the rule
   above: equal specificity, so source order decides. */
.ff__trap--partial::before{content:"!";color:var(--c-amber-deep);font-weight:800;margin-right:.55em}
.ff__trap--partial em{font-style:normal;font-weight:600;color:var(--c-text)}
.ff__badge{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:.2rem .55rem;border-radius:999px;margin:0 .35rem .35rem 0}
.ff__badge--crit{background:var(--c-gold-dark);color:#fff}
.ff__badge--part{background:var(--c-cream-2);color:var(--c-navy-700);border:1px solid var(--c-border)}
.ff__note{display:block;color:var(--c-prose);font-size:.92rem}
.ff__plink{float:right;margin-left:.6rem;color:var(--c-border);text-decoration:none;font-weight:700;font-size:.95rem;line-height:1}
.ff__plink:hover,.ff__plink:focus-visible{color:var(--c-gold-dark)}
@media (max-width:760px){
  .ffhl{grid-template-columns:1fr}
  .fftable thead{display:none}
  .fftable,.fftable tbody,.fftable tr,.fftable th,.fftable td{display:block}
  .fftable{border:0;background:transparent}
  .ff__row{border:1px solid var(--c-border);border-radius:var(--r-md);margin:.7rem 0;padding:.85rem .95rem;background:var(--c-paper)}
  .fftable td{border:0;padding:.3rem 0}
  .ff__letter th{background:transparent;border:0;padding:.9rem 0 .1rem;font-size:1.15rem}
}

/* ===== sharing ==========================================================
   One collapsed Share control instead of a visible row of eight buttons.
   The popover is the desktop fallback only: where navigator.share exists the
   trigger calls the native sheet and this menu never opens. ================ */
/* Top padding is 0 on purpose: the section above already ends with its own bottom
   padding, and stacking both put 48px of dead cream above the bar. */
.sharebar{padding:0 0 1.4rem}
.sharebar__inner{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;
  background:var(--c-paper);border:1px solid var(--c-border);border-radius:var(--r-lg);padding:.85rem 1.25rem}
.sharebar__prompt{flex:1 1 15rem;margin:0;font-family:var(--font-display);font-size:1.15rem;color:var(--c-navy)}
/* Trailing disclaimer: same container as the bar, so both edges line up. */
.sharebar__note{margin:.55rem auto 0;font-size:.86rem;line-height:1.5;color:var(--c-muted)}
.sharebar__wrap{position:relative}
.sharebar__trigger,.sharebar__print{min-height:44px}
.sharemenu{position:absolute;right:0;top:calc(100% + .5rem);z-index:40;min-width:15.5rem;
  background:var(--c-white);border:1px solid var(--c-border);border-radius:var(--r-md);
  padding:.35rem;box-shadow:var(--shadow-md)}
.sharemenu[hidden]{display:none}
.shareitem{display:flex;align-items:center;gap:.7rem;width:100%;min-height:44px;
  padding:.55rem .7rem;border:0;border-radius:var(--r-sm);background:transparent;
  font:inherit;font-size:.98rem;color:var(--c-text);text-align:left;text-decoration:none;cursor:pointer}
.shareitem:hover,.shareitem:focus-visible{background:var(--c-green-soft)}
.shareitem .ic{width:20px;height:20px;flex:none;fill:var(--c-navy)}
.shareitem--embed{color:var(--c-gold-dark);font-weight:600}
.shareitem--embed .ic{fill:var(--c-gold-dark)}
.sharemenu__sep{display:block;height:1px;background:var(--c-border);margin:.35rem .6rem}
.share-toast{max-width:var(--container);margin:.7rem auto 0;padding:0 1.25rem;
  color:var(--c-green-mid);font-size:.95rem;font-weight:600}
.share-toast[hidden]{display:none}
.embedbox{max-width:var(--container);margin:.9rem auto 0;background:var(--c-white);
  border:1px solid var(--c-border);border-radius:var(--r-md);padding:1.1rem 1.25rem}
.embedbox[hidden]{display:none}
.embedbox__h{font-family:var(--font-display);font-size:1.15rem;color:var(--c-navy);margin:0 0 .2rem}
.embedbox__p{margin:0 0 .8rem;color:var(--c-muted);font-size:.95rem}
.embedbox__row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}
.embedbox__toggle{background:none;border:0;padding:0;font:inherit;font-size:.95rem;
  color:var(--c-gold-dark);text-decoration:underline;cursor:pointer;min-height:44px}
.embedbox__code{margin:.75rem 0 0;background:var(--c-green-ink);color:#BFE3CE;
  border-radius:var(--r-sm);padding:.8rem 1rem;font-size:.82rem;line-height:1.6;
  white-space:pre-wrap;word-break:break-all;overflow-x:auto}
.embedbox__code[hidden]{display:none}
/* One copy control per false-friend row: the pair plus its deep link, so a
   translator pasting a pair carries the attribution with it. Labelled text, not
   a bare icon, because an unlabelled glyph repeated 763 times is a guessing game. */
.ff__copy{float:right;margin-left:.5rem;display:inline-flex;align-items:center;gap:.25rem;
  border:1px solid var(--c-border);border-radius:var(--r-sm);background:var(--c-white);
  padding:.2rem .45rem;font:inherit;font-size:.75rem;color:var(--c-gold-dark);cursor:pointer}
.ff__copy:hover,.ff__copy:focus-visible{background:var(--c-green-soft);border-color:var(--c-gold-dark)}
.ff__copy .ic{width:13px;height:13px;fill:currentColor}
@media (max-width:760px){
  .sharebar__inner{gap:.7rem}
  .sharebar__prompt{flex:1 1 100%;font-size:1.1rem}
  .sharebar__print,.sharebar__wrap,.sharebar__wrap .btn{width:100%}
  /* Right-anchoring a 15.5rem menu inside a full-width button overflows a 320px
     screen, so on phones it spans the trigger instead. */
  .sharemenu{left:0;right:0;min-width:0}
}
/* ===== print: the checklist is meant to be ticked off on paper =============
   Everything that is navigation, sales, or sharing comes out; the generated
   checklist and the brand line stay. Browsers reach Save as PDF through this
   same stylesheet, so one rule covers both. ================================= */
@media print{
  .site-header,.site-footer,.fab,.fab-wa,.sharebar,.finalcta,.truststrip,
  .calcwrap,.uploadsection,.breadcrumbs,.ckform__hint,#calculator{display:none !important}
  html,body{background:#fff;color:#000}
  .ck__results,.ckpol{break-inside:avoid}
  .ckitem{break-inside:avoid;page-break-inside:avoid}
  a[href]:after{content:""}
  .printfoot{display:block !important;margin-top:1.2rem;padding-top:.6rem;
    border-top:1px solid #999;font-size:.8rem;color:#333}
}
.printfoot{display:none}

/* The school-finder hint is the instruction that makes the field usable, so it
   reads as instruction weight, not as fine print. Scoped by id: the sibling
   .ckuni__hint is the copyright line and must stay quiet. */
#ckUniHint{font-weight:600;color:var(--c-prose)}

/* Hero that must share a left edge with a full-width body (the false-friends list
   is a 1180px table). Without this the hero centres at 840 and the body at 1180,
   so every hero line starts 170px right of the content under it. Reading measure
   is held on the paragraph, not on the column. */
.pagehero--wide .pagehero__inner{max-width:var(--container)}
.pagehero--wide .pagehero__sub{max-width:70ch}
/* The hero already pads its own bottom; the section below opened with another 80px,
   which stacked into 102px of empty cream between the CTA line and the first text. */
.pagehero--wide + .prose-section{padding-top:clamp(1.6rem,2.4vw,2.4rem)}
/* --c-gold-dark (#CC861F) is 2.96:1 on --c-paper and fails AA at this size and weight.
   Tolerable when this was one of three CTAs; not now that it is the only one on the page.
   --c-amber-deep (#96620F) is 5.11:1 and already exists in the palette for this reason. */
.ff__cta-lead a{color:var(--c-amber-deep);text-decoration:underline;text-underline-offset:2px}
/* Closing CTA, replacing the removed gold finalcta band. Centred and given air so it
   reads as a way out of the page rather than a pitch at the end of it. */
.ff__cta-end{margin:.4rem 0 0;text-align:center}

/* ---------------------------------------------------------------- /verify/
   Certificate check form and its result panel. Three result states, each carrying its
   meaning in colour AND in a worded title, never colour alone, so the answer survives
   greyscale printing and colour-blind readers. Uses palette variables only, no new
   colours. Board: certificate verification, 2026-08-28. */
.verifyform{margin:0 0 1.1rem}
.verifyform__label{display:block;font-weight:700;color:var(--c-text);margin:0 0 .4rem}
.verifyform__row{display:flex;gap:.6rem;flex-wrap:wrap}
.verifyform__input{flex:1 1 15rem;min-width:0;padding:.85rem 1rem;font-size:1.05rem;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;
  text-transform:uppercase;color:var(--c-text);background:var(--c-white);
  border:1.5px solid var(--c-border);border-radius:8px}
.verifyform__input:focus{outline:3px solid var(--c-gold);outline-offset:1px;
  border-color:var(--c-gold-dark)}
.verifyform__input::placeholder{color:var(--c-muted);opacity:.7;letter-spacing:.06em}
.verifyform__hint{margin:.5rem 0 0;font-size:.92rem;color:var(--c-muted)}

.verifybox{margin:0 0 1.6rem;padding:1rem 1.15rem;border-radius:8px;
  border-left:4px solid var(--c-muted);background:var(--c-cream)}
.verifybox__title{margin:0;font-weight:700;color:var(--c-text)}
.verifybox__detail{margin:.35rem 0 0;color:var(--c-prose)}
.verifybox--ok{border-left-color:var(--c-green);background:var(--c-green-soft)}
.verifybox--ok .verifybox__title{color:var(--c-green-deep)}
.verifybox--bad{border-left-color:var(--c-red);background:#FDF1F0}
.verifybox--bad .verifybox__title{color:var(--c-red-deep)}
.verifybox--warn{border-left-color:var(--c-gold-dark);background:var(--c-paper-warm)}
.verifybox--warn .verifybox__title{color:var(--c-amber-deep)}

/* ---------- one client review, set inline as a pull quote ------------------
   One voice next to the claim it corroborates, not a grid of cards: a row of
   testimonials reads as a widget and gets scrolled past. Presentation only —
   there is deliberately NO review structured data on this site (see build.py). */
.revq{padding:2.2rem 0}
.revq__fig{
  margin:0;padding:1.5rem 1.7rem;background:var(--c-paper);
  border:1px solid var(--c-border);border-left:4px solid var(--c-gold);
  border-radius:0 var(--r-lg) var(--r-lg) 0;
  display:flex;flex-direction:column;gap:.85rem;
}
.revstars{display:flex;gap:2px;line-height:0}
.revstar{width:15px;height:15px;fill:var(--c-star);flex:none}
.revq__q{
  margin:0;font-family:'Playfair Display',Georgia,serif;
  font-size:1.16rem;line-height:1.55;color:var(--c-green-ink);
}
.revq__by{display:flex;flex-wrap:wrap;align-items:baseline;gap:.15rem .6rem}
.revq__name{font-weight:700;color:var(--c-green-deep);font-size:.92rem}
.revq__meta{color:var(--c-muted);font-size:.82rem}
.revq__note{flex-basis:100%;color:var(--c-muted);font-size:.76rem;font-style:italic}
@media (max-width:600px){
  .revq{padding:1.6rem 0}
  .revq__fig{padding:1.2rem 1.25rem}
  .revq__q{font-size:1.06rem}
}