/* Tiny set of brand-level CSS helpers not worth Tailwind-izing:
   placeholder imagery patterns, reveal-on-scroll, and a few typographic niceties. */
:root {
  --burgundy: #5A2416;
  --gold: #A68454;
  --cream-3: #E4DDD0;
  --gold-soft: #C9B58A;
  --hairline: #D8CFC0;
}
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body { text-rendering: optimizeLegibility; }

.ph {
  position: relative;
  background:
    repeating-linear-gradient(135deg, rgba(90,36,22,0.06) 0 2px, transparent 2px 12px),
    linear-gradient(180deg, #2C2420, #181310);
  color: var(--gold-soft);
  font-family: "JetBrains Mono", ui-monospace, Menlo, monospace;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.ph::after {
  content: ""; position: absolute; inset: 0;
  box-shadow: inset 0 0 120px rgba(0,0,0,0.55); pointer-events: none;
}
.ph > span { position: relative; z-index: 1; padding: 6px 12px; border: 1px solid rgba(201,181,138,0.3); }
.ph.light {
  background:
    repeating-linear-gradient(135deg, rgba(90,36,22,0.08) 0 2px, transparent 2px 12px),
    var(--cream-3);
  color: var(--burgundy);
}
.ph.light::after { box-shadow: none; }

.rule-gold {
  display: inline-block; width: 48px; height: 1px; background: var(--gold);
  vertical-align: middle; margin-right: 14px;
}

.reveal { opacity: 0; transform: translateY(14px); transition: opacity .9s ease, transform .9s ease; }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } }

/* Intake form subtle underline inputs */
.field { display: block; margin-bottom: 20px; }
.field > label {
  display: block; font-size: 10.5px; letter-spacing: .22em; text-transform: uppercase;
  color: #8C7D6F; margin-bottom: 8px;
}
.field input, .field select, .field textarea {
  width: 100%; padding: 12px 0; background: transparent; border: 0;
  border-bottom: 1px solid var(--hairline); outline: none;
  font-family: "Cormorant Garamond", Georgia, serif; font-size: 20px; color: #2B2018;
  transition: border-color .2s;
}
.field textarea { font-family: Inter, sans-serif; font-size: 16px; line-height: 1.6; min-height: 120px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { border-bottom-color: var(--burgundy); }

/* Reusable head snippet for all pages */