/* =============================================================
   VEEDAY CONSULTANTS — pages.css
   Shared pieces for the inner pages (clients, contact, privacy, forms).
   Loaded AFTER veeday.css, which holds the tokens, nav, buttons and footer.
   ============================================================= */

/* small utilities the form scripts toggle by name */
.hidden { display: none !important; }
.flex { display: flex; }

/* ── Page hero: every inner page opens on the same dusk as the homepage ── */
.phero {
  position: relative; overflow: hidden; isolation: isolate;
  padding: calc(var(--nav-h) + clamp(56px, 9vw, 128px)) 0 clamp(48px, 7vw, 104px);
  background:
    radial-gradient(70% 110% at 86% 20%, #5a120d 0%, rgba(74, 15, 11, .5) 36%, rgba(18, 16, 15, 0) 72%),
    radial-gradient(50% 80% at 0% 110%, #3b0f0b 0%, rgba(18, 16, 15, 0) 64%),
    linear-gradient(160deg, #161312 0%, #120f0f 55%, #1d0c0b 100%);
}
.phero::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: linear-gradient(rgba(250, 250, 248, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(250, 250, 248, .05) 1px, transparent 1px);
  background-size: 92px 92px;
  -webkit-mask-image: radial-gradient(80% 100% at 80% 20%, #000 0%, transparent 76%);
          mask-image: radial-gradient(80% 100% at 80% 20%, #000 0%, transparent 76%);
}
.phero__eyebrow { display: flex; align-items: center; gap: 14px; font-size: 11.5px; font-weight: 500; letter-spacing: .17em; text-transform: uppercase; color: var(--mute); margin-bottom: clamp(20px, 3vw, 36px); }
.phero__eyebrow::before { content: ''; width: 34px; height: 1px; background: #F0554E; }
.phero__title { font-family: var(--serif); font-weight: 400; font-size: clamp(40px, 6vw, 96px); line-height: 1; letter-spacing: -.025em; max-width: 13em; text-wrap: balance; }
.phero__title em { font-style: italic; color: var(--red); }
.phero__lede { margin-top: clamp(20px, 2.6vw, 34px); max-width: 54ch; font-size: clamp(16px, 1.25vw, 19px); line-height: 1.7; color: var(--mute); }
.phero__ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: clamp(26px, 3.4vw, 44px); }
.phero--center { text-align: center; }
.phero--center .phero__title, .phero--center .phero__lede { margin-left: auto; margin-right: auto; }
.phero--center .phero__eyebrow, .phero--center .phero__ctas { justify-content: center; }

/* ── Generic section rhythm ── */
.psection { padding: clamp(56px, 8vw, 120px) 0; }
.psection--sand { background: var(--sand); }
.psection--tight { padding: clamp(36px, 5vw, 72px) 0; }

/* ── Long-form text (privacy policy and similar) ── */
.prose { max-width: 74ch; font-size: 16.5px; line-height: 1.78; color: var(--mute); }
.prose h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(24px, 2.4vw, 34px); line-height: 1.18; letter-spacing: -.015em; color: var(--fg); margin: 2.2em 0 .6em; padding-top: 1.1em; border-top: 1px solid var(--line); }
.prose h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.prose h3 { font-size: 17px; font-weight: 600; color: var(--fg); margin: 1.6em 0 .4em; }
.prose p { margin: 0 0 1em; }
.prose ul, .prose ol { margin: 0 0 1.2em; padding-left: 0; }
.prose li { position: relative; padding-left: 22px; margin-bottom: .5em; }
.prose li::before { content: ''; position: absolute; left: 2px; top: .72em; width: 7px; height: 1px; background: var(--red); }
.prose a { color: var(--red); background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat; }
.prose a:hover { color: var(--fg); }
.prose strong { color: var(--fg); }
.prose a[href^="tel:"] { white-space: nowrap; }

/* ── Light cards ── */
.pcard { padding: clamp(22px, 2.4vw, 34px); border: 1px solid var(--line); border-radius: 6px; background: var(--paper); transition: transform .6s var(--ease), box-shadow .6s, border-color .4s; }
a.pcard:hover, .pcard--lift:hover { transform: translateY(-4px); border-color: var(--ink); box-shadow: 0 26px 50px -30px rgba(18, 16, 15, .5); }
.pcard__label { display: block; font-size: 10.5px; font-weight: 600; letter-spacing: .17em; text-transform: uppercase; color: var(--red); margin-bottom: 12px; }
.pcard__title { font-family: var(--serif); font-weight: 400; font-size: clamp(21px, 1.9vw, 28px); line-height: 1.2; letter-spacing: -.012em; color: var(--fg); }

/* ── Trust strip (three or four short facts in a row) ── */
.ptrust { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.ptrust > * { padding: 20px 24px 22px 0; }
.ptrust > * + * { padding-left: 24px; border-left: 1px solid var(--line); }
.ptrust dt, .ptrust b { display: block; font-size: 10.5px; font-weight: 600; letter-spacing: .17em; text-transform: uppercase; color: var(--red); margin-bottom: 8px; }
.ptrust dd, .ptrust span { font-family: var(--serif); font-size: clamp(16px, 1.4vw, 20px); line-height: 1.35; color: var(--fg); }
.dark .ptrust dt, .dark .ptrust b { color: #F0554E; }

@media (max-width: 700px) {
  .ptrust { grid-template-columns: 1fr; }
  .ptrust > * + * { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); }
}

/* current page in the nav */
.nav__links > a[aria-current="page"] { color: var(--paper); }
.nav__links > a[aria-current="page"]::after { transform: scaleX(1); }
