/*
  Design Family: ochre-geometric
  Conteúdo sempre retangular. Curva só na borda de faixa e em um círculo decorativo.
  Escopo por atributo (R11). Nada aqui sobe para foundation/core-tokens.css.
*/
[data-ws2-family="ochre-geometric"] {
  /* cor */
  --pog-ochre: #D9B84A;
  --pog-ochre-deep: #B3932A;
  --pog-ochre-pale: #F3E8C4;
  --pog-blush-grey: #EADFDC;
  --pog-taupe: #74655E;
  --pog-taupe-deep: #5A4D47;
  --pog-paper: #FFFFFF;
  --pog-ink: #2E2926;
  --pog-muted: #6A5F59;
  --pog-line: rgba(46, 41, 38, 0.16);

  /* papéis: ocre é superfície e ação; não existe verde nesta família */
  --pog-bg: var(--pog-paper);
  --pog-panel-primary: var(--pog-ochre);
  --pog-panel-secondary: var(--pog-blush-grey);
  --pog-close: var(--pog-taupe);
  --pog-text: var(--pog-ink);
  --pog-text-muted: var(--pog-muted);
  --pog-action: var(--pog-ochre);
  --pog-action-hover: var(--pog-ochre-deep);

  /* tipografia */
  --pog-font-heading: "Spectral", Georgia, serif;
  --pog-font-body: "IBM Plex Sans", system-ui, sans-serif;
  --pog-nav-size: 15px;
  --pog-body-size: 17px;
  --pog-label-tracking: 0.12em;
  --pog-section-heading: clamp(28px, 3.2vw, 44px);
  --pog-hero-heading: clamp(32px, 3.8vw, 52px);
  --pog-band-heading: clamp(34px, 4.4vw, 60px);
  --pog-body-leading: 1.72;

  /* forma: zero em conteúdo */
  --pog-radius-content: 0;
  --pog-radius-button: 2px;
  --pog-border: 1px solid var(--pog-line);
  --pog-button-shadow: 0 2px 0 rgba(46, 41, 38, 0.18);

  /* ritmo */
  --pog-container: 1180px;
  --pog-measure: 760px;
  --pog-band-y: clamp(64px, 8vw, 100px);
  --pog-header-h: 96px;

  /* motion */
  --pog-motion-profile: "horizontal-wipe";
  --pog-ease: var(--ws2-ease-out);
}