/* ============================================================
   HARVEST HOUSE — brand system stylesheet
   Beer Garden · Live Music · Denton, TX
   ============================================================ */


@font-face{
  font-family:'Anton';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url('/assets/anton.woff2') format('woff2');
}


:root{
  /* —— locked palette (sampled from brand board) —— */
  --teal:#3D3A36;
  --teal-deep:#2A2723;
  --teal-ink:#1C1A16;
  --cream:#F3ECD9;
  --cream-2:#EADFC4;          /* deeper paper */
  --cream-3:#E2D4B4;          /* card edge / kraft-lit */
  --black:#33322E;            /* warm black (swatch) */
  --ink:#211F1B;              /* near-black ink */
  --coral:#C8901E;            /* retired sunset coral → deep-gold accent (client dropped coral) */
  --coral-deep:#9C6D10;
  --gold:#E0A931;
  --gold-deep:#C8902244;
  --oak:#9C5A34;              /* supporting earth — boot / wood / kraft */
  --oak-deep:#7C4426;

  --maxw:1180px;
  --pad:clamp(22px, 5vw, 64px);

  --shadow-card:0 1px 0 rgba(33,31,27,.04), 0 18px 40px -24px rgba(28,26,22,.45);
}

*{ box-sizing:border-box; }
html{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; scroll-behavior:smooth; }
body{
  margin:0;
  font-family:'Archivo', system-ui, sans-serif;
  color:var(--ink);
  background:var(--cream);
  font-size:17px;
  line-height:1.6;
}

/* —— paper texture: warm grain + faint fibre, very restrained —— */
.paper{ position:relative; background-color:var(--cream); }
.paper::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}
.paper > *{ position:relative; z-index:1; }

/* halftone dot field — for screenprint color blocks */
.halftone{
  background-image:radial-gradient(currentColor 1.4px, transparent 1.5px);
  background-size:9px 9px;
}

/* —— type —— */
.display{ font-family:'Anton', sans-serif; font-weight:400; letter-spacing:.005em; line-height:.92; text-transform:uppercase; }
.eyebrow{
  font-family:'Archivo', sans-serif; font-weight:700; font-size:.74rem;
  letter-spacing:.26em; text-transform:uppercase;
}
.serif-i{ font-style:italic; }

/* —— wordmark (their real blocky logo, recolorable via mask) —— */
.wordmark{
  display:inline-block;
  width:340px; aspect-ratio:1207 / 438;
  background-color:currentColor;
  -webkit-mask:url('/assets/wordmark-mask.webp') center/contain no-repeat;
  mask:url('/assets/wordmark-mask.webp') center/contain no-repeat;
}

/* —— emblem / mark sizing —— */
.mark{ display:block; color:currentColor; fill:currentColor; }
.mark g, .mark path{ fill:currentColor; }

/* —— layout —— */
.section{ padding:clamp(64px,9vw,128px) var(--pad); }
.wrap{ max-width:var(--maxw); margin:0 auto; }
.rule{ height:2px; background:currentColor; opacity:.22; border:0; margin:0; }

/* —— eyebrow tag with ticks —— */
.tag{ display:inline-flex; align-items:center; gap:12px; }
.tag::before, .tag::after{ content:""; width:26px; height:2px; background:currentColor; opacity:.5; }
.tag.solo::after{ display:none; }

/* —— buttons / pills —— */
.pill{
  display:inline-flex; align-items:center; gap:10px;
  font-family:'Archivo',sans-serif; font-weight:700; font-size:.82rem;
  letter-spacing:.12em; text-transform:uppercase;
  padding:13px 22px; border-radius:999px; border:2px solid currentColor;
  background:transparent; color:inherit; cursor:pointer; text-decoration:none;
}
.pill.fill{ background:currentColor; }
.pill.fill > *{ color:var(--cream); }

/* screenprint misregistration headline (subtle offset ghost) */
.misreg{ position:relative; }
.misreg::before{
  content:attr(data-ghost); position:absolute; left:-.035em; top:.028em;
  color:var(--coral); opacity:.5; z-index:-1; mix-blend-mode:multiply;
}

/* small caps label */
.label{ font-weight:700; letter-spacing:.14em; text-transform:uppercase; font-size:.7rem; }

a{ color:inherit; }
img{ max-width:100%; display:block; }