/* Gestar Segura — design tokens. Paleta derivada da logo; tipografia Fraunces (display) + Hanken Grotesk (texto). */
:root{
  /* superfícies */
  --bg:#F6EEE8;          /* linho */
  --surface:#FCF9F6;     /* papel */
  --surface-2:#F1E6DF;
  --blush:#EFDBD5;
  --blush-2:#E4C8BF;
  --border:#E6D8CF;
  --border-strong:#D6C2B7;
  /* tinta */
  --ink:#2A201C;
  --ink-2:#5A3A32;       /* marrom */
  --ink-3:#7D6259;       /* marrom-2, AA sobre linho */
  --ink-4:#9A8279;       /* só decorativo */
  /* acento */
  --rose:#A2685F;
  --rose-ink:#7E4E47;
  --rose-soft:#F4E4DF;
  --sage:#5F7359;
  --sage-soft:#E3E9DE;
  --gold:#B08A4A;
  --gold-soft:#F3EBDB;
  --danger:#9E3B3B;
  --danger-soft:#F6E1E1;
  --on-dark:#F6EEE8;

  /* tipografia */
  --font-display:"Fraunces","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --font-text:"Hanken Grotesk","Inter","Helvetica Neue",Arial,sans-serif;
  --fs-xs:.75rem; --fs-sm:.875rem; --fs-md:1rem; --fs-lg:1.125rem;
  --fs-h4:clamp(1.15rem,1rem + .6vw,1.35rem);
  --fs-h3:clamp(1.35rem,1.1rem + 1vw,1.75rem);
  --fs-h2:clamp(1.9rem,1.4rem + 2vw,2.9rem);
  --fs-h1:clamp(2.5rem,1.6rem + 4vw,4.6rem);
  --lh-tight:1.08; --lh-snug:1.25; --lh-body:1.55; --lh-read:1.65;
  --track-tight:-.022em; --track-caps:.12em;

  /* ritmo */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px;
  --pad:20px;
  --r-sm:8px; --r-md:14px; --r-lg:20px; --r-xl:28px; --r-pill:999px;

  /* profundidade: sombras quentes, difusas */
  --shadow-1:0 1px 2px rgba(42,32,28,.06),0 2px 8px -2px rgba(42,32,28,.06);
  --shadow-2:0 4px 16px -6px rgba(42,32,28,.14),0 1px 3px rgba(42,32,28,.05);
  --shadow-3:0 24px 48px -24px rgba(42,32,28,.35),0 4px 12px -6px rgba(42,32,28,.08);

  /* movimento */
  --ease:cubic-bezier(.2,.7,.2,1);
  --t-fast:150ms; --t-base:220ms; --t-slow:400ms;

  --focus:0 0 0 3px var(--bg),0 0 0 5px var(--rose);
}
@media (min-width:1000px){:root{--pad:32px}}

*,*::before,*::after{box-sizing:border-box}
html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-text);font-size:var(--fs-md);line-height:var(--lh-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"ss01","cv11"}
h1,h2,h3,h4{margin:0;font-family:var(--font-display);font-weight:400;color:var(--ink-2);line-height:var(--lh-tight);letter-spacing:var(--track-tight);font-variation-settings:"opsz" 144,"SOFT" 30}
h1{font-size:var(--fs-h1)} h2{font-size:var(--fs-h2)} h3{font-size:var(--fs-h3);line-height:var(--lh-snug)} h4{font-size:var(--fs-h4);line-height:var(--lh-snug)}
p{margin:0} ul,ol{margin:0;padding:0} li{list-style:none}
a{color:var(--rose-ink);text-decoration:none}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;padding:0}
:focus-visible{outline:none;box-shadow:var(--focus);border-radius:var(--r-sm)}
::selection{background:var(--blush-2);color:var(--ink)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;scroll-behavior:auto!important}}

/* utilitários */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:var(--fs-xs);font-weight:600;letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--rose-ink)}
.eyebrow::before{content:"";width:18px;height:1px;background:var(--rose)}
.eyebrow.plain::before{display:none}
.muted{color:var(--ink-3)} .small{font-size:var(--fs-sm)} .em{font-style:italic;font-weight:500;color:var(--rose-ink)}
.lede{font-size:var(--fs-lg);line-height:var(--lh-body);color:var(--ink-3);max-width:56ch}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 22px;border-radius:var(--r-pill);border:1px solid var(--ink-2);background:var(--ink-2);color:var(--on-dark);font-weight:500;font-size:var(--fs-md);white-space:nowrap;transition:background var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease),transform var(--t-fast) var(--ease),box-shadow var(--t-fast) var(--ease)}
.btn:hover{background:var(--rose-ink);border-color:var(--rose-ink)}
.btn:active{transform:translateY(1px)}
.btn.ghost{background:transparent;color:var(--ink-2)}
.btn.ghost:hover{background:var(--surface);color:var(--rose-ink);border-color:var(--rose-ink)}
.btn.soft{background:var(--blush);border-color:transparent;color:var(--rose-ink)}
.btn.soft:hover{background:var(--blush-2)}
.btn.light{background:var(--bg);border-color:var(--bg);color:var(--ink-2)}
.btn.light:hover{background:var(--surface);border-color:var(--surface)}
.btn.outline-light{background:transparent;border-color:rgba(246,238,232,.5);color:var(--on-dark)}
.btn.outline-light:hover{border-color:var(--on-dark);background:rgba(246,238,232,.08)}
.btn.sm{min-height:36px;padding:0 16px;font-size:var(--fs-sm)}
.btn.lg{min-height:52px;padding:0 28px;font-size:var(--fs-lg)}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn svg{width:18px;height:18px;flex:none}
.link{color:var(--rose-ink);font-weight:500;display:inline-flex;align-items:center;gap:6px;min-height:44px;transition:color var(--t-fast)}
.link:hover{color:var(--ink-2)}
.link svg{width:16px;height:16px;transition:transform var(--t-base) var(--ease)}
.link:hover svg{transform:translateX(3px)}
.icon{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* campos */
.field{display:grid;gap:6px}
.field label{font-size:var(--fs-sm);font-weight:500;color:var(--ink-2)}
.field .hint{font-size:var(--fs-xs);color:var(--ink-3)}
.input,input.input,select.input,textarea.input{width:100%;min-height:46px;padding:10px 14px;border:1px solid var(--border-strong);border-radius:var(--r-md);background:var(--surface);color:var(--ink);transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.input:hover{border-color:var(--rose)}
.input:focus-visible{border-color:var(--rose);box-shadow:0 0 0 3px var(--rose-soft)}
textarea.input{min-height:120px;resize:vertical;line-height:var(--lh-body)}
select.input{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237E4E47' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:38px}
.input::placeholder{color:var(--ink-4)}

/* chips / pills */
.pill{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-xs);font-weight:600;letter-spacing:.02em;padding:4px 10px;border-radius:var(--r-pill);background:var(--blush);color:var(--rose-ink);white-space:nowrap}
.pill.sage{background:var(--sage-soft);color:var(--sage)} .pill.gold{background:var(--gold-soft);color:#7F6231} .pill.neutral{background:var(--surface-2);color:var(--ink-3)}
.chip{display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border-radius:var(--r-pill);border:1px solid var(--border-strong);background:var(--surface);color:var(--ink-2);font-size:var(--fs-sm);font-weight:500;transition:all var(--t-fast) var(--ease)}
.chip:hover{border-color:var(--rose);color:var(--rose-ink)}
.chip[aria-pressed="true"]{background:var(--ink-2);border-color:var(--ink-2);color:var(--on-dark)}

/* superfícies */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-5);box-shadow:var(--shadow-1)}
.divider{height:1px;background:var(--border);border:0;margin:0}

/* toast */
.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translate(-50%,8px);background:var(--ink);color:var(--on-dark);padding:12px 18px;border-radius:var(--r-pill);font-size:var(--fs-sm);font-weight:500;opacity:0;pointer-events:none;transition:opacity var(--t-base) var(--ease),transform var(--t-base) var(--ease);z-index:60;box-shadow:var(--shadow-3);max-width:calc(100vw - 32px);text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media (min-width:1000px){.toast{bottom:28px}}

/* reveal sutil (JS acrescenta .in; sem JS fica visível) */
.reveal{opacity:1;transform:none}
.js .reveal{opacity:0;transform:translateY(12px);transition:opacity var(--t-slow) var(--ease),transform var(--t-slow) var(--ease)}
.js .reveal.in{opacity:1;transform:none}
/* vinho dos criativos (anúncios 2026-09) */
:root{--wine:#5C2525;--wine-2:#7A2F33;--wine-deep:#3F1519}