/* ===== fonts ===== */
/* Webfonts: Lora (display/serif) + Source Sans 3 (UI/body), served by Google Fonts.
   No brand font files were provided by the client — see readme.md > Typography. */
@import url("https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;1,400&family=Source+Sans+3:ital,wght@0,300;0,400;0,500;0,600;1,400&display=swap");

/* ===== colors ===== */
:root{
  /* --- Base ramps ------------------------------------------------ */
  /* Areia / sand — backgrounds and section fills */
  --sand-50:#F7F4EF;   /* "Fundo" — client-approved */
  --sand-100:#EDE6DC;  /* "Seções" — client-approved */
  --sand-200:#E3DACC;
  --sand-300:#D3C7B5;
  --white:#FFFFFF;

  /* Verde-petróleo — primary */
  --petrol-100:#DCE7E5;
  --petrol-200:#B9CFCC;
  --petrol-400:#4E817D;
  --petrol-600:#2F5D5A;  /* "Primária" — client-approved */
  --petrol-700:#264B49;
  --petrol-900:#18332F;

  /* Ink — text */
  --ink-900:#1F2A2E;   /* "Texto" — client-approved */
  --ink-700:#35464B;
  --ink-600:#4C5D62;
  --ink-400:#77878C;
  --ink-200:#A9B4B7;

  /* Terracota — accent / detail */
  --clay-100:#F3E2D8;
  --clay-300:#DDAF95;
  --clay-600:#B8704F;  /* "Detalhe" — client-approved */
  --clay-700:#9A5A3D;

  /* Semantic hues (derived, kept low-chroma to sit beside the brand) */
  --green-600:#3F7D5C;
  --green-100:#DFEBE3;
  --amber-600:#A9803B;
  --amber-100:#F3E8D2;
  --red-600:#A8483A;
  --red-100:#F4DFDB;

  /* --- Semantic aliases ------------------------------------------ */
  --surface-page:var(--sand-50);
  --surface-section:var(--sand-100);
  --surface-card:var(--white);
  --surface-inset:var(--sand-100);
  --surface-inverse:var(--petrol-900);
  --surface-accent-soft:var(--petrol-100);
  --surface-clay-soft:var(--clay-100);

  --text-body:var(--ink-900);
  --text-muted:var(--ink-600);
  --text-subtle:var(--ink-400);
  --text-on-primary:var(--sand-50);
  --text-on-inverse:var(--sand-100);
  --text-link:var(--petrol-600);
  --text-link-hover:var(--petrol-700);
  --text-accent:var(--clay-700);

  --border-hairline:#E2DAD0;
  --border-default:var(--sand-300);
  --border-strong:var(--ink-200);
  --border-focus:var(--petrol-600);

  --primary:var(--petrol-600);
  --primary-hover:var(--petrol-700);
  --primary-active:var(--petrol-900);
  --accent:var(--clay-600);
  --accent-hover:var(--clay-700);

  --feedback-success:var(--green-600);
  --feedback-success-soft:var(--green-100);
  --feedback-warning:var(--amber-600);
  --feedback-warning-soft:var(--amber-100);
  --feedback-danger:var(--red-600);
  --feedback-danger-soft:var(--red-100);

  --focus-ring:0 0 0 3px rgba(47,93,90,.28); /* @kind shadow */
  --overlay-scrim:rgba(24,51,47,.42); /* @kind color */
}

/* ===== typography ===== */
:root{
  --font-display:"Lora",Georgia,"Times New Roman",serif;
  --font-sans:"Source Sans 3","Helvetica Neue",Helvetica,sans-serif;
  --font-mono:ui-monospace,"SFMono-Regular",Menlo,monospace;

  --fs-display:64px; /* @kind font */
  --fs-h1:48px; /* @kind font */
  --fs-h2:1.75rem; /* @kind font */ /* 28 */
  --fs-h3:1.375rem; /* @kind font */ /* 22 */
  --fs-lead:1.1875rem; /* @kind font */ /* 19 */
  --fs-body:1.0625rem; /* @kind font */ /* 17 */
  --fs-sm:0.9375rem; /* @kind font */ /* 15 */
  --fs-xs:0.8125rem; /* @kind font */ /* 13 */
  --fs-eyebrow:0.75rem; /* @kind font */ /* 12 */

  --lh-tight:1.15; /* @kind font */
  --lh-heading:1.25; /* @kind font */
  --lh-body:1.6; /* @kind font */
  --lh-loose:1.75; /* @kind font */

  --ls-display:-0.015em; /* @kind font */
  --ls-heading:-0.01em; /* @kind font */
  --ls-body:0; /* @kind font */
  --ls-eyebrow:0.14em; /* @kind font */

  --fw-light:300; /* @kind font */
  --fw-regular:400; /* @kind font */
  --fw-medium:500; /* @kind font */
  --fw-semibold:600; /* @kind font */

  --measure-prose:64ch; /* @kind other */
  --measure-narrow:46ch; /* @kind other */
}
/* Fluid step-down for narrow viewports — kept out of the token values so they stay literal. */
@media (max-width:720px){:root{--fs-display:40px; /* @kind font */ --fs-h1:32px; /* @kind font */ --fs-h2:24px; /* @kind font */}}

/* ===== spacing ===== */
:root{
  --space-0:0;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --space-7:48px;
  --space-8:64px;
  --space-9:96px;
  --space-10:128px;

  --gutter:24px;
  --section-y:clamp(56px,7vw,112px); /* @kind spacing */
  --container-max:1120px; /* @kind spacing */
  --container-narrow:720px; /* @kind spacing */
  --control-h-sm:36px; /* @kind spacing */
  --control-h-md:44px; /* @kind spacing */
  --control-h-lg:52px; /* @kind spacing */
}

/* ===== radius ===== */
:root{
  --radius-xs:3px;
  --radius-sm:6px;
  --radius-md:10px;
  --radius-lg:16px;
  --radius-xl:24px;
  --radius-pill:999px;
  --radius-card:var(--radius-md);
  --radius-control:var(--radius-sm);
  --border-width:1px; /* @kind spacing */
}

/* ===== elevation ===== */
:root{
  --shadow-none:none;
  --shadow-xs:0 1px 2px rgba(31,42,46,.06);
  --shadow-sm:0 1px 3px rgba(31,42,46,.07),0 1px 1px rgba(31,42,46,.04);
  --shadow-md:0 6px 18px rgba(31,42,46,.08);
  --shadow-lg:0 18px 40px rgba(24,51,47,.14);
  --shadow-inset-hairline:inset 0 0 0 1px var(--border-hairline);
  --blur-veil:saturate(1.05) blur(12px); /* @kind other */
}

/* ===== motion ===== */
:root{
  --ease-standard:cubic-bezier(.32,.72,.36,1); /* @kind other */
  --ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */
  --dur-instant:90ms; /* @kind other */
  --dur-fast:160ms; /* @kind other */
  --dur-base:240ms; /* @kind other */
  --dur-slow:420ms; /* @kind other */
  --transition-control:color var(--dur-fast) var(--ease-standard),background-color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard); /* @kind other */
}
@media (prefers-reduced-motion:reduce){:root{--dur-instant:0ms; /* @kind other */ --dur-fast:0ms; /* @kind other */ --dur-base:0ms; /* @kind other */ --dur-slow:0ms /* @kind other */}}

/* ===== base ===== */
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface-page);color:var(--text-body);font-family:var(--font-sans);font-size:var(--fs-body);line-height:var(--lh-body);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:var(--fw-regular);line-height:var(--lh-heading);letter-spacing:var(--ls-heading);color:var(--text-body);margin:0 0 var(--space-4)}
h1{font-size:var(--fs-h1);letter-spacing:var(--ls-display)}
h2{font-size:var(--fs-h2)}
h3{font-size:var(--fs-h3)}
p{margin:0 0 var(--space-4);max-width:var(--measure-prose);text-wrap:pretty}
a{color:var(--text-link);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;transition:color var(--dur-fast) var(--ease-standard)}
a:hover{color:var(--text-link-hover)}
:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}
small{font-size:var(--fs-sm);color:var(--text-muted)}
hr{border:0;border-top:1px solid var(--border-hairline);margin:var(--space-6) 0}