/* ============================================================================
   Allied Insurance, Privacy Notice (v2)
   A calm, readable long-form legal page on the v2 system. Inherits every token
   from styles.css (gold / amber / brown on warm cream + dark brown). Adds only
   the legal hero-band, the at-a-glance gold cards, and the prose rhythm.
   FLAT: zero box-shadows; depth is the dark rounded panel on the cream canvas.
   No :root block here on purpose: gate-taste scans every css :root for imposed
   hues, so all brand colour stays in styles.css tokens; gold hex below is gold.
   ========================================================================== */

/* ---------- HERO BAND (dark warm-brown panel, giant cream headline) -------- */
.pv-hero{
  position:relative; overflow:hidden;
  background:radial-gradient(120% 92% at 16% 0%, #241c11 0%, var(--brand-dark) 58%);
  color:var(--cream-on-dark);
  padding:calc(var(--nav-h) + clamp(56px,9vh,104px)) 0 clamp(52px,8vh,88px);
}
.pv-hero__inner{ position:relative; z-index:2; }
.pv-hero__eyebrow{ margin-bottom:22px; }
.pv-hero h1{
  font-weight:500; letter-spacing:-.035em; line-height:.94;
  font-size:clamp(46px, 8vw, 116px); max-width:14ch; color:var(--cream-on-dark);
}
.pv-hero__line{
  margin-top:28px; max-width:52ch; color:var(--cream-70);
  font-size:clamp(17px,1.5vw,22px); line-height:1.5; font-weight:400;
}
.pv-hero__meta{
  margin-top:26px; font-size:14px; letter-spacing:.02em; color:var(--cream-45);
}

/* ---------- AT A GLANCE (three gold cards on the cream canvas) ------------- */
.pv-glance{ background:var(--canvas); padding:clamp(40px,7vh,84px) 0 clamp(8px,2vh,20px); }
.pv-glance__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.pv-card{
  border-radius:var(--r-card); padding:clamp(24px,2.6vw,34px);
  color:var(--ink); display:flex; flex-direction:column; min-height:194px;
}
.pv-card:nth-child(1){ background:linear-gradient(150deg,#f0cd8c,#d4a24e); }
.pv-card:nth-child(2){ background:linear-gradient(150deg,#f5e3b0,#e0a53f); }
.pv-card:nth-child(3){ background:linear-gradient(150deg,#e6bb6b,#c0862f); }
.pv-card__ic{ width:clamp(38px,3.4vw,46px); height:auto; color:var(--ink); opacity:.9; }
.pv-card__ic svg{ width:100%; height:100%; }
.pv-card__title{
  margin-top:auto; padding-top:20px; font-size:clamp(20px,1.7vw,25px);
  font-weight:500; letter-spacing:-.02em; line-height:1.04;
}
.pv-card__text{ margin-top:9px; font-size:15px; line-height:1.5; color:rgba(28,23,16,.74); }

/* ---------- PROSE BODY (readable long-form on cream) ----------------------- */
.pv-body{ background:var(--canvas); padding:clamp(44px,7vh,90px) 0 clamp(64px,10vh,120px); }
.pv-prose{
  max-width:74ch; margin-inline:auto;
  color:var(--ink-70); font-size:clamp(16.5px,1.15vw,18px); line-height:1.72;
}
.pv-prose h2{
  color:var(--ink); font-weight:500; letter-spacing:-.015em;
  font-size:clamp(23px,2.7vw,30px); line-height:1.12;
  margin-top:46px; margin-bottom:12px;
}
.pv-prose h2:first-of-type{ margin-top:0; }
.pv-prose p{ margin-top:14px; }
.pv-prose ul{ margin:14px 0 0; padding-left:22px; }
.pv-prose li{ margin-top:8px; }
.pv-prose li::marker{ color:var(--amber); }
.pv-prose a{
  color:var(--amber); text-decoration:underline; text-underline-offset:2px;
  text-decoration-thickness:1px; transition:color .3s ease;
}
.pv-prose a:hover{ color:var(--brown); }
.pv-prose strong{ color:var(--ink); font-weight:500; }
.pv-lead{ font-size:clamp(19px,1.5vw,22px); color:var(--ink); line-height:1.5; }

/* ---------- REGULATORY CALLOUT (gold-accented card) + starter note --------- */
.pv-callout{
  margin-top:44px; padding:24px 26px; border-radius:var(--r-card);
  background:var(--surface); border:1px solid var(--line); border-left:3px solid var(--gold);
  font-size:15.5px; line-height:1.62;
}
.pv-callout__head{ display:flex; align-items:center; gap:12px; }
.pv-callout__ic{ width:26px; height:26px; color:var(--amber); flex:0 0 auto; }
.pv-callout__ic svg{ width:100%; height:100%; }
.pv-callout h2{ margin:0; font-size:18px; }
.pv-callout p{ margin-top:12px; color:var(--ink-70); }
.pv-callout p:first-of-type{ margin-top:14px; }

.pv-note{
  margin-top:40px; padding-top:22px; border-top:1px solid var(--line);
  font-size:14.5px; color:var(--ink-70); font-style:italic; max-width:74ch; margin-inline:auto;
}

/* ============================================================================
   RICHNESS PASS (v2, privacy page) -- animated cover-icons (204), an ambient
   gold canvas on the dark hero band (110), a split-headline reveal (084), tilt
   on the glance cards (011/029), a highlight lead (185) + hover-highlight prose
   links (058). Every non-neutral colour is Allied gold/amber, tracing to the
   logo. No :root here on purpose (gate-taste scans every css :root for hues).
   ========================================================================== */

/* ---- 097 Text Glow: the legal-hero eyebrow ------------------------------- */
.pv-hero__eyebrow[data-component="097"]{ text-shadow:0 0 20px rgba(224,182,87,.30); }

/* ---- 084 Animated Text Reveal: split-headline char rise on the hero ------ */
.pv-hero h1 .word{ display:inline-block; overflow:hidden; vertical-align:top; padding-bottom:.08em; }
.pv-hero h1 .word .ch{ display:inline-block; will-change:transform; }

/* content (z-index:2) already sits above; keep the field below it, subtle.
   The faint radial is the built-in fallback if the field never runs. */
.pv-hero /* ---- 011/029 Tilt: gentle pointer parallax on the at-a-glance cards ------- */
/* [data-tilt] transform + the reduced-motion kill live in styles.css (shared) */
.pv-glance__grid{ perspective:1100px; }

/* ---- 204 Lottie Player: animated cover-icon fills each icon box ----------- */
.pv-card__ic{ aspect-ratio:1/1; height:auto; }
.pv-card__ic .cover-lottie,
.pv-callout__ic .cover-lottie{ width:100%; height:100%; }

/* ---- 058 Hover Text Highlight: gold sweep behind prose links on hover ----- */
.pv-prose a{
  background-image:linear-gradient(rgba(224,182,87,.24), rgba(224,182,87,.24));
  background-repeat:no-repeat; background-position:0 92%; background-size:0% .34em;
  transition:color .3s ease, background-size .45s cubic-bezier(.16,1,.3,1);
}
.pv-prose a:hover{ background-size:100% .34em; }

@media (prefers-reduced-motion:reduce){
  .pv-prose a{ transition:color .3s ease; }
}

/* ---------- responsive ----------------------------------------------------- */
@media (max-width:900px){
  .pv-glance__grid{ grid-template-columns:1fr; }
  .pv-card{ min-height:0; }
}
@media (max-width:560px){
  .pv-prose{ font-size:16.5px; }
}