/* ===== site_v11/marca/tokens.css (brand tokens, copied by build.py) ===== */
/* A Grande Famiglia - tokens v1.1 ("a quente"). Gerado por _fonte/logo_v11.py a partir das mesmas cores do v1.
   Nomes --agf-* = marca v1 (marca/tokens.css). Nomes curtos (--terracota, --f-titulo...) = site v1 (site/www/assets/style.css),
   para o CSS do v1 funcionar sem troca. Fontes: @import abaixo (caminho relativo a este arquivo). */

:root {
  /* marca v1 + passos v1.1 */
  --agf-terracota: #C8643B;
  --agf-creme: #F5EEE2;
  --agf-tinta: #1F2A1F;
  --agf-oliva: #5E6B4E;
  --agf-mostarda: #D9A53A;
  --agf-azulejo: #2F5D8C;
  --agf-goiaba: #E07A8B;
  --agf-papel: #FBF7EF;
  --agf-kraft: #D9C4A0;
  --agf-terracota-escuro: #9E4A2A;
  --agf-vinho: #8A3A45;
  --agf-oliva-claro: #A9B394;
  --agf-azulejo-claro: #C9D8E8;
  --agf-ouro: #B8862B;
  --agf-terracota-forte: #B0522D;
  --agf-oliva-escura: #4A563C;
  --agf-goiaba-escura: #A8495A;
  --agf-mostarda-escura: #7A5700;
  --agf-tinta-suave: #4A5248;
  --agf-fonte-titulo: 'Fraunces', 'DM Serif Display', Georgia, serif;
  --agf-fonte-mao: 'Caveat', 'Segoe Print', 'Bradley Hand', cursive;
  --agf-fonte-texto: 'Nunito Sans', 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
  --agf-sombra-papel: 0 6px 14px rgba(31,42,31,.18);
  --agf-sombra-recorte: 3px 4px 0 rgba(31,42,31,.25);
  --agf-sombra-flutuante: 0 18px 40px rgba(31,42,31,.25);
  --agf-sombra-cartao: 4px 4px 0 var(--agf-tinta);
  --agf-raio-papel: 4px; --agf-raio-cartao: 14px; --agf-raio-selo: 999px; --agf-raio-polaroid: 2px;
  /* inclinações (recortes e fitas levemente tortos; nunca mais que 6deg) */
  --agf-giro-1: -2deg; --agf-giro-2: 1.5deg; --agf-giro-3: -3.5deg; --agf-giro-4: 3deg; --agf-giro-max: 4deg;
  /* fita adesiva (washi): use como background */
  --agf-fita-mostarda: repeating-linear-gradient(45deg, rgba(217,165,58,.85) 0 8px, rgba(217,165,58,.6) 8px 16px);
  --agf-fita-goiaba: repeating-linear-gradient(45deg, rgba(224,122,139,.85) 0 8px, rgba(224,122,139,.6) 8px 16px);
  --agf-fita-azulejo: repeating-linear-gradient(45deg, rgba(47,93,140,.7) 0 8px, rgba(47,93,140,.5) 8px 16px);
  --agf-fita-oliva: repeating-linear-gradient(45deg, rgba(94,107,78,.75) 0 8px, rgba(94,107,78,.55) 8px 16px);
  --agf-fita-recorte: polygon(0 8%, 4% 0, 8% 10%, 12% 0, 88% 0, 92% 10%, 96% 0, 100% 8%, 100% 92%, 96% 100%, 92% 90%, 88% 100%, 12% 100%, 8% 90%, 4% 100%, 0 92%);
  /* papel com grão (texturas sem arquivo: ruído SVG embutido, ~0.5 KB) */
  --agf-grao-papel: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .45  0 0 0 0 .35  0 0 0 0 .2  0 0 0 .13 0'/></filter><rect width='300' height='300' filter='url(%23n)'/></svg>");
  --agf-grao-kraft: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .35  0 0 0 0 .25  0 0 0 0 .12  0 0 0 .22 0'/></filter><rect width='300' height='300' filter='url(%23n)'/></svg>");
  --agf-luz-papel: radial-gradient(ellipse at 30% 20%, rgba(255,255,255,.55), transparent 60%), radial-gradient(ellipse at 80% 90%, rgba(217,196,160,.35), transparent 55%);

  /* aliases do site v1 (site/www/assets/style.css) */
  --terracota: #C8643B; --terracota-escura: #9E4A2A; --terracota-forte: #B0522D;
  --oliva: #5E6B4E; --oliva-escura: #4A563C; --mostarda: #D9A53A; --mostarda-escura: #7A5700;
  --creme: #F5EEE2; --creme-2: #FBF7EF; --papel: #FBF7EF; --kraft: #D9C4A0; --vinho: #8A3A45;
  --tinta: #1F2A1F; --tinta-suave: #4A5248; --azulejo: #2F5D8C; --azulejo-claro: #C9D8E8;
  --goiaba: #E07A8B; --goiaba-escura: #A8495A; --ouro: #B8862B;
  --f-titulo: var(--agf-fonte-titulo); --f-mao: var(--agf-fonte-mao); --f-corpo: var(--agf-fonte-texto);
  --raio: 14px; --sombra: 0 2px 0 rgba(31,42,31,.08), 0 10px 24px -12px rgba(31,42,31,.35);
  --largura: 1120px; --gutter: 16px;
}
/* utilitários */
.agf-papel-tex { background-color: var(--agf-creme); background-image: var(--agf-grao-papel), var(--agf-luz-papel); }
.agf-kraft-tex { background-color: var(--agf-kraft); background-image: var(--agf-grao-kraft); }
.agf-fita { position: absolute; width: 110px; height: 28px; background: var(--agf-fita-mostarda); clip-path: var(--agf-fita-recorte); transform: rotate(-3deg); opacity: .9; }
.agf-recorte-sombra { box-shadow: var(--agf-sombra-recorte); }
.agf-titulo { font-family: var(--agf-fonte-titulo); font-weight: 900; line-height: 1; color: var(--agf-tinta); }
.agf-mao { font-family: var(--agf-fonte-mao); font-weight: 700; }
.agf-texto { font-family: var(--agf-fonte-texto); color: var(--agf-tinta); }

/* ===== site_v12/site/src/assets/tokens.css (site tokens: v1 palette + AA steps + roles) ===== */
/* =====================================================================
   A Grande Famiglia · site v1.1 "a quente" · site tokens (defaults)
   build.py writes www/assets/style.css = site_v11/marca/tokens.css (if present, @import stripped) + this file
   + src/assets/style.css. This file comes after the brand file on purpose: same v1 hex values, plus the site's
   own decisions (AA text steps, roles, smaller tilts under 600px) win.
   Palette = v1 (marca/tokens.json) + darker steps added for AA text. Every raw colour of the site lives here:
   components use these custom properties only.
   Contrast (WCAG 2.x, computed with site_v12/_tmp/contraste.py, not guessed):
     tinta on creme 12.9 · on papel 13.9 · on areia 11.9 · tinta-suave on creme 7.0 · on areia 6.4
     terracota-escuro on creme 5.25 · on papel 5.7 · on areia 4.8 · azulejo on creme 5.9 · on areia 5.5
     branco on terracota-escuro 6.1 · creme on tinta 12.9 · mostarda on tinta 6.7 · creme-suave on tinta 9.7
     tinta on mostarda 6.7 · tinta on goiaba 5.2 · creme on oliva 4.9 · creme on vinho 6.6 · creme on azulejo 5.9
     branco on whats 5.4 · mostarda-texto on creme 5.7
     13/10: creme on azulejo 5.94 (blue bands) · tinta on mostarda 6.67 (buttons on blue) · tinta on papel 13.9 (cards on blue)
     tinta on ouro 4.60 (Bodas series) · tinta on azulejo-medio 5.66 (Lira's house) · mostarda on azulejo 3.06 (never text)
   terracota (#C8643B) and goiaba never carry small text on light grounds (3.4–3.9): shadows, tape, dots only.
   ===================================================================== */
:root {
  /* ---- palette (v1 hue families) ---- */
  --agf-creme: #F5EEE2;
  --agf-papel: #FBF7EF;
  --agf-areia: #EFE4D2;
  --agf-kraft: #D9C4A0;
  --agf-branco: #FFFFFF;
  --agf-tinta: #1F2A1F;
  --agf-tinta-suave: #4A5248;
  --agf-terracota: #C8643B;
  --agf-terracota-escuro: #9E4A2A;
  --agf-oliva: #5E6B4E;
  --agf-oliva-escuro: #4A563C;
  --agf-mostarda: #D9A53A;
  --agf-mostarda-texto: #7A5700;
  --agf-azulejo: #2F5D8C;
  --agf-azulejo-escuro: #244A70;
  --agf-azulejo-claro: #C9D8E8;
  --agf-azulejo-medio: #7FA3C8;        /* 13/10: Lira's house (a lighter step of her father's azulejo); tinta on it 5.66 */
  --agf-mar: #EAF0F5;                  /* v1 map sea (decorative); tinta on it 12.97, azulejo 5.96 */
  --agf-terra: #E3D7BF;                /* v1 map continents (decorative); tinta on it 10.46 */
  --agf-goiaba: #E07A8B;
  --agf-goiaba-escuro: #A8404F;
  --agf-vinho: #8A3A45;
  --agf-ouro: #B8862B;
  --agf-creme-suave: #D9CFBD;          /* small text on tinta */
  --agf-linha: #E4D9C6;                /* hairlines on creme (decorative) */
  --agf-erro: #A3221B;
  --agf-erro-fundo: #FCE8E6;
  --agf-aviso-fundo: #FFF4D6;
  --agf-sucesso-fundo: #E3F1DA;
  --agf-whats: #157A3E;

  /* translucent tints (paper grain, tape, shadows, veils) */
  --agf-grao-1: rgba(31, 42, 31, .035);
  --agf-grao-2: rgba(200, 100, 59, .03);
  --agf-tracejado: rgba(31, 42, 31, .2);
  --agf-tracejado-escuro: rgba(245, 238, 226, .3);
  --agf-veu-creme: rgba(245, 238, 226, .97);
  --agf-sombra-suave: rgba(31, 42, 31, .35);
  --agf-fita-mostarda-1: rgba(217, 165, 58, .85);
  --agf-fita-mostarda-2: rgba(217, 165, 58, .6);
  --agf-fita-goiaba-1: rgba(224, 122, 139, .85);
  --agf-fita-goiaba-2: rgba(224, 122, 139, .6);
  --agf-fita-azulejo-1: rgba(47, 93, 140, .7);
  --agf-fita-azulejo-2: rgba(47, 93, 140, .5);
  --agf-fita-oliva-1: rgba(94, 107, 78, .75);
  --agf-fita-oliva-2: rgba(94, 107, 78, .55);
  --agf-listra-foto: rgba(47, 93, 140, .07);

  /* ---- branch colours (one family, one colour; v1 tokens) ---- */
  --agf-ramo-avos: #D9A53A;
  --agf-ramo-te: #8A3A45;
  --agf-ramo-dani: #2F5D8C;
  --agf-ramo-lira: #7FA3C8;
  --agf-ramo-fi: #C8643B;
  --agf-ramo-de: #E07A8B;
  --agf-ramo-ga: #5E6B4E;

  /* ---- site roles ---- */
  --r-fundo: var(--agf-creme);
  --r-fundo-cartao: var(--agf-papel);
  --r-fundo-alt: var(--agf-areia);
  --r-fundo-escuro: var(--agf-tinta);
  --r-texto: var(--agf-tinta);
  --r-texto-suave: var(--agf-tinta-suave);
  --r-texto-no-escuro: var(--agf-creme);
  --r-texto-suave-escuro: var(--agf-creme-suave);
  --r-link: var(--agf-azulejo);
  --r-link-hover: var(--agf-terracota-escuro);
  --r-link-no-escuro: var(--agf-mostarda);
  --r-foco: var(--agf-azulejo);
  --r-foco-no-escuro: var(--agf-mostarda);
  --r-mao: var(--agf-terracota-escuro);          /* Caveat notes and kickers on light grounds */
  --r-mao-no-escuro: var(--agf-mostarda);
  --r-botao-principal-bg: var(--agf-terracota-escuro);
  --r-botao-principal-fg: var(--agf-branco);
  --r-botao-depois-bg: var(--agf-papel);
  --r-botao-depois-fg: var(--agf-tinta);
  --r-sombra-dura: var(--agf-tinta);
  --r-campo-borda: var(--agf-tinta);
  --r-linha: var(--agf-linha);
  --r-erro: var(--agf-erro);
  --r-legenda-bg: var(--agf-mostarda);
  --r-legenda-fg: var(--agf-tinta);

  /* ---- type (self-hosted woff2 from site_v11/marca/fontes/; system fallbacks if missing) ---- */
  --agf-fonte-titulo: 'Fraunces', 'DM Serif Display', Georgia, 'Times New Roman', serif;
  --agf-fonte-mao: 'Caveat', 'Segoe Print', 'Bradley Hand', cursive;
  --agf-fonte-texto: 'Nunito Sans', 'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
  --agf-web-h1: clamp(2.1rem, 7vw, 3.8rem);
  --agf-web-h2: clamp(1.7rem, 5vw, 2.6rem);
  --agf-web-h3: clamp(1.25rem, 2.2vw, 1.45rem);
  --agf-web-lead: clamp(1.15rem, 1.6vw, 1.3rem);
  --agf-web-corpo: 1.125rem;
  --agf-web-pequeno: 1rem;
  --agf-web-etiqueta: 1.65rem;         /* Caveat kicker */
  --agf-web-botao: 1.0625rem;
  --agf-medida: 62ch;

  /* ---- space, shape, motion ---- */
  --agf-container: 1140px;
  --agf-gutter: 16px;
  --agf-secao: 56px;
  --agf-raio: 14px;
  --agf-raio-campo: 10px;
  --agf-raio-pilula: 999px;
  --agf-sombra-dura: 4px 4px 0 var(--r-sombra-dura);
  --agf-sombra-botao: 0 3px 0 var(--r-sombra-dura);
  --agf-sombra-papel: 0 2px 0 rgba(31, 42, 31, .08), 0 10px 24px -12px rgba(31, 42, 31, .35);
  --agf-sombra-flutuante: 0 18px 40px rgba(31, 42, 31, .25);
  --agf-giro-1: -2deg;
  --agf-giro-2: 1.5deg;
  --agf-giro-3: -1deg;
  --agf-foco: 3px;
  --agf-mov-rapido: 120ms;
  --agf-mov-normal: 220ms;
}
@media (min-width: 760px) {
  :root { --agf-gutter: 32px; --agf-secao: 80px; }
}
/* small screens: tilts get smaller so nothing pokes out at 375px */
@media (max-width: 599px) {
  :root { --agf-giro-1: -1deg; --agf-giro-2: .8deg; --agf-giro-3: -.6deg; }
}
@media (prefers-reduced-motion: reduce) {
  :root { --agf-mov-rapido: 0ms; --agf-mov-normal: 0ms; }
}

/* Series: .serie-<slug> sets --serie-bg / --serie-fg (AA pairs; diário uses the dark terracota step) */
.serie-diario-da-vila      { --serie-bg: var(--agf-terracota-escuro); --serie-fg: var(--agf-creme); --serie-acento: var(--agf-mostarda); }
.serie-conheca-a-famiglia  { --serie-bg: var(--agf-goiaba); --serie-fg: var(--agf-tinta); --serie-acento: var(--agf-creme); }
.serie-votacao-da-famiglia { --serie-bg: var(--agf-azulejo); --serie-fg: var(--agf-creme); --serie-acento: var(--agf-mostarda); }
.serie-bolao-da-obra       { --serie-bg: var(--agf-mostarda); --serie-fg: var(--agf-tinta); --serie-acento: var(--agf-terracota); }
.serie-o-vo-avalia         { --serie-bg: var(--agf-oliva); --serie-fg: var(--agf-creme); --serie-acento: var(--agf-mostarda); }
.serie-sexta-na-vila       { --serie-bg: var(--agf-vinho); --serie-fg: var(--agf-creme); --serie-acento: var(--agf-mostarda); }
.serie-3-paises-1-familia  { --serie-bg: var(--agf-creme); --serie-fg: var(--agf-tinta); --serie-acento: var(--agf-azulejo); }
.serie-respondendo-voces   { --serie-bg: var(--agf-areia); --serie-fg: var(--agf-tinta); --serie-acento: var(--agf-terracota); }
.serie-bodas-de-ouro       { --serie-bg: var(--agf-ouro); --serie-fg: var(--agf-tinta); --serie-acento: var(--agf-creme); } /* 13/10 ouro, not tinta: tinta on ouro 4.60 */
.serie-como-tudo-comecou   { --serie-bg: var(--agf-kraft); --serie-fg: var(--agf-tinta); --serie-acento: var(--agf-terracota-escuro); } /* 16/10: the pre-season stories, a neutral label (not a series) */

/* Branches: .ramo-<slug> sets --ramo (the branch colour: tape, frames, dots) and an AA text pair --ramo-bg/--ramo-fg */
.ramo-avos { --ramo: var(--agf-ramo-avos); --ramo-bg: var(--agf-mostarda); --ramo-fg: var(--agf-tinta); }
.ramo-te   { --ramo: var(--agf-ramo-te);   --ramo-bg: var(--agf-vinho); --ramo-fg: var(--agf-creme); }
.ramo-dani { --ramo: var(--agf-ramo-dani); --ramo-bg: var(--agf-azulejo); --ramo-fg: var(--agf-creme); }
/* 13/10 the Lira + Felipe branch: mid azulejo, tinta text 5.66:1; vs Dani's azulejo 2.6:1, vs creme 2.28:1 (dashed border, decorative) */
.ramo-lira { --ramo: var(--agf-ramo-lira); --ramo-bg: var(--agf-azulejo-medio); --ramo-fg: var(--agf-tinta); }
.ramo-fi   { --ramo: var(--agf-ramo-fi);   --ramo-bg: var(--agf-terracota-escuro); --ramo-fg: var(--agf-creme); }
.ramo-de   { --ramo: var(--agf-ramo-de);   --ramo-bg: var(--agf-goiaba); --ramo-fg: var(--agf-tinta); }
.ramo-ga   { --ramo: var(--agf-ramo-ga);   --ramo-bg: var(--agf-oliva); --ramo-fg: var(--agf-creme); }

/* ===== site_v12/site/src/assets/style.css ===== */
/* =====================================================================
   A Grande Famiglia · site v1.1 "a quente" · components
   = site v2's flow and markup, wearing v1's scrapbook look (DECISIONS 12/10).
   build.py writes www/assets/style.css = site_v11/marca/tokens.css (if present) + src/assets/tokens.css
   + this file. Components use custom properties only (no raw colour here; see tokens.css).
   Kept from v1: Caveat handwriting for kickers, notes and labels; hard offset shadows; tilted cards and
   polaroids; washi tape; torn paper edges; paper grain; warm v1 colours; BR <-> PT dotted flight line.
   Tidied for reading only: Nunito Sans body at 18px/1.65, solid obvious buttons with a focus ring,
   AA text contrast, smaller tilts under 600px, no horizontal scroll at 375px, reduced motion respected.
   ===================================================================== */

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 96px; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
@media (max-width: 1259px) { html:not(.js) { scroll-padding-top: 168px; } }
body {
  margin: 0; color: var(--r-texto);
  font-family: var(--agf-fonte-texto); font-size: var(--agf-web-corpo); line-height: 1.65;
  background-color: var(--r-fundo);
  /* paper grain, pure CSS (v1) */
  background-image: radial-gradient(var(--agf-grao-1) 1px, transparent 1px), radial-gradient(var(--agf-grao-2) 1px, transparent 1px);
  background-size: 22px 22px, 31px 31px; background-position: 0 0, 11px 7px;
  overflow-x: hidden;
}
main { overflow-x: clip; }
img, svg { max-width: 100%; height: auto; display: block; }
.ico { width: 1.2em; height: 1.2em; display: inline-block; vertical-align: -.22em; flex: none; }
a { color: var(--r-link); text-underline-offset: .18em; text-decoration-thickness: .08em; }
a:hover { color: var(--r-link-hover); text-decoration-thickness: .14em; }
:focus-visible { outline: var(--agf-foco) solid var(--r-foco); outline-offset: 3px; border-radius: 4px; }
main:focus { outline: none; }
h1, h2, h3, .h1, .h2, .h3 {
  font-family: var(--agf-fonte-titulo); font-weight: 700; line-height: 1.12; letter-spacing: -.01em;
  margin: 0 0 .5em; text-wrap: balance; color: inherit; font-optical-sizing: auto; overflow-wrap: break-word;
}
h1, .h1 { font-size: var(--agf-web-h1); }
h2, .h2 { font-size: var(--agf-web-h2); }
h3, .h3 { font-size: var(--agf-web-h3); line-height: 1.25; }
p, ul, ol, dl, figure { margin: 0 0 1em; }
figure { margin-left: 0; margin-right: 0; }
p, li { overflow-wrap: break-word; }
strong, b { font-weight: 800; }
small, .pequeno { font-size: var(--agf-web-pequeno); }
hr { border: 0; border-top: 3px dotted var(--agf-tracejado); margin: 40px 0; }
.lead { font-size: var(--agf-web-lead); line-height: 1.55; color: var(--r-texto); max-width: var(--agf-medida); }
.nw { white-space: nowrap; }
@media (max-width: 380px) { .heroi h1 .nw { white-space: normal; } }
/* home + EN home: the signature reads one item per line (22 personalidades / 5 famílias / 3 gerações / 1 vila em Portugal) */
#h-titulo .nw, #h-t .nw { display: block; white-space: nowrap; }
#h-titulo br, #h-t br { display: none; }
.ponto { color: var(--agf-terracota); }

/* ---------- helpers ---------- */
.container { width: 100%; max-width: var(--agf-container); margin: 0 auto; padding: 0 var(--agf-gutter); }
.estreito { max-width: 760px; }
.container.estreito { max-width: calc(760px + 2 * var(--agf-gutter)); }
.centro { text-align: center; }
.centro .lead, .centro.lead { margin-left: auto; margin-right: auto; }
.centro .botoes { justify-content: center; }
.mt1 { margin-top: 16px; } .mt2 { margin-top: 32px; } .mt3 { margin-top: 48px; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pular { position: fixed; left: -999px; top: 8px; z-index: 100; background: var(--agf-tinta); color: var(--agf-creme); padding: 10px 16px; border-radius: 8px; font-weight: 800; }
.pular:focus { left: 8px; color: var(--agf-creme); }
.hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
[hidden] { display: none !important; }
body.sem-pendencias .so-pendencia { display: none !important; }
.confirmar { display: inline-block; background: var(--agf-aviso-fundo); color: var(--agf-mostarda-texto); border: 1px dashed var(--agf-mostarda-texto); border-radius: 4px; font-weight: 800; font-size: .8em; padding: 0 6px; }
.agf-legenda { background: var(--r-legenda-bg); color: var(--r-legenda-fg); font-weight: 800; padding: .1em .45em; border-radius: 4px; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.dois { display: grid; gap: 36px; align-items: center; }
.dois > *, .grade > *, .heroi__grade > * { min-width: 0; }
@media (min-width: 900px) { .dois { grid-template-columns: 1fr 1fr; gap: 56px; } .dois--7-5 { grid-template-columns: 7fr 5fr; } .dois--5-7 { grid-template-columns: 5fr 7fr; } }

/* kicker: a handwritten note, slightly tilted (v1) */
.etiqueta {
  display: inline-block; margin: 0 0 .3em; font-family: var(--agf-fonte-mao); font-size: var(--agf-web-etiqueta);
  font-weight: 700; line-height: 1.1; color: var(--r-mao); transform: rotate(-2deg); transform-origin: 0 50%;
}
.etiqueta--serie { font-family: var(--agf-fonte-texto); font-size: .95rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--r-texto); transform: none; display: inline-flex; align-items: center; gap: 10px; }
.etiqueta--serie::before { content: ""; width: 14px; height: 14px; border-radius: 50%; background: var(--serie-bg, var(--agf-terracota)); border: 2px solid var(--r-texto); flex: none; }

/* ---------- sections ---------- */
.secao { padding: var(--agf-secao) 0; position: relative; }
.secao--papel { background: var(--r-fundo-cartao); }
.secao--areia { background: var(--r-fundo-alt); }
/* Coloured band (Fi 13/10, "less black"): v1's azulejo blue, not tinta. Every on-band role is creme (5.94:1);
   mostarda is never text on blue (3.06:1), only button fills with tinta text (6.67:1). The footer stays tinta. */
.secao--escuro {
  --r-texto-suave-escuro: var(--agf-creme); --r-link-no-escuro: var(--agf-creme);
  --r-mao-no-escuro: var(--agf-creme); --r-foco-no-escuro: var(--agf-creme);
  background: var(--agf-azulejo); color: var(--r-texto-no-escuro);
}
.secao--ocre { background: var(--agf-mostarda); color: var(--agf-tinta); }
.secao--colada { padding-top: 0; }
.secao--escuro .lead { color: var(--r-texto-no-escuro); }
.secao--escuro a:not(.btn) { color: var(--r-link-no-escuro); text-decoration: underline; text-underline-offset: 3px; }
.secao--escuro .etiqueta { color: var(--r-mao-no-escuro); }
.secao--ocre .etiqueta, .secao--ocre .lead, .secao--ocre a:not(.btn) { color: var(--agf-tinta); }
/* torn-paper edge where a coloured section starts (v1 .rasgado-topo, applied by colour) */
.secao--papel::before, .secao--areia::before, .secao--escuro::before, .secao--ocre::before, .rodape::before, .compartilhar::before {
  content: ""; position: absolute; left: 0; right: 0; top: -13px; height: 14px; background: inherit; pointer-events: none;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14 L0 8 L6 5 L13 9 L19 4 L27 7 L33 2 L41 8 L48 5 L55 9 L62 3 L70 7 L77 4 L84 9 L91 5 L98 8 L105 3 L112 7 L120 5 L120 14 Z'/%3E%3C/svg%3E") 0 0 / 120px 14px repeat-x;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14 L0 8 L6 5 L13 9 L19 4 L27 7 L33 2 L41 8 L48 5 L55 9 L62 3 L70 7 L77 4 L84 9 L91 5 L98 8 L105 3 L112 7 L120 5 L120 14 Z'/%3E%3C/svg%3E") 0 0 / 120px 14px repeat-x;
}
.cabeca { max-width: 760px; margin-bottom: 32px; }
.cabeca.centro { margin-left: auto; margin-right: auto; }
.cabeca h2 { margin-bottom: .3em; }

/* the cut at the end of an act: a handwritten pointer to the next one */
.corte { margin: 44px 0 0; text-align: center; }
.corte a, .corte span { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 4px; font-family: var(--agf-fonte-mao); font-size: 1.6rem; font-weight: 700; color: inherit; text-decoration: none; }
.corte a::after { content: "\2193"; font-family: var(--agf-fonte-texto); font-size: 1.1rem; }
.corte a:hover { text-decoration: underline; }

/* ---------- buttons: solid, obvious, a hard offset shadow (v1) ---------- */
.botoes { display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: center; margin-top: 26px; }
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55em; max-width: 100%;
  min-height: 52px; padding: .7em 1.45em; border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio-pilula);
  font-family: var(--agf-fonte-texto); font-size: var(--agf-web-botao); font-weight: 800; line-height: 1.2;
  text-decoration: none; text-align: center; cursor: pointer; overflow-wrap: anywhere;
  box-shadow: var(--agf-sombra-botao);
  transition: transform var(--agf-mov-rapido) ease, box-shadow var(--agf-mov-rapido) ease, background-color var(--agf-mov-rapido);
}
.btn:hover { text-decoration: none; transform: translateY(-1px); box-shadow: 0 4px 0 var(--r-sombra-dura); }
.btn:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--r-sombra-dura); }
.btn:focus-visible { outline-offset: 4px; }
.btn .ico { width: 22px; height: 22px; }
.btn--principal { background: var(--r-botao-principal-bg); color: var(--r-botao-principal-fg); }
.btn--principal:hover { color: var(--r-botao-principal-fg); background: var(--agf-tinta); }
.btn--depois { background: var(--r-botao-depois-bg); color: var(--r-botao-depois-fg); }
.btn--depois:hover { background: var(--agf-branco); color: var(--r-botao-depois-fg); }
.btn--peq { min-height: 44px; padding: .45em 1.05em; font-size: 1rem; }
.btn--whats { background: var(--agf-whats); color: var(--agf-branco); }
.btn--whats:hover { background: var(--agf-whats); color: var(--agf-branco); text-decoration: underline; }
.btn--topo { min-height: 44px; padding: .4em 1em; font-size: 1rem; background: var(--agf-mostarda); color: var(--agf-tinta); white-space: nowrap; box-shadow: 0 2px 0 var(--r-sombra-dura); }
.btn--topo:hover { background: var(--agf-mostarda); color: var(--agf-tinta); }
/* on the blue band (v1): mostarda primary + light secondary, both tinta text and a tinta border/shadow */
.secao--escuro .btn { border-color: var(--agf-tinta); box-shadow: var(--agf-sombra-botao); }
.secao--escuro .btn--principal { background: var(--agf-mostarda); color: var(--agf-tinta); }
.secao--escuro .btn--principal:hover { background: var(--agf-creme); color: var(--agf-tinta); }
.secao--escuro .btn--depois { background: var(--agf-papel); color: var(--agf-tinta); }
.secao--escuro .btn--depois:hover { background: var(--agf-branco); color: var(--agf-tinta); }
.link-seta { display: inline-block; padding: 10px 0; font-weight: 800; }
p .link-seta { display: inline; padding: 0; }
.link-seta::after { content: "\00a0\2192"; display: inline; transition: margin-left var(--agf-mov-rapido); }
.link-seta:hover::after { margin-left: 3px; }
.link-baixo::after { content: "\00a0\2193"; }
.link-botao { background: none; border: 0; padding: 0; font: inherit; color: inherit; text-decoration: underline; cursor: pointer; min-height: 44px; }

/* ---------- header (sticky; slim after scrolling; no pattern, a dashed paper edge) ---------- */
.topo { position: sticky; top: 0; z-index: 20; }
.topo::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 100%; z-index: -1; background: var(--agf-veu-creme); border-bottom: 2px dashed var(--agf-tracejado); }
.topo__in { display: flex; align-items: center; gap: 12px; min-height: 76px; }
.topo__logo { display: block; margin-right: auto; flex: none; border-radius: 6px; }
.topo__logo-img { height: 52px; width: auto; }
.js .topo { height: 76px; overflow-anchor: none; }
.js .topo--compacto { pointer-events: none; }
.js .topo--compacto > * { pointer-events: auto; }
.js .topo--compacto::before { height: 60px; }
.js .topo--compacto .nav.aberto { top: 60px; }
.topo::before, .topo__in, .topo__logo-img { transition: height var(--agf-mov-normal), min-height var(--agf-mov-normal); }
.topo--compacto .topo__in { min-height: 60px; }
.topo--compacto .topo__logo-img { height: 42px; }
.menu-btn {
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 16px;
  background: var(--agf-papel); color: var(--agf-tinta); border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio-pilula);
  font: 800 1rem/1 var(--agf-fonte-texto); cursor: pointer; box-shadow: 0 2px 0 var(--r-sombra-dura);
}
.menu-btn__ico, .menu-btn__ico::before, .menu-btn__ico::after { display: block; width: 18px; height: 2.5px; background: currentColor; position: relative; border-radius: 2px; }
.menu-btn__ico::before, .menu-btn__ico::after { content: ""; position: absolute; left: 0; }
.menu-btn__ico::before { top: -6px; } .menu-btn__ico::after { top: 6px; }
.menu-btn[aria-expanded="true"] .menu-btn__ico { background: transparent; }
.menu-btn[aria-expanded="true"] .menu-btn__ico::before { top: 0; transform: rotate(45deg); }
.menu-btn[aria-expanded="true"] .menu-btn__ico::after { top: 0; transform: rotate(-45deg); }
.so-largo { display: none; }
.so-curto { display: inline; }
.js .nav { display: none; }
.js .nav.aberto {
  display: block; position: absolute; top: 100%; left: 0; right: 0; max-height: calc(100vh - 90px); overflow-y: auto;
  background: var(--agf-papel); border-bottom: 3px solid var(--agf-tinta); box-shadow: var(--agf-sombra-flutuante);
}
.nav ul { list-style: none; margin: 0; padding: 8px var(--agf-gutter) 16px; }
.nav li { border-bottom: 1px dashed var(--agf-tracejado); }
.nav li:last-child { border-bottom: 0; }
.nav a { display: flex; align-items: center; min-height: 52px; color: var(--agf-tinta); text-decoration: none; font-weight: 800; font-size: 1.2rem; }
.nav a[aria-current="page"] { color: var(--agf-terracota-escuro); }
.nav a[aria-current="page"]::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--agf-mostarda); border: 2px solid var(--agf-tinta); margin-right: 10px; flex: none; }
.nav__lang a { font-size: 1rem; }
.nav__lang-curto { display: none; }
@media (min-width: 760px) {
  .topo__in { min-height: 88px; gap: 16px; }
  .topo__logo-img { height: 64px; }
  .js .topo { height: 88px; }
  .js .topo--compacto::before { height: 64px; }
  .js .topo--compacto .nav.aberto { top: 64px; }
  .topo--compacto .topo__in { min-height: 64px; }
  .topo--compacto .topo__logo-img { height: 48px; }
}
@media (min-width: 1260px) {  /* 1100 -> 1260 (24/10): 'Para imprimir' joined the desktop menu */
  .topo__in { gap: 20px; }
  .menu-btn { display: none; }
  .nav, .js .nav, .js .nav.aberto { display: block; position: static; background: none; border: 0; box-shadow: none; }
  .nav ul { display: flex; align-items: center; gap: 4px; padding: 0; }
  .nav li { border: 0; }
  .nav a { min-height: 44px; padding: 0 12px; font-size: 1rem; border-radius: var(--agf-raio-pilula); white-space: nowrap; }
  .nav a:hover { background: var(--agf-papel); color: var(--agf-tinta); }
  .nav a[aria-current="page"] { background: var(--agf-tinta); color: var(--agf-creme); }
  .nav a[aria-current="page"]::before { content: none; }
  .nav__lang { margin-left: 6px; }
  .nav__lang a { border: 2px solid var(--agf-tinta); min-width: 44px; justify-content: center; padding: 0 8px; font-size: .875rem; }
  .nav__lang a { letter-spacing: .1em; }
  .nav__lang-longo { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .nav__lang-curto { display: inline; }
  .nav__lang a:hover { background: var(--agf-tinta); color: var(--agf-creme); }
  .nav__so-menu { display: none; }
}
@media (min-width: 1360px) { .so-largo { display: inline; } .so-curto { display: none; } }  /* 1280 -> 1360 (24/10): "Para imprimir" joined the menu */
.topo:not(.topo--reduzido):not(.topo--landing) .topo__in { max-width: 1360px; }  /* 24/10: logo + 7 links + icon + button need ~1340px */
@media (max-width: 1259px) {
  html:not(.js) .menu-btn { display: none; }
  html:not(.js) .topo__in { flex-wrap: wrap; padding-bottom: 8px; }
  html:not(.js) .nav { flex-basis: 100%; }
  html:not(.js) .nav ul { display: flex; flex-wrap: wrap; gap: 0 4px; padding: 0; }
  html:not(.js) .nav li { border: 0; }
  html:not(.js) .nav a { min-height: 44px; padding: 0 8px; font-size: 1rem; }
}
/* phones: the bar holds the two-row logo and the menu; the e-mail button moves into the menu (no sideways scroll) */
.nav__so-celular { display: none; }
@media (max-width: 599px) { .btn--topo { display: none; } .nav__so-celular { display: block; } }
@media (max-width: 359px) { .topo__logo-img { height: 44px; } }
/* Instagram icon (Fi 18/10): every page. In the DOM after the nav, so on desktop it sits next to "EN" and keyboard
   order follows the screen; below the desktop breakpoint, CSS order puts it between the logo and the "Menu" pill. */
.topo__ig {
  display: inline-flex; align-items: center; justify-content: center; flex: none; width: 44px; height: 44px;
  border: 2px solid var(--agf-tinta); border-radius: 50%; background: var(--agf-papel); color: var(--agf-tinta);
  box-shadow: 0 2px 0 var(--r-sombra-dura); text-decoration: none;
}
.topo__ig:hover { background: var(--agf-tinta); color: var(--agf-creme); }
.topo__ig-ico { width: 22px; height: 22px; }
@media (max-width: 1259px) {
  .topo:not(.topo--reduzido) .topo__ig { order: 0; }
  .topo:not(.topo--reduzido) .menu-btn, .topo:not(.topo--reduzido) .btn--topo { order: 1; }
  .topo:not(.topo--reduzido) .nav { order: 2; }
}
@media (max-width: 759px) {
  .topo--reduzido .menu-btn { order: 1; }
  .topo--reduzido .nav { order: 2; }
}
@media (max-width: 399px) {  /* logo + icon + Menu fit inside the 16px gutters down to 320px */
  .topo__in { gap: 8px; }
  .topo__logo-img { height: 46px; }
  .menu-btn { padding: 0 12px; gap: 8px; }
}
@media (max-width: 359px) { .topo__logo-img, .topo--compacto .topo__logo-img { height: 38px; } }
@media (min-width: 1260px) { .topo:not(.topo--reduzido) .topo__ig { margin-left: -10px; box-shadow: none; } }
@media (min-width: 760px) { .topo--reduzido .topo__ig { box-shadow: none; } }

/* ---------- photo slots (labelled boxes, never fake photos): v1 striped placeholder ---------- */
.foto {
  position: relative; display: grid; place-items: center; aspect-ratio: 4 / 3; width: 100%; padding: 18px; text-align: center;
  background: repeating-linear-gradient(-45deg, var(--agf-listra-foto) 0 12px, transparent 12px 24px), var(--agf-papel);
  color: var(--agf-tinta-suave); border: 2px dashed var(--agf-tinta-suave); border-radius: 2px;
}
.foto__in { max-width: 30ch; min-width: 0; }
.foto__ico { width: 38px; height: 38px; margin: 0 auto 8px; color: var(--agf-tinta-suave); }
.foto__txt { margin: 0; font-size: var(--agf-web-pequeno); line-height: 1.4; font-weight: 700; overflow-wrap: anywhere; }
.foto__txt b { display: block; margin-bottom: 4px; font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: var(--agf-terracota-escuro); }
/* cold read 13/10: placeholders say only "foto em breve" (handwritten), plus a before/after label when there is one */
.foto__rot { margin: 0; font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 1.6rem; line-height: 1.1; color: var(--agf-tinta); }
.foto__rot + .foto__txt { margin-top: 4px; font-size: 1rem; text-transform: lowercase; color: var(--agf-terracota-escuro); }
.foto--retrato { aspect-ratio: 4 / 5; }
.foto--alta { aspect-ratio: 3 / 4; }
.foto--quadrada { aspect-ratio: 1; }
.foto--larga { aspect-ratio: 16 / 9; }
.foto--baixa { aspect-ratio: 21 / 9; }
.foto--escura { background: var(--r-fundo-escuro); color: var(--r-texto-no-escuro); border-color: var(--r-texto-suave-escuro); }
.foto--escura .foto__ico { color: var(--agf-creme); }
.foto--escura .foto__txt b { color: var(--agf-mostarda); }
.foto--escura .foto__rot { color: var(--agf-creme); }
.foto--escura .foto__rot + .foto__txt { color: var(--agf-mostarda); }

/* ---------- polaroid, taped frame, washi tape (v1; used by the hero frame and the family page) ---------- */
/* <figure class="polaroid [polaroid--fita-goiaba]" style="--giro:2deg"> {{FOTO:...}} <figcaption>legenda</figcaption></figure> */
.polaroid, .moldura {
  position: relative; background: var(--agf-branco); padding: 12px 12px 14px; border-radius: 3px;
  box-shadow: var(--agf-sombra-papel); transform: rotate(var(--giro, var(--agf-giro-1)));
  width: 100%; max-width: 480px; margin: 18px auto;
}
.moldura { padding-bottom: 40px; }
.polaroid > .foto, .moldura > .foto { border-width: 1.5px; }
.polaroid figcaption, .polaroid__legenda { font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 1.45rem; line-height: 1.15; text-align: center; padding-top: 10px; color: var(--agf-tinta); }
/* washi tape on top (colour by modifier or by --fita) */
.polaroid::before, .moldura::before, .fita::before, .colado::before {
  content: ""; position: absolute; top: -14px; left: 50%; width: 112px; height: 28px; margin-left: -56px; z-index: 2;
  background: repeating-linear-gradient(45deg, var(--fita-1, var(--agf-fita-mostarda-1)) 0 8px, var(--fita-2, var(--agf-fita-mostarda-2)) 8px 16px);
  transform: rotate(-3deg); box-shadow: 0 1px 2px var(--agf-tracejado); pointer-events: none;
}
.polaroid--fita-goiaba, .fita--goiaba { --fita-1: var(--agf-fita-goiaba-1); --fita-2: var(--agf-fita-goiaba-2); }
.polaroid--fita-azul, .fita--azul { --fita-1: var(--agf-fita-azulejo-1); --fita-2: var(--agf-fita-azulejo-2); }
.polaroid--fita-oliva, .fita--oliva { --fita-1: var(--agf-fita-oliva-1); --fita-2: var(--agf-fita-oliva-2); }
.fita { position: relative; }
/* taped frame: a paper card with two tape corners */
.colado { position: relative; background: var(--agf-papel); border: 2px solid var(--agf-tinta); border-radius: 4px; padding: 22px; box-shadow: var(--agf-sombra-dura); transform: rotate(var(--giro, var(--agf-giro-3))); }
.colado::before { left: -10px; top: -12px; margin: 0; width: 84px; transform: rotate(-24deg); }
.colado::after { content: ""; position: absolute; right: -10px; top: -12px; width: 84px; height: 26px; transform: rotate(24deg); background: repeating-linear-gradient(45deg, var(--fita-1, var(--agf-fita-mostarda-1)) 0 8px, var(--fita-2, var(--agf-fita-mostarda-2)) 8px 16px); pointer-events: none; }
/* branch-coloured polaroid for the family page: <figure class="polaroid polaroid--ramo ramo-fi"> */
.polaroid--ramo::before { background: var(--ramo, var(--agf-mostarda)); opacity: .85; }
.polaroid--ramo { border-bottom: 6px solid var(--ramo, var(--agf-mostarda)); }
.polaroid__foto { display: block; aspect-ratio: 1; width: 100%; object-fit: cover; }

/* ---------- hero ---------- */
.heroi { padding: 36px 0 56px; position: relative; }
.heroi__grade { display: grid; gap: 36px; align-items: center; }
.heroi h1 { margin-bottom: .35em; }
/* 13/10 less black: a mostarda sticker pill (tinta text 6.67:1) with a terracota dot, not a tinta fill */
.heroi__estacao { display: inline-flex; align-items: center; gap: 10px; margin: 4px 0 0; padding: 6px 14px 6px 8px; background: var(--agf-mostarda); color: var(--agf-tinta); font-weight: 800; font-size: 1rem; border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio-pilula); box-shadow: 2px 2px 0 var(--agf-tinta); transform: rotate(-1deg); }
.heroi__estacao::before { content: ""; width: 16px; height: 16px; border-radius: 50%; background: var(--agf-terracota-escuro); border: 2px solid var(--agf-tinta); box-sizing: border-box; flex: none; }
.heroi__estacao a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
/* pill that is a link: the link fills the pill height (tap target >= 44px) and gets an inset mostarda ring on tinta */
.heroi__estacao:has(> a) { padding-top: 0; padding-bottom: 0; padding-right: 8px; gap: 6px; }
.heroi__estacao > a { display: inline-block; padding: 10px 8px 10px 4px; border-radius: var(--agf-raio-pilula); }
.heroi__estacao > a:focus-visible { outline-color: var(--agf-tinta); outline-offset: -3px; }
.heroi__nota { margin: 0 0 16px; font-size: 1.05rem; color: var(--r-texto); max-width: var(--agf-medida); }
.cabeca .heroi__estacao { margin-top: 12px; }
.heroi__estacao + p { margin-top: 14px; } /* 6a: EN hero line no longer touches the pill */
@media (min-width: 900px) {
  .heroi { padding: 60px 0 84px; }
  .heroi__grade { grid-template-columns: 7fr 5fr; gap: 56px; }
  .heroi--texto .heroi__grade { grid-template-columns: 1fr; max-width: 900px; }
}

/* ---------- decorative bands {{PADRAO:nome}}: v1 motifs only ---------- */
.padrao { display: block; width: 100%; position: relative; pointer-events: none; }
/* washi tape across the page */
.padrao--fita { height: 44px; }
.padrao--fita::before { content: ""; position: absolute; left: 50%; top: 9px; width: min(70%, 420px); height: 26px; transform: translateX(-50%) rotate(-1.5deg); background: repeating-linear-gradient(45deg, var(--agf-fita-mostarda-1) 0 8px, var(--agf-fita-mostarda-2) 8px 16px); box-shadow: 0 1px 2px var(--agf-tracejado); }
/* Brazil <-> Portugal dotted flight line (v1 "voar"): two dots, a dotted arc, a little plane */
.padrao--voo { height: 64px; max-width: var(--agf-container); margin: 0 auto; }
.padrao--voo::before { content: ""; position: absolute; left: 12%; right: 12%; top: 30px; border-top: 4px dotted var(--agf-terracota); }
.padrao--voo::after { content: "\2708"; position: absolute; left: 50%; top: 10px; transform: translateX(-50%) rotate(-8deg); font-size: 1.9rem; line-height: 1; color: var(--agf-terracota-escuro); background: var(--r-fundo); padding: 0 8px; border-radius: 50%; }
.padrao--voo .padrao__ponto { display: none; }
/* kraft tape band (obra content): a strip of brown paper with torn edges */
.padrao--kraft { height: 40px; background: var(--agf-kraft);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 40' preserveAspectRatio='none'%3E%3Cpath d='M0 6 L8 3 L15 7 L23 2 L31 6 L40 3 L48 7 L57 2 L66 6 L74 3 L83 7 L91 2 L100 6 L108 3 L120 6 L120 34 L112 37 L104 33 L95 38 L86 34 L78 37 L69 33 L60 38 L51 34 L43 37 L34 33 L25 38 L16 34 L8 37 L0 34 Z'/%3E%3C/svg%3E") 0 0 / 120px 40px repeat-x;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 40' preserveAspectRatio='none'%3E%3Cpath d='M0 6 L8 3 L15 7 L23 2 L31 6 L40 3 L48 7 L57 2 L66 6 L74 3 L83 7 L91 2 L100 6 L108 3 L120 6 L120 34 L112 37 L104 33 L95 38 L86 34 L78 37 L69 33 L60 38 L51 34 L43 37 L34 33 L25 38 L16 34 L8 37 L0 34 Z'/%3E%3C/svg%3E") 0 0 / 120px 40px repeat-x; }
.padrao--rasgado { height: 14px; background: var(--r-fundo-alt);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14 L0 8 L6 5 L13 9 L19 4 L27 7 L33 2 L41 8 L48 5 L55 9 L62 3 L70 7 L77 4 L84 9 L91 5 L98 8 L105 3 L112 7 L120 5 L120 14 Z'/%3E%3C/svg%3E") 0 0 / 120px 14px repeat-x;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' preserveAspectRatio='none'%3E%3Cpath d='M0 14 L0 8 L6 5 L13 9 L19 4 L27 7 L33 2 L41 8 L48 5 L55 9 L62 3 L70 7 L77 4 L84 9 L91 5 L98 8 L105 3 L112 7 L120 5 L120 14 Z'/%3E%3C/svg%3E") 0 0 / 120px 14px repeat-x; }

/* round rubber stamp {{CARIMBO:texto|tom}} (replaces v2's loose azulejo tile) */
.carimbo {
  display: inline-grid; place-items: center; width: 150px; height: 150px; border-radius: 50%; flex: none;
  background: var(--carimbo-bg, var(--agf-mostarda)); color: var(--carimbo-fg, var(--agf-tinta));
  border: 3px solid var(--carimbo-fg, var(--agf-tinta)); box-shadow: var(--agf-sombra-dura); transform: rotate(-8deg); position: relative;
}
.carimbo::after { content: ""; position: absolute; inset: 9px; border-radius: 50%; border: 2.5px dotted currentColor; }
.carimbo__txt { font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 2rem; line-height: 1; text-align: center; padding: 0 18px; }
.carimbo--ouro { --carimbo-bg: var(--agf-mostarda); --carimbo-fg: var(--agf-tinta); }
.carimbo--azul { --carimbo-bg: var(--agf-azulejo); --carimbo-fg: var(--agf-creme); }
.carimbo--terracota { --carimbo-bg: var(--agf-terracota-escuro); --carimbo-fg: var(--agf-creme); }
.secao--escuro .carimbo { box-shadow: 4px 4px 0 var(--agf-tinta); }
@media (max-width: 600px) { .carimbo { width: 112px; height: 112px; } .carimbo__txt { font-size: 1.6rem; } }

/* ---------- cards ---------- */
.cartao { position: relative; background: var(--r-fundo-cartao); border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio); padding: 22px; box-shadow: var(--agf-sombra-dura); color: var(--r-texto); }
.cartao > :last-child { margin-bottom: 0; }
.grade { display: grid; gap: 22px; }
@media (min-width: 640px) { .grade--2, .grade--3, .grade--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .grade--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grade--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.grade > .cartao:nth-child(3n+1) { --sombra: var(--agf-terracota); box-shadow: 4px 4px 0 var(--agf-terracota); }
.grade > .cartao:nth-child(3n+2) { box-shadow: 4px 4px 0 var(--agf-azulejo); }
.grade > .cartao:nth-child(3n) { box-shadow: 4px 4px 0 var(--agf-mostarda); }
@media (min-width: 760px) {
  .grade > .cartao:nth-child(4n+2) { transform: rotate(.8deg); }
  .grade > .cartao:nth-child(4n+3) { transform: rotate(-.8deg); }
}

/* numbers row: <ul class="numeros"><li><b>50</b> anos de casados</li>…</ul> */
.numeros { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9.5rem), 1fr)); gap: 16px; }
.numeros li { background: var(--agf-papel); color: var(--agf-tinta); border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio); padding: 16px 14px; text-align: center; font-weight: 700; font-size: 1rem; line-height: 1.3; box-shadow: 4px 4px 0 var(--agf-mostarda); }
.numeros b { display: block; font-family: var(--agf-fonte-titulo); font-weight: 900; font-size: clamp(2rem, 7vw, 2.8rem); line-height: 1; color: var(--agf-terracota-escuro); margin-bottom: 6px; overflow-wrap: anywhere; }
@media (min-width: 760px) { .numeros { grid-template-columns: repeat(4, minmax(0, 1fr)); } .numeros--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* notice: a sticky note */
.aviso { position: relative; background: var(--agf-aviso-fundo); color: var(--agf-tinta); border: 2px solid var(--agf-tinta); border-radius: 6px; padding: 16px 20px; margin: 0 0 1em; box-shadow: 4px 4px 0 var(--agf-mostarda); }
.aviso > :last-child { margin-bottom: 0; }
.aviso a:not(.btn) { color: var(--agf-azulejo-escuro); }

/* chips (who appears, subjects) */
.chips { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.chips li { max-width: 100%; }
.chip { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 6px 16px; border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio-pilula); background: var(--agf-papel); color: var(--agf-tinta); font: 800 1rem/1.2 var(--agf-fonte-texto); text-decoration: none; cursor: pointer; box-shadow: 3px 3px 0 var(--agf-terracota); }
.chips li:nth-child(3n+2) .chip { box-shadow: 3px 3px 0 var(--agf-azulejo); }
.chips li:nth-child(3n) .chip { box-shadow: 3px 3px 0 var(--agf-mostarda); }
.chip:hover { background: var(--agf-tinta); color: var(--agf-creme); }

/* ---------- cast ---------- */
/* ---------- the cast: {{ELENCO}} = houses (branch colour) of taped polaroids; same slot for everyone ---------- */
.nota-mao { display: inline-block; margin: 0 0 52px; padding: 10px 16px 8px; font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 1.45rem; line-height: 1.15; color: var(--agf-tinta); background: var(--agf-aviso-fundo); border: 2px solid var(--agf-tinta); border-radius: 4px; box-shadow: 3px 3px 0 var(--agf-tinta); transform: rotate(var(--agf-giro-1)); }
.elenco-casas { --card-w: 100%; display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 44px 28px; }
.casa { position: relative; width: 100%; padding: 36px 16px 22px; background: var(--r-fundo); border: 2px dashed var(--ramo); border-radius: 10px; }
.casa__rot { position: absolute; top: -19px; left: 14px; margin: 0; padding: 4px 14px 3px; font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 1.45rem; line-height: 1.1; background: var(--ramo-bg); color: var(--ramo-fg); border: 2px solid var(--agf-tinta); border-radius: 3px; box-shadow: 2px 2px 0 var(--agf-tinta); transform: rotate(-2deg); }
.casa__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 28px; }
.gente, .gente__link { display: grid; grid-template-columns: 136px minmax(0, 1fr); gap: 16px; align-items: start; align-content: start; }
.elenco-casas--resumo .gente { display: block; }
.gente__link { color: inherit; text-decoration: none; border-radius: 6px; }
.gente__link:hover .gente__nome { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.gente__moldura { position: relative; padding: 8px 8px 26px; background: var(--ramo-bg); border: 2px solid var(--agf-tinta); border-radius: 3px; box-shadow: 4px 4px 0 var(--agf-tinta); transform: rotate(var(--giro, -1.2deg)); }
.gente:nth-child(even) .gente__moldura { --giro: 1.2deg; }
.gente__moldura::before { content: ""; position: absolute; top: -12px; left: 50%; width: 60px; height: 20px; margin-left: -30px; z-index: 2; background: var(--agf-kraft); opacity: .92; transform: rotate(-4deg); box-shadow: 0 1px 2px var(--agf-tracejado); }
.gente:nth-child(even) .gente__moldura::before { transform: rotate(5deg); }
.gente__foto { aspect-ratio: 4 / 5; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 8px 6px; text-align: center; background: var(--agf-papel); color: var(--agf-tinta); border: 1.5px dashed var(--agf-tinta-suave); overflow: hidden; }
.gente__foto .foto__ico { width: 22px; height: 22px; margin: 0; }
.gente__brief { font-family: var(--agf-fonte-mao); font-size: 1.15rem; line-height: 1.1; font-weight: 700; }
.gente__txt { min-width: 0; padding-top: 2px; }
.gente__nome { margin: 0; font-family: var(--agf-fonte-titulo); font-weight: 700; font-size: 1.35rem; line-height: 1.15; }
.gente__tag { margin: 2px 0 6px; font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 1.35rem; line-height: 1.1; color: var(--r-mao); }
.gente__nota { display: inline-block; margin: 0 0 8px; padding: 2px 10px; font-size: .85rem; font-weight: 800; line-height: 1.35; color: var(--agf-tinta); background: var(--agf-aviso-fundo); border: 1.5px solid var(--agf-tinta); border-radius: 999px; }
.gente__linha { margin: 0; font-size: 1rem; line-height: 1.45; color: var(--r-texto); }
.netos-caixa { flex: 1 1 100%; max-width: 640px; padding: 20px 20px 18px; text-align: center; background: var(--r-fundo); border: 2px dashed var(--agf-tinta-suave); border-radius: 10px; }
.netos-caixa__n { margin: 0 0 6px; font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 2.1rem; line-height: 1.1; color: var(--r-mao); }
.netos-caixa p { margin: 0; font-size: 1rem; line-height: 1.5; }
@media (min-width: 600px) {
  .elenco-casas { --card-w: 152px; }
  .casa { width: auto; padding: 38px 20px 24px; }
  .casa__lista { grid-auto-flow: column; grid-auto-columns: var(--card-w); gap: 24px; }
  .gente, .gente__link { grid-template-columns: minmax(0, 1fr); gap: 14px; }
}
@media (min-width: 900px) { .elenco-casas { --card-w: 170px; } .gente__moldura { padding: 10px 10px 30px; } }
/* cold read 13/10 (large phone text): on narrow phones the card stacks, a smaller polaroid on top, text full width below */
@media (max-width: 419px) {
  .gente, .gente__link { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .gente__moldura { width: 150px; }
  .elenco-casas--resumo .gente__moldura { width: 120px; }
}
@media (min-width: 1040px) { .elenco-casas { --card-w: 172px; } }

/* ---------- episodes ---------- */
.eps { display: grid; gap: 28px; }
@media (min-width: 640px) { .eps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .eps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ep__link { display: block; color: inherit; text-decoration: none; border-radius: var(--agf-raio); }
.ep__capa {
  position: relative; display: grid; place-items: center; aspect-ratio: 4 / 3; overflow: hidden;
  background: var(--serie-bg); color: var(--serie-fg); border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio);
  box-shadow: var(--agf-sombra-dura); transition: transform var(--agf-mov-rapido);
}
@media (min-width: 640px) { .ep__capa { aspect-ratio: 4 / 5; } }
.ep__link:hover .ep__capa { transform: rotate(-1deg); }
.ep__capa .selo-img { width: 38%; height: auto; max-width: 128px; }
.ep__num, .ep__serie { position: absolute; left: 14px; font-weight: 800; }
.ep__num { top: 10px; font-family: var(--agf-fonte-titulo); font-size: 1.4rem; }
.ep__serie { bottom: 12px; right: 72px; font-family: var(--agf-fonte-mao); font-size: 1.4rem; line-height: 1.05; }
.ep__play { position: absolute; right: 12px; bottom: 12px; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: var(--agf-mostarda); color: var(--agf-tinta); border: 2px solid var(--agf-tinta); }
.ep__play .ico { width: 22px; height: 22px; }
.ep__link:hover .ep__play { background: var(--agf-creme); }
.ep__txt { padding-top: 16px; }
.ep__titulo { font-size: 1.4rem; margin: 0 0 6px; }
.ep__link:hover .ep__titulo { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.ep__meta { font-size: .95rem; font-weight: 700; color: var(--r-texto-suave); margin: 0 0 6px; }
.ep__desc { font-size: 1rem; margin: 0; color: var(--r-texto); }
.secao--escuro .ep__meta { color: var(--r-texto-suave-escuro); }
.secao--escuro .ep__desc { color: var(--agf-creme); }
.secao--escuro .ep__capa { border-color: var(--agf-tinta); box-shadow: 4px 4px 0 var(--agf-tinta); }
@media (min-width: 900px) {
  .ep--destaque .ep__link { display: grid; grid-template-columns: 5fr 7fr; gap: 40px; align-items: center; }
  .ep--destaque .ep__titulo { font-size: var(--agf-web-h2); }
  .ep--destaque .ep__desc { font-size: var(--agf-web-lead); }
}
.ep-lista { list-style: none; padding: 0; border-top: 2px solid var(--agf-tinta); }
.ep-lista__item { border-bottom: 1px dashed var(--agf-tracejado); }
.ep-lista__item a { display: flex; gap: 16px; align-items: center; padding: 14px 0; min-height: 64px; color: inherit; text-decoration: none; }
.ep-lista__selo .selo-img { width: 46px; height: 46px; }
.ep-lista__titulo { display: block; font-weight: 800; font-size: 1.15rem; line-height: 1.3; }
.ep-lista__meta { display: block; font-size: .95rem; color: var(--r-texto-suave); }
.ep-lista__item a:hover .ep-lista__titulo { text-decoration: underline; }
/* 16/10: story cards wear the story's real photo (or its drawing); the seal is a small sticker, the label a paper strip */
.ep__capa--foto { background: var(--agf-papel); }
.ep__capa--foto picture, .ep__capa--foto .ep__foto { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.ep__capa--foto .ep__foto { object-fit: cover; }
.ep__selo { position: absolute; left: 10px; top: 10px; z-index: 1; transform: rotate(-8deg); line-height: 0; }
.ep__capa--foto .ep__selo .selo-img { width: 64px; height: 64px; max-width: none; }
.ep__serie--tira { z-index: 1; left: 12px; right: auto; bottom: 14px; max-width: calc(100% - 84px); padding: 2px 12px; background: var(--agf-papel); color: var(--agf-tinta); border: 2px solid var(--agf-tinta); transform: rotate(-2deg); }
.ep__capa--foto .ep__play { z-index: 1; }
.eps--um .ep__capa--foto .ep__selo { left: 6px; top: 6px; }
.eps--um .ep__capa--foto .ep__selo .selo-img { width: 40px; height: 40px; }
/* next-episode card: lies flat */
.eps--um { grid-template-columns: minmax(0, 1fr); max-width: 640px; }
.eps--um .ep__link { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 16px; align-items: center; }
.eps--um .ep__capa { aspect-ratio: 4 / 5; }
.eps--um .ep__capa .ep__serie, .eps--um .ep__capa .ep__num { display: none; }
.eps--um .ep__capa .selo-img { width: 56%; }
.eps--um .ep__play { right: 6px; bottom: 6px; width: 32px; height: 32px; }
.eps--um .ep__play .ico { width: 16px; height: 16px; }
.eps--um .ep__titulo { margin-top: 0; }
@media (min-width: 640px) { .eps--um .ep__link { grid-template-columns: 168px minmax(0, 1fr); gap: 24px; } }

/* episode page */
.migalha { margin: 0 0 18px; font-size: 1rem; }
.migalha a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 800; }
.ep-fachada { margin: 0; }
.ep-fachada__link { display: block; color: inherit; text-decoration: none; max-width: 420px; }
.ep-fachada .ep__capa--grande { aspect-ratio: 9 / 12; border-radius: var(--agf-raio) var(--agf-raio) 0 0; box-shadow: none; }
.ep-fachada .ep__capa--grande .selo-img { max-width: 160px; }
.ep-fachada__cta { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; background: var(--agf-terracota-escuro); color: var(--agf-creme); font-weight: 800; border: 2px solid var(--agf-tinta); border-top: 0; border-radius: 0 0 var(--agf-raio) var(--agf-raio); box-shadow: 4px 4px 0 var(--agf-tinta); }
.ep-fachada__link:hover .ep-fachada__cta { background: var(--agf-azulejo); }
.ep__abre { position: absolute; right: 12px; top: 16px; padding: 4px 12px; font-size: .95rem; font-weight: 800; line-height: 1.2; background: var(--agf-papel); color: var(--agf-tinta); border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio-pilula); }
.ep-fachada figcaption { font-family: var(--agf-fonte-mao); font-size: 1.35rem; font-weight: 700; color: var(--r-texto-suave); margin-top: 10px; }
.prosa { font-size: var(--agf-web-corpo); line-height: 1.7; }
.prosa p { max-width: var(--agf-medida); }
.prosa h2 { margin-top: 0; }
.prosa h3 { margin-top: 1.6em; }
.quem { margin-top: 36px; padding-top: 20px; border-top: 2px dashed var(--agf-tracejado); }
.quem__t { font-family: var(--agf-fonte-mao); font-size: 1.5rem; font-weight: 700; color: var(--r-mao); margin: 0 0 10px; }
.quem .chips { margin: 0; }

/* inline list box (episode pages): a taped card */
.lista-inline { position: relative; margin: 36px 0; padding: 24px 22px 22px; border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio); background: var(--agf-papel); box-shadow: 4px 4px 0 var(--agf-mostarda); }
.lista-inline::before { content: ""; position: absolute; top: -13px; left: 24px; width: 96px; height: 26px; transform: rotate(-3deg); background: repeating-linear-gradient(45deg, var(--agf-fita-goiaba-1) 0 8px, var(--agf-fita-goiaba-2) 8px 16px); }
.lista-inline--sem-canto::before { background: repeating-linear-gradient(45deg, var(--agf-fita-oliva-1) 0 8px, var(--agf-fita-oliva-2) 8px 16px); }
.lista-inline__t { margin: 0 0 14px; }
.lista-compacta { margin-top: 8px; }

/* ---------- forms ---------- */
.form { display: grid; gap: 18px; max-width: 640px; grid-template-columns: minmax(0, 1fr); }
.campo label { display: block; font-weight: 800; margin-bottom: 6px; font-size: 1.05rem; }
.opcional { font-weight: 400; color: var(--r-texto-suave); }
.form input:not([type="checkbox"]):not([type="radio"]), .form select, .form textarea {
  width: 100%; min-height: 52px; padding: 10px 14px; font: inherit; font-size: 1.125rem; color: var(--agf-tinta);
  background: var(--agf-branco); border: 2px solid var(--r-campo-borda); border-radius: var(--agf-raio-campo);
}
.form textarea { min-height: 170px; resize: vertical; line-height: 1.5; }
.form select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--agf-tinta) 50%), linear-gradient(135deg, var(--agf-tinta) 50%, transparent 50%); background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%; background-size: 6px 6px; background-repeat: no-repeat; padding-right: 44px; }
.form input:focus-visible, .form select:focus-visible, .form textarea:focus-visible { outline: var(--agf-foco) solid var(--r-foco); outline-offset: 2px; }
.form [aria-invalid="true"] { border-color: var(--r-erro) !important; outline: 2px solid var(--r-erro); outline-offset: 1px; }
.campo--check { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; min-height: 44px; font-size: 1rem; line-height: 1.45; font-weight: 600; cursor: pointer; }
.campo--check input { width: 24px; height: 24px; margin: 0; flex: none; accent-color: var(--agf-terracota-escuro); }
.campo--check > span { flex: 1; min-width: 0; }
.campo__erro { color: var(--r-erro); font-weight: 800; font-size: .95rem; margin: 6px 0 0; width: 100%; }
.campo__erro::before { content: "! "; }
.campo--check .campo__erro { margin-left: 36px; }
.form ::placeholder { color: var(--r-texto-suave); opacity: 1; }
.form__erro { margin: 0; padding: 12px 14px; background: var(--agf-erro-fundo); color: var(--r-erro); font-weight: 800; border: 2px solid var(--r-erro); border-radius: var(--agf-raio-campo); }
.form__erro a { color: var(--r-erro); }
.form__ok { background: var(--agf-sucesso-fundo); color: var(--agf-tinta); border: 2px solid var(--agf-oliva); border-radius: var(--agf-raio-campo); padding: 14px; font-weight: 700; }
.form__fallback { background: var(--agf-aviso-fundo); color: var(--agf-tinta); border: 2px solid var(--agf-mostarda); border-radius: var(--agf-raio-campo); padding: 14px; font-weight: 600; margin: 0; }
.form__fallback a { color: var(--agf-terracota-escuro); }
.form__nota { font-size: 1rem; color: var(--r-texto-suave); margin: 0; }
.form > .btn, .form .btn { justify-self: start; }
.form-lista__linha { display: grid; gap: 12px; }
@media (min-width: 640px) { .form-lista__linha { grid-template-columns: 1fr auto; align-items: end; } }
.secao--escuro .campo label { color: var(--agf-creme); }
.secao--escuro .form__nota, .secao--escuro .opcional { color: var(--r-texto-suave-escuro); }
.secao--escuro .form input:not([type="checkbox"]):not([type="radio"]), .secao--escuro .form textarea, .secao--escuro .form select { border-color: var(--agf-creme); }
.secao--escuro .campo__erro { color: var(--agf-creme); }
.secao--escuro .campo--check input { accent-color: var(--agf-mostarda); }
.secao--escuro :focus-visible, .rodape :focus-visible { outline-color: var(--r-foco-no-escuro); }
.secao--escuro .form input:focus-visible, .secao--escuro .form select:focus-visible, .secao--escuro .form textarea:focus-visible { outline-color: var(--r-foco-no-escuro); }
.secao--escuro .aviso :focus-visible, .secao--escuro .cartao .form input:focus-visible, .secao--escuro .cartao .form textarea:focus-visible, .secao--escuro .cartao .form select:focus-visible { outline-color: var(--r-foco); }
.secao--escuro .form__erro { background: var(--agf-erro-fundo); }
.lista h2 { margin-bottom: .25em; }
.lista .form { margin-top: 28px; }

/* ---------- WhatsApp share band {{COMPARTILHAR}} ---------- */
.compartilhar { position: relative; background: var(--r-fundo-alt); padding: 34px 0 38px; margin-top: 14px; }
.compartilhar__in { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: center; justify-content: center; text-align: center; }
.compartilhar p { margin: 0; font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 1.8rem; line-height: 1.1; }

/* ---------- tables (stack on phones; build adds data-label) ---------- */
.tabela { width: 100%; border-collapse: collapse; font-size: 1.05rem; background: var(--agf-papel); border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio); }
.tabela th, .tabela td { text-align: left; padding: 12px 14px; border-bottom: 1px dashed var(--agf-tracejado); vertical-align: top; }
.tabela th { font-size: .9rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; background: var(--agf-areia); }
.tabela tr:last-child td { border-bottom: 0; }
@media (max-width: 639px) {
  .tabela thead { position: absolute; left: -9999px; }
  .tabela tr { display: block; border-bottom: 2px dashed var(--agf-tracejado); padding: 8px 0; }
  .tabela td { display: block; border: 0; padding: 4px 14px; }
  .tabela td[data-label]::before { content: attr(data-label) ": "; font-weight: 800; color: var(--agf-terracota-escuro); }
  .tabela--fatos td[data-label]::before { content: none; }
  .tabela--fatos td:first-child { font-weight: 800; }
}
/* age split as bars on phones; the real table stays for screen readers */
.barras { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.barras li { display: grid; grid-template-columns: 5.5em 1fr 3.5em; align-items: center; gap: 10px; font-size: 1rem; font-weight: 700; }
.barras__barra { height: 16px; background: var(--agf-azulejo); border-radius: var(--agf-raio-pilula); border: 1.5px solid var(--agf-tinta); }
.barras b { text-align: right; }
@media (max-width: 599px) { .so-tabela-larga { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } }
@media (min-width: 600px) { .barras { display: none; } }

/* timeline: v1 dotted line with round pins */
.linha-tempo { list-style: none; padding: 0; margin: 0; position: relative; }
.linha-tempo::before { content: ""; position: absolute; left: 11px; top: 6px; bottom: 6px; border-left: 3px dotted var(--agf-terracota); }
.linha-tempo li { position: relative; padding: 0 0 26px 46px; }
.linha-tempo li::before { content: ""; position: absolute; left: 0; top: 4px; width: 22px; height: 22px; border-radius: 50%; background: var(--agf-mostarda); border: 3px solid var(--agf-tinta); }
.linha-tempo b { display: block; font-size: .9rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--agf-terracota-escuro); }
.secao--escuro .linha-tempo b { color: var(--agf-creme); }

/* mural (Bodas): sticky notes */
.mural__grade { display: grid; gap: 18px; }
@media (min-width: 760px) { .mural__grade { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.recado { margin: 0; padding: 18px 16px 14px; background: var(--agf-papel); color: var(--agf-tinta); border: 2px solid var(--agf-tinta); border-radius: 6px; box-shadow: 3px 3px 0 var(--agf-tinta); transform: rotate(var(--agf-giro-3)); }
.recado--1 { background: var(--agf-aviso-fundo); transform: rotate(var(--agf-giro-2)); }
.recado--2 { background: var(--agf-azulejo-claro); }
.recado--3 { background: var(--agf-sucesso-fundo); transform: rotate(var(--agf-giro-2)); }
.recado blockquote { margin: 0 0 10px; font-size: 1.05rem; line-height: 1.5; }
.recado figcaption { font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 1.35rem; }

/* series cards (Assista) with a round sticker seal */
.series { list-style: none; padding: 0; display: grid; gap: 18px; }
@media (min-width: 640px) { .series { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .series { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.serie-cartao { display: flex; gap: 14px; align-items: flex-start; padding: 16px; border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio); background: var(--agf-papel); box-shadow: var(--agf-sombra-dura); height: 100%; }
.serie-cartao__selo { flex: none; }
.serie-cartao__selo .selo-img { width: 60px; height: 60px; transform: rotate(-6deg); }
.serie-cartao h3 { font-size: 1.2rem; margin: 0 0 4px; }
.serie-cartao p { font-size: 1rem; margin: 0; line-height: 1.45; }
.selo-img { border-radius: 50%; }

/* ---------- home: season, bolão, map, deck fan, envelope ---------- */
.temporada { display: grid; gap: 36px; align-items: center; }
@media (min-width: 900px) { .temporada { grid-template-columns: 4fr 8fr; gap: 56px; } }
.selo-temporada { display: grid; justify-items: start; align-content: start; gap: 14px; }
.selo-temporada p { margin: 0; }
.selo-temporada__quando { font-family: var(--agf-fonte-titulo); font-weight: 900; font-size: clamp(2.2rem, 5vw, 3.4rem); line-height: 1; color: var(--agf-creme); }
/* v1's season card on the blue band (13/10): cream paper, mostarda frame and tag, no date and no day counter */
.contagem { position: relative; max-width: 380px; padding: 30px 24px 24px; text-align: center; background: var(--agf-papel); color: var(--agf-tinta); border: 3px solid var(--agf-mostarda); border-radius: var(--agf-raio); box-shadow: 6px 6px 0 var(--agf-tinta); transform: rotate(-1.5deg); }
.contagem p { margin: 0; }
.contagem__selo { display: inline-block; margin: 0 0 14px; padding: 4px 12px; font-size: .9rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; background: var(--agf-mostarda); color: var(--agf-tinta); border: 2px solid var(--agf-tinta); border-radius: 4px; }
.contagem__num { font-family: var(--agf-fonte-titulo); font-weight: 900; font-size: clamp(2.6rem, 12vw, 4.2rem); line-height: 1; white-space: nowrap; color: var(--agf-terracota-escuro); }
.contagem__rot { margin-top: 8px !important; font-weight: 800; font-size: 1.15rem; line-height: 1.3; }
.contagem__mao { margin-top: 8px !important; font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 1.6rem; line-height: 1.1; color: var(--agf-azulejo); }
@media (max-width: 899px) { .contagem { margin: 0 auto; } }
/* v1 button pair on a coloured band: mostarda + light (both tinta text); not "principal", so the one-main-action count holds */
.btn--mostarda { background: var(--agf-mostarda); color: var(--agf-tinta); }
.btn--mostarda:hover { background: var(--agf-creme); color: var(--agf-tinta); }
.btn--claro { background: var(--agf-papel); color: var(--agf-tinta); }
.btn--claro:hover { background: var(--agf-branco); color: var(--agf-tinta); }
.selo-temporada__sub { font-family: var(--agf-fonte-mao); font-size: 1.6rem; font-weight: 700; color: var(--r-texto-suave-escuro); margin: 0; }

.bolao { position: relative; background: var(--r-fundo-alt); padding: 0; }
.bolao__in { padding: 56px 0; }
.bolao__cartao { position: relative; background: var(--agf-papel); border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio); padding: 30px 22px 26px; max-width: 760px; margin: 0 auto; text-align: left; box-shadow: 6px 6px 0 var(--agf-mostarda); transform: rotate(var(--agf-giro-3)); }
.bolao__cartao::before { content: ""; position: absolute; top: -14px; left: 50%; width: 120px; height: 28px; margin-left: -60px; transform: rotate(2deg); background: repeating-linear-gradient(45deg, var(--agf-fita-mostarda-1) 0 8px, var(--agf-fita-mostarda-2) 8px 16px); }
@media (min-width: 760px) { .bolao__cartao { padding: 44px 48px; } }
.bolao__cartao > :last-child { margin-bottom: 0; }
.bolao__cartao .centro, .bolao__cartao .lead { text-align: left; margin-left: 0; margin-right: 0; }
.bolao__status { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 8px 0 0; font-weight: 800; }
.bolao__status .agf-legenda { font-size: 1.05rem; }
.bolao__status .ico { width: 24px; height: 24px; }

.mapa { margin: 0; }
.mapa svg { display: block; width: 100%; height: auto; border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio); background: var(--agf-mar); box-shadow: 5px 5px 0 var(--agf-azulejo); }
/* v1's illustrated map (13/10): labels 22 px in a 480 px viewBox, so about 15.7 px on a 375 px phone */
.mapa__rot { font-family: var(--agf-fonte-texto); font-weight: 800; font-size: 1.375rem; fill: var(--agf-tinta); }
.mapa__mao { font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 1.6875rem; fill: var(--agf-azulejo); }
.mapa__mar { fill: var(--agf-mar); }
.mapa__terra { fill: var(--agf-terra); stroke: var(--agf-tinta); }
.mapa figcaption { font-size: 1rem; line-height: 1.45; color: var(--r-texto); margin-top: 14px; }
/* SVG colour hooks (token-driven) */
.mapa__fundo { fill: var(--agf-papel); }
.mapa__c-papel { fill: var(--agf-papel); } .mapa__c-tinta { fill: var(--agf-tinta); } .mapa__c-tinta-suave { fill: var(--agf-tinta-suave); }
.mapa__c-azulejo { fill: var(--agf-azulejo); } .mapa__c-terracota { fill: var(--agf-terracota); } .mapa__c-terracota-escuro { fill: var(--agf-terracota-escuro); }
.mapa__c-mostarda { fill: var(--agf-mostarda); } .mapa__c-oliva { fill: var(--agf-oliva); } .mapa__c-vinho { fill: var(--agf-vinho); } .mapa__c-goiaba { fill: var(--agf-goiaba); }
.mapa__c-creme { fill: var(--agf-creme); }
.mapa__s-tinta { stroke: var(--agf-tinta); } .mapa__s-tinta-suave { stroke: var(--agf-tinta-suave); } .mapa__s-terracota { stroke: var(--agf-terracota); }
.mapa__s-azulejo { stroke: var(--agf-azulejo); } .mapa__s-terracota-escuro { stroke: var(--agf-terracota-escuro); } .mapa__s-mostarda { stroke: var(--agf-mostarda); } .mapa__s-creme { stroke: var(--agf-creme); }

/* deck fan: tilted cards (v1 leque) */
.leque { position: relative; width: 100%; height: 330px; max-width: 420px; margin: 0 auto; }
.carta { position: absolute; width: 196px; aspect-ratio: 5 / 7; background: var(--agf-papel); border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio); display: flex; flex-direction: column; padding: 0 0 14px; overflow: hidden; box-shadow: 4px 4px 0 var(--naipe, var(--agf-terracota)); }
.carta:nth-child(1) { left: 0; top: 40px; transform: rotate(-9deg); }
.carta:nth-child(2) { left: 22%; top: 0; z-index: 1; transform: rotate(2deg); }
.carta:nth-child(3) { left: 44%; top: 50px; z-index: 2; transform: rotate(9deg); }
.carta__naipe { display: block; padding: 10px 14px; background: var(--naipe, var(--agf-azulejo)); color: var(--naipe-fg, var(--agf-creme)); font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.carta__p { flex: 1; margin: 0; padding: 14px; font-family: var(--agf-fonte-titulo); font-weight: 700; font-size: 1.25rem; line-height: 1.2; }
.carta__rod { padding: 0 14px; font-size: .75rem; color: var(--r-texto-suave); }
/* 18/10 sampler: the 6 game decks (life arc). One colour per deck from the tokens; label text on each band is AA
   (tokens.css: creme on terracota-escuro 5.25+, tinta on mostarda 6.7, creme on oliva 4.9, tinta on goiaba 5.2,
   creme on azulejo 5.9, creme on vinho 6.6). Same pairs in the printable page, the PDF and the share images. */
.n-raizes { --naipe: var(--agf-terracota-escuro); --naipe-fg: var(--agf-creme); }
.n-memorias { --naipe: var(--agf-mostarda); --naipe-fg: var(--agf-tinta); }
.n-mesa { --naipe: var(--agf-oliva); --naipe-fg: var(--agf-creme); }
.n-move { --naipe: var(--agf-goiaba); --naipe-fg: var(--agf-tinta); }
.n-sonhos { --naipe: var(--agf-azulejo); --naipe-fg: var(--agf-creme); }
.n-heranca { --naipe: var(--agf-vinho); --naipe-fg: var(--agf-creme); }
/* fan cards with two questions (A/B, equal weight) */
.carta--ab .carta__ab { margin: 0; padding: 10px 14px 0; font-family: var(--agf-fonte-titulo); font-weight: 700; font-size: .98rem; line-height: 1.2; display: flex; gap: 8px; }
.carta--ab .carta__ab + .carta__ab { border-top: 1px dashed var(--agf-tracejado); margin: 10px 14px 0; padding: 10px 0 0; }
.carta--ab .carta__ab b { flex: none; display: inline-grid; place-items: center; width: 1.5em; height: 1.5em; border-radius: 50%; background: var(--naipe); color: var(--naipe-fg); font-family: var(--agf-fonte-texto, inherit); font-size: .8rem; }
.carta--ab .carta__rod { margin-top: auto; padding-top: 8px; }
@media (max-width: 480px) {
  .carta { width: 160px; } .leque { height: 290px; } .carta__p { font-size: 1.1rem; }
  .carta:nth-child(1) { transform: rotate(-6deg); } .carta:nth-child(3) { left: 40%; transform: rotate(6deg); }
  .leque .carta:not(:last-child) .carta__p, .leque .carta:not(:last-child) .carta__rod { visibility: hidden; }
  .leque .carta:not(:last-child) .carta__ab { visibility: hidden; } .carta--ab .carta__ab { font-size: .84rem; padding-top: 8px; } .carta--ab .carta__ab + .carta__ab { margin-top: 8px; padding-top: 8px; }
}
.selos-linha { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 0 0 18px; }
.selos-linha li { border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio-pilula); padding: 4px 12px; font-size: .95rem; font-weight: 800; background: var(--agf-papel); }
.envelope { max-width: 440px; margin: 0 auto; transform: rotate(var(--agf-giro-1)); }
.envelope svg { width: 100%; height: auto; filter: drop-shadow(4px 4px 0 var(--agf-terracota)); }

/* the deck's full question list ({{PERGUNTAS_LISTA}}) */
details.abrir { border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio); background: var(--agf-papel); margin: 0 0 14px; overflow: hidden; box-shadow: 3px 3px 0 var(--naipe, var(--agf-tinta)); }
details.abrir > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; padding: 10px 16px; background: var(--naipe, var(--agf-azulejo)); color: var(--naipe-fg, var(--agf-creme)); font-weight: 800; font-size: 1.05rem; cursor: pointer; list-style: none; }
details.abrir > summary::-webkit-details-marker { display: none; }
.abrir__desc { display: block; margin-top: 2px; font-weight: 600; font-size: 1rem; }
details.abrir > summary::after { content: "+"; font-size: 1.6rem; line-height: 1; font-weight: 400; }
details.abrir[open] > summary::after { content: "\2212"; }
details.abrir > summary:focus-visible { outline-offset: -5px; outline-color: var(--agf-tinta); }
.perguntas-todas { margin: 0; padding: 16px 20px 18px 3.2em; font-size: 1.05rem; line-height: 1.45; }
ul.perguntas-todas { padding-left: 2.2em; }
.perguntas-todas li { padding: 6px 0; border-bottom: 1px dashed var(--agf-tracejado); break-inside: avoid; }
.perguntas-todas li:last-child { border-bottom: 0; }
.perguntas-todas li::marker { color: var(--r-texto-suave); font-weight: 800; }
@media (min-width: 900px) { .perguntas-todas { columns: 2; column-gap: 48px; } }

/* 18/10 sampler cards (/baralho/): deck band + two equal questions A and B */
.visualmente-oculto { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.estreito-largo { max-width: 1040px; }
.ac-grade { display: grid; gap: 16px; padding: 18px 16px 20px; }
@media (min-width: 640px) { .ac-grade { grid-template-columns: 1fr 1fr; } }
.ac { display: flex; flex-direction: column; background: var(--agf-papel); border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio); box-shadow: 3px 3px 0 var(--naipe); overflow: hidden; }
.ac__baralho { margin: 0; padding: 8px 14px; background: var(--naipe); color: var(--naipe-fg); font-size: .82rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.ac__tema { font-weight: 600; letter-spacing: .02em; text-transform: none; font-size: .95rem; }
.ac__tema::before { content: "· "; }
.ac__qs { list-style: none; margin: 0; padding: 4px 14px; flex: 1; }
.ac__qs li { display: flex; gap: 12px; align-items: flex-start; padding: 12px 0; font-family: var(--agf-fonte-titulo); font-weight: 700; font-size: 1.12rem; line-height: 1.25; }
.ac__qs li + li { border-top: 1px dashed var(--agf-tracejado); }
.ac__l { flex: none; display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--naipe); color: var(--naipe-fg); border: 2px solid var(--agf-tinta); font-family: var(--agf-fonte-texto, inherit); font-size: .95rem; font-weight: 800; line-height: 1; }
.ac__acoes { margin: 0; padding: 0 14px 10px; }
.ac__comp { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 800; }
.ac__comp::after { content: "\00a0\2197"; }
.sorteio { display: grid; gap: 28px; align-items: center; }
@media (min-width: 900px) { .sorteio { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 56px; } }
.sorteio__carta { max-width: 440px; width: 100%; margin: 0 auto; }
.sorteio__carta .ac { transform: rotate(var(--agf-giro-1)); box-shadow: 6px 6px 0 var(--agf-tinta); }
.sorteio__carta .ac__baralho { padding: 12px 18px; font-size: .95rem; }
.sorteio__carta .ac__qs { padding: 8px 18px 14px; }
.sorteio__carta .ac__qs li { font-size: 1.4rem; padding: 18px 0; }
.sorteio__carta .ac__l { width: 38px; height: 38px; font-size: 1.1rem; }
.sorteio__botoes { margin-top: 0; }
.sorteio__whats { margin: 20px 0 0; max-width: 52ch; }
.sorteio__status { margin: 10px 0 0; min-height: 1.5em; font-weight: 700; }
.sorteio__status:empty { display: none; }
@media (prefers-reduced-motion: no-preference) { .sorteio__carta .ac.ac--nova { animation: ac-entra .35s ease-out; } }
@keyframes ac-entra { from { opacity: 0; transform: rotate(-6deg) translateY(10px); } to { opacity: 1; transform: rotate(var(--agf-giro-1)); } }
.regras-amostra { font-size: 1.15rem; line-height: 1.5; padding-left: 1.4em; }
.regras-amostra li { margin: 0 0 10px; }
.story-previa { margin: 0 auto; max-width: 300px; transform: rotate(2deg); }
/* /baralho/ (Fi 18/10): photo-of-the-table block under the story template; the tree example as a taped sheet */
.baralho-foto { border-top: 2px dashed var(--agf-tracejado); padding-top: 18px; }
.baralho-foto h3 { margin: 0 0 .3em; }
.baralho-foto p { margin: 0 0 .4em; }
.baralho-arvore__folha { max-width: 340px; padding: 10px; --giro: -2deg; }
.baralho-arvore__folha img { display: block; width: 100%; height: auto; }
.story-previa img { display: block; width: 100%; height: auto; border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio); box-shadow: var(--agf-sombra-dura); background: var(--agf-creme); }

/* A Famiglia "Quem mora onde": one line per couple on phones */
.onde-lista { display: none; list-style: none; padding: 0; margin: 0; }
.onde-lista li { padding: 10px 0; border-top: 1px dashed var(--agf-tracejado); line-height: 1.4; }
.onde-lista li:last-child { border-bottom: 1px dashed var(--agf-tracejado); }
@media (max-width: 600px) { .tabela--onde { display: none; } .onde-lista { display: block; } }

/* ---------- 404 and thanks ---------- */
.pagina-404 .heroi, .pagina-obrigado .heroi { padding-bottom: 64px; }

/* ---------- footer: dark paper with a torn top edge ---------- */
.rodape { position: relative; background: var(--r-fundo-escuro); color: var(--r-texto-no-escuro); margin-top: 14px; }
.rodape__in { padding: 48px var(--agf-gutter) 32px; }
.rodape a { color: var(--agf-creme); text-decoration: none; }
.rodape a:hover { color: var(--agf-mostarda); text-decoration: underline; }
.rodape__grade { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 24px; }
.rodape__marca { grid-column: 1 / -1; }
.rodape__logo { display: inline-block; margin-bottom: 16px; border-radius: 6px; }
.rodape__logo img { height: 84px; width: auto; }
.rodape__marca p { color: var(--r-texto-suave-escuro); font-size: 1rem; margin: 0; }
.rodape__col h2 { font-family: var(--agf-fonte-mao); font-size: 1.65rem; font-weight: 700; line-height: 1.1; color: var(--agf-mostarda); margin: 0 0 6px; }
.rodape__col ul { list-style: none; padding: 0; margin: 0; }
.rodape__col a { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; font-size: 1.05rem; }
.rodape__base { margin-top: 34px; padding-top: 22px; border-top: 1px dashed var(--agf-tracejado-escuro); display: grid; gap: 10px; font-size: .95rem; }
.rodape__base p { margin: 0; }
.rodape__redes { display: flex; flex-wrap: wrap; gap: 4px 22px; }
.rodape__redes a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; white-space: nowrap; overflow-wrap: anywhere; }
.rodape__assina { font-family: var(--agf-fonte-mao); font-size: 1.8rem; font-weight: 700; line-height: 1.1; color: var(--agf-mostarda); }
.rodape__lingua { color: var(--r-texto-suave-escuro); }
.rodape__legal { display: flex; flex-wrap: wrap; gap: 4px 20px; align-items: center; }
.rodape__legal a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; }
.rodape__legal .link-botao { color: var(--agf-creme); }
.rodape__copy { color: var(--r-texto-suave-escuro); }
.rodape__legal, .rodape__base > .rodape__copy { font-size: .82rem; }
.rodape__legal + .rodape__copy { margin-top: -12px; }
@media (min-width: 900px) {
  .rodape__in { padding-top: 64px; }
  .rodape__grade { grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 40px; }
  .rodape__marca { grid-column: auto; }
  .rodape__grade--reduzida { grid-template-columns: 1.5fr 3fr; }
  .rodape__grade--reduzida ul { columns: 2; }
  .rodape__logo img { height: 96px; }
}

/* ---------- cookie banner (consent.js; off by default) ---------- */
.cookies { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 50; max-width: 560px; max-height: calc(100vh - 24px); overflow-y: auto; background: var(--agf-papel); color: var(--agf-tinta); border: 2px solid var(--agf-tinta); border-radius: var(--agf-raio); padding: 20px; font-size: 1rem; box-shadow: 0 6px 0 var(--agf-tinta), var(--agf-sombra-flutuante); }
.cookies h2 { font-size: 1.35rem; margin: 0 2.4rem 8px 0; outline: none; }
.cookies p { margin: 0 0 12px; }
.cookies a { color: var(--agf-terracota-escuro); font-weight: 800; }
.cookies__botoes { display: flex; flex-wrap: wrap; gap: 10px; }
.btn--cookie { min-height: 44px; padding: .45em 1.1em; font-size: 1rem; background: var(--agf-tinta); color: var(--agf-creme); }
.btn--cookie:hover { background: var(--agf-tinta); color: var(--agf-creme); }
.btn--cookie-claro { background: var(--agf-papel); color: var(--agf-tinta); }
.btn--cookie-claro:hover { background: var(--agf-branco); color: var(--agf-tinta); }
.cookies__prefs { border: 0; padding: 0; margin: 0 0 12px; display: grid; gap: 10px; }
.cookies__opcao { display: flex; gap: 10px; align-items: flex-start; }
.cookies__opcao input { width: 22px; height: 22px; accent-color: var(--agf-terracota-escuro); flex: none; }
.cookies__gpc { font-size: .9rem; color: var(--r-texto-suave); }
.cookies__x { position: absolute; top: 6px; right: 6px; width: 44px; height: 44px; background: none; border: 0; font-size: 1.7rem; cursor: pointer; color: var(--agf-tinta); }

/* ---------- reduced layout (/livro/) ---------- */
.topo--reduzido .nav a { font-size: 1rem; }
@media (min-width: 760px) { .topo--reduzido .menu-btn { display: none; } .topo--reduzido .nav, .js .topo--reduzido .nav, .js .topo--reduzido .nav.aberto { display: block; position: static; background: none; border: 0; box-shadow: none; } .topo--reduzido .nav ul { display: flex; gap: 4px; padding: 0; } .topo--reduzido .nav li { border: 0; } .topo--reduzido .nav a { min-height: 44px; padding: 0 10px; } }

/* ---------- dark-section overrides for light cards ---------- */
.secao--escuro .cartao, .secao--escuro .bolao__cartao { color: var(--r-texto); }
.secao--escuro .cartao .lead { color: var(--agf-tinta); }
.secao--escuro .cartao a:not(.btn) { color: var(--r-link); }
.secao--escuro .cartao .etiqueta { color: var(--r-mao); }
.secao--escuro .cartao .btn { border-color: var(--agf-tinta); box-shadow: var(--agf-sombra-botao); }
.secao--escuro .cartao .btn--principal { background: var(--r-botao-principal-bg); color: var(--r-botao-principal-fg); }
.secao--escuro .cartao .btn--depois { background: var(--r-botao-depois-bg); color: var(--r-botao-depois-fg); }
.secao--escuro .cartao :focus-visible { outline-color: var(--r-foco); }
.secao--escuro .aviso { color: var(--agf-tinta); }
.secao--escuro .aviso a:not(.btn) { color: var(--agf-azulejo-escuro); }

/* ---------- motion and print ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .btn:hover, .btn:active, .ep__link:hover .ep__capa { transform: none; }
}
@media print {
  .topo, .rodape, .compartilhar, .lista, .lista-inline, .cookies, .pular, .botoes, .padrao, .agf-versoes { display: none !important; }
  body { background: var(--agf-branco); font-size: 12pt; }
  .secao--papel::before, .secao--areia::before, .secao--escuro::before, .secao--ocre::before { display: none; }
  .cartao, .numeros li, .bolao__cartao { box-shadow: none; transform: none; }
  a { color: inherit; }
}

/* spacing helpers win over a component's own margin (keep last) */
.mt1.mt1 { margin-top: 16px; } .mt2.mt2 { margin-top: 32px; } .mt3.mt3 { margin-top: 48px; }

/* =====================================================================================================
   v1.2 (13/10): Codex review, reconciled (site_v12/RECONCILIACAO.md)
   ===================================================================================================== */
/* home: the three pinned origin chapters (direct Instagram links) as taped paper cards */
.origens { list-style: none; margin: 0 0 28px; padding: 0; display: grid; gap: 28px; }
@media (min-width: 760px) { .origens { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } }
.origem { position: relative; }
.origem::before { content: ""; position: absolute; top: -11px; left: 50%; width: 70px; height: 20px; margin-left: -35px; z-index: 2; background: var(--agf-kraft); opacity: .92; transform: rotate(-3deg); pointer-events: none; }
.origem:nth-child(2)::before { transform: rotate(4deg); }
.origem__link { display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 22px 20px 18px; background: var(--agf-papel); color: var(--agf-tinta); text-decoration: none; border: 2px solid var(--agf-tinta); border-radius: 4px; box-shadow: 4px 4px 0 var(--agf-terracota); transform: rotate(-.6deg); }
.origem:nth-child(2) .origem__link { box-shadow: 4px 4px 0 var(--agf-azulejo); transform: rotate(.5deg); }
.origem:nth-child(3) .origem__link { box-shadow: 4px 4px 0 var(--agf-mostarda); transform: rotate(-.3deg); }
.origem__link:hover .origem__t { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.origem__n { font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 1.35rem; line-height: 1.1; color: var(--agf-terracota-escuro); }
.origem__t { font-family: var(--agf-fonte-titulo); font-weight: 700; font-size: 1.45rem; line-height: 1.15; }
.origem__d { font-size: 1rem; line-height: 1.45; }
.origem__cta { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 10px; font-weight: 800; }
.origem__cta .ico { width: 20px; height: 20px; }
@media (prefers-reduced-motion: reduce) { .origem__link { transform: none; } }

/* home: the short family teaser, pairs as linked names */
.ramos-nomes { list-style: none; margin: 20px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.ramos-nomes__item { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0 6px; padding: 4px 12px; font-weight: 700; line-height: 1.3; background: var(--agf-papel); border: 2px solid var(--agf-tinta); border-left: 8px solid var(--ramo, var(--agf-mostarda)); border-radius: 4px; }
.ramos-nomes__item a { display: inline-block; min-width: 44px; text-align: center; padding: 11px 0; color: var(--agf-tinta); text-decoration: underline; text-underline-offset: 3px; }
.ramos-nomes__netos { padding: 15px 12px; font-family: var(--agf-fonte-mao); font-size: 1.3rem; line-height: 1; border-style: dashed; border-left-width: 2px; }

/* A Famiglia: 7 branches (named after the pair), every card the same size: 1:1 polaroid + name + headline + bio */
.elenco-casas--completo { display: grid; gap: 52px; }
.elenco-casas--completo .casa { width: 100%; padding: 40px 16px 24px; }
.elenco-casas--completo .casa__lista { display: grid; grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); gap: 32px; }
.elenco-casas--completo .gente { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 18px; align-items: start; }
.elenco-casas--completo .gente__foto { aspect-ratio: 1 / 1; }
.elenco-casas--completo .gente__tag { font-size: 1.3rem; }
.elenco-casas--completo .netos-caixa { justify-self: center; }
@media (min-width: 760px) {
  .elenco-casas--completo .casa { padding: 42px 24px 28px; }
  .elenco-casas--completo .casa__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
  .elenco-casas--completo .gente { grid-template-columns: 150px minmax(0, 1fr); }
}
@media (max-width: 419px) {
  .elenco-casas--completo .gente { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .elenco-casas--completo .gente__moldura { width: 150px; }
}
.secao--fim-historia { padding-top: 0; }

/* ---------- v1.2 real photos (13/10): <figure class="foto-real foto-real--TIPO"> with <picture>; see src/fotos.json ----------
   Scrapbook look kept: white polaroid frame, washi tape, a small tilt, handwritten caption on the white strip.
   Photos keep their own framing (height: auto, never a cover crop that cuts people off); only the cast portraits are 1:1. */
.foto-real { position: relative; margin: 0; width: 100%; background: var(--agf-branco); padding: 10px 10px 12px; border-radius: 3px;
  box-shadow: var(--agf-sombra-papel); transform: rotate(var(--giro, -1deg)); }
.foto-real::before { content: ""; position: absolute; top: -12px; left: 50%; width: 92px; height: 24px; margin-left: -46px; z-index: 2;
  background: repeating-linear-gradient(45deg, var(--fita-1, var(--agf-fita-mostarda-1)) 0 8px, var(--fita-2, var(--agf-fita-mostarda-2)) 8px 16px);
  transform: rotate(-3deg); box-shadow: 0 1px 2px var(--agf-tracejado); pointer-events: none; }
.foto-real__img { position: relative; }
.foto-real img { display: block; width: 100%; height: auto; background: var(--agf-papel); }
.foto-real__leg { padding: 8px 4px 0; font-family: var(--agf-fonte-mao); font-weight: 700; font-size: 1.35rem; line-height: 1.15; text-align: center; color: var(--agf-tinta); }
/* the AI projection: a visible label on the image itself (solid chip, not text over the photo) */
.foto-real__ia { position: absolute; left: 8px; top: 8px; z-index: 1; padding: 4px 10px; font-family: var(--agf-fonte-texto, inherit); font-size: .85rem; font-weight: 800; line-height: 1.3; letter-spacing: .02em; color: var(--agf-creme); background: var(--agf-tinta); border-radius: 3px; }
/* inside an existing polaroid (.moldura) the frame is already there */
.moldura > .foto-real { padding: 0; box-shadow: none; transform: none; background: transparent; }
.moldura > .foto-real::before { content: none; }
.moldura > .foto-real .foto-real__leg { padding-top: 10px; font-size: 1.45rem; }
/* sizes: hero/column photos stay at the polaroid width; small ones never above their supplied pixels */
.heroi__grade > .foto-real, .dois > .foto-real, .dois > div > .foto-real { max-width: 480px; margin: 12px auto; }
.foto-real--pequena { max-width: 360px; margin: 18px auto 0; }
.foto-real--historia { max-width: 540px; margin: 8px auto 28px; --giro: .8deg; }
.foto-real--coluna { max-width: 480px; }
#mural .foto-real { max-width: 520px; margin: 8px auto 28px; --giro: 1deg; }
.temporada__lado { display: grid; gap: 28px; justify-items: center; }
.temporada__lado .foto-real { max-width: 300px; --giro: 2deg; }
/* sober register (press, brands): no tilt, no tape, no hand font */
.foto-real--sobria { transform: none; box-shadow: none; border: 1.5px solid var(--agf-tinta); padding: 6px; }
.foto-real--sobria::before { content: none; }
.foto-real--sobria .foto-real__leg { font-family: inherit; font-size: .95rem; font-weight: 700; padding-top: 6px; }
.grade > .foto-real { align-self: start; }
.grade > .foto-real--sobria { max-width: none; }
/* A Vila, "Antes e agora": simple paired cards (no sliders, no overlays) */
.antes-grade { display: grid; gap: 32px; margin-top: 24px; }
@media (min-width: 760px) { .antes-grade { grid-template-columns: repeat(2, minmax(0, 1fr)); } .antes-cartao--largo { grid-column: 1 / -1; } }
.antes-cartao .h3 { margin-top: 0; }
.par, .trio { display: grid; gap: 16px 14px; align-items: start; margin-top: 14px; }
.par { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 700px) { .trio { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.par .foto-real, .trio .foto-real { padding: 6px 6px 8px; --giro: -.8deg; }
.par .foto-real:nth-child(2), .trio .foto-real:nth-child(2) { --giro: .9deg; }
.par .foto-real::before, .trio .foto-real::before { width: 56px; height: 18px; margin-left: -28px; top: -9px; }
.par .foto-real__leg, .trio .foto-real__leg { font-size: 1.2rem; padding-top: 6px; }
/* Bodas, "Antes de toda essa gente": the archive photo + the wedding placeholder side by side */
.bodas-fotos { display: grid; gap: 22px; align-items: start; }
@media (min-width: 560px) { .bodas-fotos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.bodas-fotos .foto { aspect-ratio: 1; }
/* the cast: supplied portraits fill the same 1:1 polaroid slot (shown <= ~150 CSS px: the small crops are never blown up) */
.gente__foto--real { padding: 0; border: 1.5px solid var(--agf-tinta); background: var(--agf-papel); }
.gente__foto--real picture { display: block; width: 100%; height: 100%; }
.gente__foto--real img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.foto-real--historia.foto-real--vertical { max-width: 380px; }
.foto-real--pequena.foto-real--vertical { max-width: 300px; }

/* v1.2 step 5 (14/10): /sobre/ FAQ (same details.abrir look as the deck), art placeholders (arte.json) */
.faq-lista details.abrir > summary h2 { margin: 0; font: inherit; color: inherit; letter-spacing: normal; }
.faq__r { padding: 14px 18px 16px; line-height: 1.5; }
.faq__r p { margin: 0; }
.foto-real--arte img { background: transparent; }
.gente__foto--arte { border-style: solid; }
.ep-fachada .ep__capa--grande .selo-img--grande { width: 46%; max-width: 168px; }
/* 6c cold read (14/10): the home letter strip, one link per pair in the home teaser, the folded series seals on /assista/ */
.faixa-cartas { background: var(--agf-mostarda); color: var(--agf-tinta); border-top: 2px solid var(--agf-tinta); border-bottom: 2px solid var(--agf-tinta); }
.faixa-cartas__in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 20px; padding-top: 10px; padding-bottom: 10px; }
.faixa-cartas p { margin: 0; font-weight: 600; }
.faixa-cartas .link-seta { color: var(--agf-tinta); text-decoration: underline; text-underline-offset: 3px; }
.ramos-nomes__item a { padding-left: 2px; padding-right: 2px; }
.selos-dobra > summary h2 { margin: 0; font: inherit; color: inherit; letter-spacing: normal; }
.selos-dobra__in { padding: 18px 18px 8px; }

/* ---- Kit da Famiglia journeys (24/10): landing header, download cards, "Depois de baixar", QR strip ---- */
.topo--landing .topo__in { justify-content: space-between; }
.topo__links { display: flex; align-items: center; gap: 4px; }
.topo__links a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: var(--agf-raio-pilula); color: var(--agf-tinta); text-decoration: none; font-weight: 800; font-size: 1rem; white-space: nowrap; }
.topo__links a:hover { background: var(--agf-papel); }
.topo__links a:last-child { background: var(--agf-mostarda); border: 2px solid var(--agf-tinta); box-shadow: 0 2px 0 var(--r-sombra-dura); }
@media (max-width: 420px) { .topo__links a { padding: 0 9px; font-size: .95rem; } }
.rodape--landing .rodape__grade--reduzida ul { columns: 2; }
.kit-mini .foto-real__img { background: var(--agf-branco); }
.kit-mini img { border: 2px solid var(--agf-tinta); border-radius: 6px; box-shadow: var(--agf-sombra-dura); background: #fff; }
.kit-grade .kit-item { display: grid; grid-template-columns: 96px 1fr; gap: 16px; align-items: start; }
.kit-item__mini { width: 96px; height: auto; border: 1.5px solid var(--agf-tinta); border-radius: 4px; background: #fff; }
.kit-item h3 { margin-top: 0; }
.kit-item p:last-child { margin-bottom: 0; }
@media (max-width: 420px) { .kit-grade .kit-item { grid-template-columns: 72px 1fr; gap: 12px; } .kit-item__mini { width: 72px; } }
.kit-depois .botoes { margin-top: 18px; }
.kit-depois__cartas { margin-top: 30px; padding-top: 22px; border-top: 2px dashed var(--agf-tracejado); }
.kit-depois__cartas > p { margin: 0 0 6px; }
.centro { text-align: center; }
.aviso-qr { background: var(--agf-mostarda); color: var(--agf-tinta); border-bottom: 2px solid var(--agf-tinta); }
.aviso-qr__in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 20px; padding-top: 10px; padding-bottom: 10px; }
.aviso-qr p { margin: 0; font-weight: 700; }
.aviso-qr .btn { min-height: 40px; padding: .3em .9em; font-size: .95rem; }