/*
  Design Family: linen-garnet
  Vitrine de fotografia enorme: a foto sangra de ponta a ponta, o texto mora numa coluna estreita, o
  movimento é lento e contínuo. Linho é a página; tinta é o texto; granada só em selo e promoção;
  ferrugem só em destaque pequeno; latão só na faixa que corre. Canto reto. Escopo por atributo (R11).
*/
[data-ws2-family="linen-garnet"] {
  --lg-linen: #F2EEE8;
  --lg-linen-deep: #E8E1D7;
  --lg-paper: #FBF9F6;
  --lg-ink: #1C1917;
  --lg-muted: #5E554D;
  --lg-line: rgba(28, 25, 23, .14);
  --lg-white: #FFFFFF;

  /* acento (R26): selo, preço promocional, faixa de promoção — branco sobre ele passa de 9:1 */
  --lg-accent: #7A2433;
  --lg-accent-deep: #5E1A27;
  /* destaque pequeno sobre o linho (aba ativa, rótulos): 5,3:1 */
  --lg-rust: #A3461F;
  /* faixa que corre: texto em tinta (8:1), nunca branco */
  --lg-band: #D9A93A;
  --lg-band-ink: var(--lg-ink);

  --lg-font-heading: "Jost", "Futura", "Century Gothic", system-ui, sans-serif;
  --lg-font-ui: "Albert Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --lg-font-wordmark: "Young Serif", Georgia, "Times New Roman", serif;
  --lg-nav-size: 13px;
  --lg-body-size: 16px;
  --lg-price-size: 18px;
  --lg-hero-heading: clamp(34px, 4vw, 58px);
  --lg-section-heading: clamp(28px, 2.6vw, 40px);
  --lg-heading-track: .07em;
  --lg-body-leading: 1.6;

  --lg-radius: 0px;
  --lg-radius-story: 14px;
  --lg-radius-icon: 999px;
  --ws2-social-radius: 999px;
  --ws2-map-radius: 0px;

  --lg-container: 1440px;
  --lg-gutter: clamp(16px, 3.6vw, 56px);
  --lg-band-y: clamp(56px, 7vw, 112px);
  --lg-header-h: 76px;
  --lg-gap: clamp(8px, .8vw, 14px);

  --lg-motion-profile: "linen-drift";
  --lg-ease: cubic-bezier(.22, .61, .36, 1);
  --lg-drift: 46s;      /* uma volta da faixa de texto */
  --lg-mosaic: 90s;     /* uma volta do mosaico */
}

/* Esquemas de acento (R26) ------------------------------------------------------------------
   A identidade desta família é a escala e a composição — foto que sangra, coluna estreita de texto,
   minúscula espaçada nos títulos, canto reto. O acento e a faixa que corre acompanham a marca da loja.
   Uso: <body data-ws2-family="linen-garnet" data-ws2-accent="forest"> */
[data-ws2-family="linen-garnet"][data-ws2-accent="forest"] {
  --lg-accent: #2F4A3A;
  --lg-accent-deep: #22372B;
}
[data-ws2-family="linen-garnet"][data-ws2-accent="ink"] {
  --lg-accent: #1C1917;
  --lg-accent-deep: #000000;
  --lg-band: #D8C7AE;
}
