/* ==========================================================================
   Pawpera — Brand tokens v3 (governed type + 8pt space; single-accent discipline)
   Light & editorial: Minted + West & Willow. Import on every page.
   ACCENT RULE: --clay is reserved for the logo mark + star glyphs ONLY.
                --clay-deep is the one functional accent (eyebrows, links, ticks, focus).
   ========================================================================== */
:root{
  /* Neutrals */
  --paper:#fbfaf7; --surface:#ffffff; --oat:#efe9de; --parchment:#f2e9de;
  --line:#e9e3d9; --line-strong:#ddd5c8;
  --ink:#2b2a27; --ink-hover:#17160f; --stone:#6f6a61;

  /* Accent (see ACCENT RULE) */
  --clay:#c08a63; --clay-deep:#8f5a30; --tan:#cca38b;
  /* Muted supports — one desaturation family, used as 15% tints */
  --sage:#a9b2a0; --dust:#a7b4bc; --blush:#e7d3c8;
  --tile-sage:#e2e7dd; --tile-dust:#dde4e8; --tile-blush:#efdcd2; --tile-oat:#efe9de;

  /* Type — Fraunces (display) + Inter (body). Modular 1.25 scale on 16px. */
  --font-head:"Fraunces", Georgia, "Times New Roman", serif;
  --font-body:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --fs-xs:.75rem; --fs-sm:.875rem; --fs-base:1rem; --fs-md:1.125rem; --fs-lg:1.25rem;
  --fs-xl:1.563rem; --fs-2xl:1.953rem; --fs-3xl:2.441rem; --fs-4xl:3.052rem;

  /* Space — 8pt system */
  --sp-1:.5rem; --sp-2:1rem; --sp-3:1.5rem; --sp-4:2rem; --sp-5:2.5rem;
  --sp-6:3rem; --sp-8:4rem; --sp-10:5rem; --sp-12:6rem; --sp-15:7.5rem;

  --radius:14px; --radius-sm:10px; --radius-pill:999px;
  --shadow:0 6px 24px rgba(43,42,39,.06);
  --maxw:1120px;
}

/* Base */
body{background:var(--paper);color:var(--ink);font-family:var(--font-body);
  font-size:var(--fs-base);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--font-head);font-optical-sizing:auto;font-weight:500;color:var(--ink)}
h1{font-weight:400;letter-spacing:-.02em;line-height:1.08}
h2{letter-spacing:-.015em;line-height:1.14}
h3{letter-spacing:-.005em;line-height:1.25}
a{color:var(--ink)}

/* Logo lockup — tracked wordmark reads more premium */
.pw-logo{font-family:var(--font-head);font-weight:500;display:inline-flex;align-items:center;
  gap:.5em;color:var(--ink);letter-spacing:.06em}

/* Buttons — restrained: 500 weight, 8pt padding, quiet shine */
.pw-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  background:var(--ink);color:#fff;padding:1rem 2rem;border-radius:var(--radius-pill);
  font-weight:500;font-size:var(--fs-base);letter-spacing:.01em;text-decoration:none;border:none;cursor:pointer;overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 6px 18px rgba(43,42,39,.14);
  transition:transform .2s cubic-bezier(.2,.7,.3,1), box-shadow .2s, background .2s}
.pw-btn:hover{background:var(--ink-hover);transform:translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1), 0 12px 26px rgba(43,42,39,.2)}
.pw-btn:active{transform:translateY(0) scale(.985)}
.pw-btn::after{content:"";position:absolute;top:0;left:-130%;width:65%;height:100%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.12),transparent);transform:skewX(-18deg);transition:left .7s ease}
.pw-btn:hover::after{left:140%}
.pw-btn .arrow{transition:transform .2s;display:inline-block}
.pw-btn:hover .arrow{transform:translateX(3px)}
.pw-btn--ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line-strong);box-shadow:none}
.pw-btn--ghost::after{display:none}
.pw-btn--ghost:hover{background:var(--ink);color:#fff;border-color:var(--ink);transform:translateY(-2px);box-shadow:0 10px 24px rgba(43,42,39,.16)}
@media (prefers-reduced-motion: reduce){
  .pw-btn,.pw-btn::after,.pw-btn .arrow{transition:none}
  .pw-btn:hover{transform:none}.pw-btn:hover::after{left:-130%}
}

/* Eyebrow */
.pw-eyebrow{display:inline-block;font-size:var(--fs-xs);letter-spacing:.22em;text-transform:uppercase;color:var(--clay-deep);font-weight:500}
