/*
  Design Family: sepia-didone
  Editorial de moda em papel claro: fotos na tela inteira com textura de filme antigo (cor lavada, grão que treme, linhas
  finas, cantos escuros), o nome gigante numa didone fina esticada de ponta a ponta, todo o texto em mono maiúsculo, as
  13 colunas finas por trás de tudo e um vermelho de linha só no que importa (a faixa da lista, os números, o ponto).
  v1.66: inspirada em references/atelier/reference-01 (variação, R32). A Lya escolheu, entre três esboços, o ateliê sob
  medida, com o nome na borda de baixo do destaque e as seções no papel claro (não no escuro).
  Escopo por atributo (R11).
*/
[data-ws2-family="sepia-didone"] {
  --sd-paper: #EDEAE4;          /* papel: a página (a cor do esboço da Bia Torres, escolha da Lya) — 14,4:1 com a tinta */
  --sd-paper-2: #E3DED5;        /* caixa do retalho e fundo das fotos */
  --sd-ink: #211915;            /* tinta café-preta: texto e linhas */
  --sd-muted: #5E544D;          /* apoio (6,1:1 no papel) */
  --sd-on-photo: #F5EEE4;       /* texto sobre foto e na faixa escura (15,6:1 no escuro) */
  --sd-dark: #1C1512;           /* faixa do rodapé, cartões de vidro, fundo atrás das fotos */
  --sd-accent: #A3372A;         /* vermelho de linha: a faixa da lista (texto claro por cima, 5,8:1), números, pontos; texto no papel 5,6:1 */
  --sd-on-accent: #F5EEE4;
  --sd-line: rgba(33, 25, 21, .075);        /* as 13 colunas no papel */
  --sd-line-photo: rgba(245, 238, 228, .1); /* as colunas sobre a foto */
  --sd-rule: rgba(33, 25, 21, .2);          /* linhas das tabelas e listas */

  /* o filme: o mesmo tratamento em toda foto de pessoa e de ambiente (o grão e as linhas ficam no style.css da receita) */
  --sd-film-filter: saturate(.58) sepia(.32) contrast(1.07) brightness(.82);
  --sd-film-soft: saturate(.7) sepia(.22) contrast(1.04) brightness(.95);
  --sd-film-tone: #6B4A3A;      /* tom quente por cima (soft-light) */

  --sd-font-display: "Bodoni Moda", "Didot", "Bodoni 72", Georgia, serif;   /* só no nome gigante e nos links do menu */
  --sd-font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;   /* todo o resto */
  --sd-text: .94rem;
  --sd-small: .78rem;           /* mono maiúsculo das frases curtas, links e tabelas */
  --sd-title: clamp(1.45rem, 2.25vw, 2.05rem);
  --sd-title-lg: clamp(1.8rem, 3.3vw, 3rem);
  --sd-leading: 1.55;

  --sd-container: 1300px;
  --sd-gutter: clamp(16px, 4.9vw, 70px);
  --sd-section-y: clamp(80px, 9vw, 140px);
  --sd-header-h: 64px;
  --ws2-social-radius: 0;

  --sd-motion-profile: "film-stitch";
  --sd-ease: cubic-bezier(.65, 0, .35, 1);
  --sd-ease-out: cubic-bezier(.22, 1, .36, 1);
}

/* Esquemas de acento (R26) ------------------------------------------------------------------------
   A identidade é a foto com filme, o nome gigante na borda, o mono maiúsculo e as 13 colunas. O acento troca só o
   vermelho de linha (faixa da lista, números, pontos); texto claro sobre ele e o tom no papel ficam ≥ 4,5:1.
   Uso: <body data-ws2-family="sepia-didone" data-ws2-accent="rosa"> */
[data-ws2-family="sepia-didone"][data-ws2-accent="rosa"] {   /* rosa-antigo, para noivas e festa (5,4:1 no papel) */
  --sd-accent: #9C3D5C;
}
[data-ws2-family="sepia-didone"][data-ws2-accent="oliva"] {  /* oliva, para alfaiataria e linho (5,4:1 no papel) */
  --sd-accent: #5A6238;
}