/* IP3 Digital — shared tokens & base */
:root{
  /* neutrals — warm cream/ivory family, preserving current palette */
  --cream-50:  #FBF7EF;   /* lightest page bg */
  --cream-100: #F6F0E3;   /* primary page bg */
  --cream-200: #EEE4CF;   /* card / section bg */
  --cream-300: #E2D3B0;   /* rules, dividers */
  --ivory:     #FFFBF3;   /* crispest white */

  /* gold — hero accent */
  --gold-300:  #D7A85A;
  --gold-500:  #B8893E;   /* primary gold */
  --gold-600:  #9A6F2B;   /* deep gold, pressed / hover */
  --gold-700:  #7A5618;   /* ink gold, type on cream */

  /* ink — charcoals & navy for depth */
  --ink-900:   #1A1510;   /* headline */
  --ink-800:   #2A231B;
  --ink-700:   #3B3227;   /* body */
  --ink-500:   #6A5E4E;   /* muted */
  --ink-400:   #8A7E6E;

  /* darks — for dossier direction */
  --navy-900:  #14181F;
  --navy-800:  #1C222C;
  --navy-700:  #242C38;

  /* typography */
  --serif:   "Cormorant Garamond", "EB Garamond", "Times New Roman", serif;
  --serif-display: "Fraunces", "Cormorant Garamond", Georgia, serif; /* used sparingly */
  --sans:    "Inter Tight", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --mono:    "JetBrains Mono", ui-monospace, Menlo, monospace;

  /* rhythm */
  --rule-thin: 0.5px solid var(--ink-900);
  --rule-hair: 0.5px solid rgba(26,21,16,0.18);
  --rule-gold: 0.5px solid var(--gold-500);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;overflow-x:hidden}
body{
  font-family:var(--sans);
  color:var(--ink-800);
  background:var(--cream-100);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.smallcaps{
  font-family:var(--sans);
  text-transform:uppercase;
  letter-spacing:0.18em;
  font-size:11px;
  font-weight:500;
}
.num{ font-variant-numeric: tabular-nums; }

/* shared button */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 22px;border-radius:2px;
  font-family:var(--sans);font-weight:500;font-size:14px;
  letter-spacing:0.02em;
  cursor:pointer;border:none;text-decoration:none;
  transition:all .2s ease;
}
.btn-gold{ background:var(--gold-500); color:var(--ink-900); }
.btn-gold:hover{ background:var(--gold-600); color:var(--ivory); }
.btn-ghost{ background:transparent; color:var(--ink-900); border:1px solid var(--ink-900); }
.btn-ghost:hover{ background:var(--ink-900); color:var(--cream-100); }
.btn-arrow::after{ content:"→"; font-family:var(--serif); font-size:16px; }

/* serif display helpers */
.display{
  font-family:var(--serif-display);
  font-weight:400;
  letter-spacing:-0.01em;
  color:var(--ink-900);
  line-height:1.02;
}
.display em{
  font-style:italic;
  color:var(--gold-600);
  font-weight:400;
}

.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);
  text-transform:uppercase;letter-spacing:0.22em;
  font-size:11px;font-weight:500;color:var(--gold-700);
}
.eyebrow::before{
  content:""; width:28px; height:1px; background:var(--gold-500);
}

/* ————— digital-forward accents ————— */

/* monospace data tag — for structured-data signals */
.datatag{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--mono); font-size:11px; font-weight:500;
  letter-spacing:0.02em;
  color:var(--ink-800);
  background:var(--ivory);
  border:0.5px solid var(--cream-300);
  padding:6px 10px; border-radius:2px;
  white-space:nowrap;
}
.datatag-gold{
  color:var(--gold-700);
  background:rgba(184,137,62,0.07);
  border-color:rgba(184,137,62,0.25);
}
.datatag-dark{
  color:var(--gold-300);
  background:rgba(215,168,90,0.08);
  border-color:rgba(215,168,90,0.3);
}
.datatag .dot{ width:5px; height:5px; border-radius:50%; background:var(--gold-500); }
.datatag .dot-live{ background:#3CB371; box-shadow:0 0 0 0 rgba(60,179,113,0.6); animation:livepulse 2.4s ease-out infinite; }

@keyframes livepulse{
  0%{ box-shadow:0 0 0 0 rgba(60,179,113,0.55); }
  70%{ box-shadow:0 0 0 7px rgba(60,179,113,0); }
  100%{ box-shadow:0 0 0 0 rgba(60,179,113,0); }
}

/* gold orb — ambient hero glow */
.orb{
  position:absolute; pointer-events:none;
  width:720px; height:720px; border-radius:50%;
  background: radial-gradient(circle,
    rgba(215,168,90,0.55) 0%,
    rgba(215,168,90,0.22) 28%,
    rgba(215,168,90,0.06) 55%,
    rgba(215,168,90,0) 72%);
  filter: blur(12px);
  animation: orbDrift 18s ease-in-out infinite alternate;
  mix-blend-mode: multiply;
}
@keyframes orbDrift{
  0%   { transform: translate(0,0) scale(1); }
  50%  { transform: translate(40px,-30px) scale(1.08); }
  100% { transform: translate(-20px,20px) scale(0.96); }
}

/* monogram load animation */
@keyframes monoFade{
  0%   { opacity:0; transform: translateY(20px); }
  100% { opacity:0.75; transform: translateY(0); }
}
@keyframes supMorph{
  0%,15%  { content: "1"; }
  30%,45% { content: "2"; }
  60%,100%{ content: "3"; }
}
.mono-anim{ animation: monoFade 1.2s ease-out both; }
.mono-sup-anim::before{
  content:"3";
  animation: supMorph 1.6s steps(3) 0.6s 1 both;
  /* When parent is the framed (outline) monogram, fill the 3 in solid gold */
  -webkit-text-stroke: 0;
  color: var(--gold-600);
  font-style: italic;
}

/* editorial line icon — gold ring w/ thin ink stroke */
.linicon{
  width:44px; height:44px; border-radius:50%;
  border:0.5px solid var(--gold-500);
  display:grid; place-items:center;
  background:var(--ivory);
  color:var(--ink-900);
  flex-shrink:0;
}
.linicon-dark{
  background:transparent;
  border-color:rgba(215,168,90,0.5);
  color:var(--gold-300);
}
.linicon svg{ width:20px; height:20px; stroke-width:1.2; stroke:currentColor; fill:none; stroke-linecap:round; stroke-linejoin:round; }

/* live status badge — top-right corner floating */
.livebadge{
  position:fixed; top:12px; left:50%; transform:translateX(-50%); z-index:50;
  display:inline-flex; align-items:center; gap:10px;
  padding:6px 14px;
  background:rgba(26,21,16,0.92);
  color:var(--cream-200);
  font-family:var(--mono); font-size:10px; letter-spacing:0.12em;
  border-radius:20px;
  backdrop-filter: blur(6px);
  border:0.5px solid rgba(215,168,90,0.3);
}
.livebadge .dot{ width:6px; height:6px; border-radius:50%; background:#3CB371; animation:livepulse 2.4s ease-out infinite; }
.livebadge .sep{ color:rgba(215,168,90,0.5); }

/* section-break diagram container */
.diagram{
  position:relative;
  background:var(--ivory);
  border:0.5px solid var(--cream-300);
  border-radius:2px;
  overflow:hidden;
}
.diagram-dark{
  background:var(--ink-900);
  border-color:rgba(215,168,90,0.25);
  color:var(--cream-100);
}

/* placeholder imagery */
.placeholder{
  background:
    repeating-linear-gradient(135deg,
      rgba(26,21,16,0.04) 0 8px,
      rgba(26,21,16,0.08) 8px 16px);
  color:var(--ink-500);
  font-family:var(--mono);
  font-size:11px;
  display:flex;align-items:center;justify-content:center;
  text-transform:uppercase;letter-spacing:0.12em;
  border:var(--rule-hair);
}

/* ————— Responsive (tablet & mobile) ————— */

/* Tablet (<= 1024px) */
@media (max-width: 1024px) {
  .vw-nav { padding: 18px 32px !important; gap: 24px !important; }
  .vw-nav-links { gap: 24px !important; }
  .vw-hero { padding: 80px 32px 72px !important; min-height: 0 !important; }
  .vw-hero-grid { grid-template-columns: minmax(0, 1fr) 320px !important; gap: 48px !important; }
  .vw-herocard-name { font-size: 24px !important; }
  .vw-marquee { padding: 20px 32px !important; gap: 32px !important; }
  .vw-firm { padding: 96px 32px 84px !important; }
  .vw-firm-body { gap: 40px !important; }
  .vw-engage { padding: 96px 32px !important; }
  .vw-practice { padding: 96px 32px !important; }
  .vw-when { padding: 96px 32px !important; }
  .vw-attorney { padding: 96px 32px !important; grid-template-columns: 280px 1fr !important; gap: 56px !important; }
  .vw-attorney-portrait { width: 280px !important; height: 360px !important; }
  .vw-news { padding: 32px 32px 84px !important; }
  .vw-news-inner { padding: 48px 40px !important; gap: 48px !important; grid-template-columns: 1fr 280px !important; }
  .vw-eco { padding: 96px 32px 100px !important; }
  .vw-eco-card { padding: 40px 40px !important; gap: 40px !important; grid-template-columns: 220px 1fr !important; }
  .vw-contact { padding: 96px 32px 112px !important; }
  .vw-footer { padding: 64px 32px 36px !important; }
  .vw-footer-cols { gap: 40px !important; grid-template-columns: 1.5fr 1fr 1fr !important; }
}

/* Mobile (<= 720px) */
@media (max-width: 720px) {
  /* Nav */
  .vw-nav {
    padding: 14px 20px !important;
    gap: 12px !important;
    grid-template-columns: 1fr auto !important;
  }
  .vw-nav-links { display: none !important; }
  .vw-nav-cta { padding: 10px 14px !important; font-size: 12px !important; gap: 6px !important; }
  .vw-nav .vw-logo-pllc { display: none !important; }
  .vw-nav .vw-logo-name { display: none !important; }

  /* Hero */
  .vw-hero { padding: 56px 20px 64px !important; }
  .vw-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 44px !important;
  }
  .vw-hero h1 { font-size: clamp(40px, 9.4vw, 58px) !important; margin-bottom: 24px !important; }
  .vw-hero p { font-size: 17px !important; margin-bottom: 32px !important; }
  .vw-hero-card {
    max-width: 420px;
    width: 100%;
    margin: 0 auto;
  }
  .vw-hero-stats {
    grid-template-columns: repeat(2, 1fr) !important;
    margin-top: 48px !important;
    row-gap: 28px !important;
  }
  .vw-hero-stats > div {
    padding: 0 16px !important;
    border-right: 0.5px solid rgba(26,21,16,0.18) !important;
  }
  .vw-hero-stats > div:nth-child(2n) {
    border-right: none !important;
  }

  /* Marquee */
  .vw-marquee {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 20px 20px !important;
    text-align: center;
  }
  .vw-marquee > div {
    justify-content: center !important;
    gap: 18px !important;
    row-gap: 10px !important;
  }

  /* Firm */
  .vw-firm { padding: 72px 20px 64px !important; }
  .vw-firm-body { grid-template-columns: 1fr !important; gap: 0 !important; }
  .vw-firm-pull {
    margin: 48px 0 !important;
    padding: 32px 28px !important;
    flex-direction: column !important;
    gap: 12px !important;
  }
  .vw-firm-pull > p { font-size: 24px !important; }
  .vw-firm h2 { font-size: clamp(40px, 9vw, 52px) !important; }

  /* Engage */
  .vw-engage { padding: 72px 20px !important; }
  .vw-engage-grid { grid-template-columns: 1fr !important; }
  .vw-engage h2 { font-size: clamp(36px, 8.5vw, 48px) !important; }

  /* Practice */
  .vw-practice { padding: 72px 20px !important; }
  .vw-practice-grid { grid-template-columns: 1fr !important; }
  .vw-practice-grid article { padding: 36px 28px !important; }
  .vw-practice h2 { font-size: clamp(36px, 8.5vw, 48px) !important; }

  /* When */
  .vw-when { padding: 72px 20px !important; }
  .vw-when-grid { grid-template-columns: 1fr !important; }
  .vw-when-grid > div {
    padding: 28px 24px !important;
    gap: 20px !important;
  }
  .vw-when h2 { font-size: clamp(36px, 8.5vw, 48px) !important; }

  /* Attorney */
  .vw-attorney {
    padding: 72px 20px !important;
    grid-template-columns: 1fr !important;
    gap: 40px !important;
  }
  .vw-attorney-portrait-col {
    position: static !important;
    top: auto !important;
    max-width: 360px;
    margin: 0 auto;
    width: 100%;
  }
  .vw-attorney-portrait {
    width: 100% !important;
    height: 380px !important;
  }
  .vw-attorney h2 { font-size: clamp(36px, 8.5vw, 48px) !important; margin-bottom: 24px !important; }
  .vw-attorney-creds { grid-template-columns: 1fr !important; }

  /* Newsletter */
  .vw-news { padding: 24px 20px 72px !important; }
  .vw-news-inner {
    grid-template-columns: 1fr !important;
    padding: 40px 28px !important;
    gap: 40px !important;
  }
  .vw-news-inner h3 { font-size: 40px !important; }
  .vw-news-inner > :nth-child(2) {
    max-width: 300px;
    margin: 0 auto;
    width: 100%;
  }

  /* Ecosystem */
  .vw-eco { padding: 72px 20px 80px !important; }
  .vw-eco-card {
    grid-template-columns: 1fr !important;
    padding: 36px 28px !important;
    gap: 32px !important;
    justify-items: center;
  }
  .vw-eco-card > :first-child {
    width: 180px !important;
    height: 180px !important;
  }
  .vw-eco-card > :first-child img {
    width: 110px !important;
    height: 110px !important;
  }
  .vw-eco-card > :nth-child(2) {
    text-align: center;
  }
  .vw-eco h2 { font-size: clamp(32px, 8vw, 44px) !important; }

  /* Contact */
  .vw-contact { padding: 72px 20px 88px !important; }
  .vw-contact h2 { font-size: clamp(40px, 10vw, 60px) !important; margin-bottom: 24px !important; }
  .vw-contact p { font-size: 17px !important; margin-bottom: 36px !important; }
  .vw-contact-row {
    grid-template-columns: 1fr !important;
  }
  .vw-contact-row > a {
    padding: 28px 24px !important;
    border-right: none !important;
  }
  .vw-contact-row > a:first-child {
    border-bottom: 0.5px solid var(--ink-900) !important;
  }
  .vw-contact-row > a:first-child span:last-child {
    font-size: 26px !important;
  }

  /* Footer */
  .vw-footer { padding: 56px 20px 28px !important; }
  .vw-footer-cols {
    grid-template-columns: 1fr 1fr !important;
    gap: 32px !important;
  }
  .vw-footer-cols > :first-child {
    grid-column: 1 / -1;
  }
  .vw-footer-bottom {
    flex-direction: column !important;
    gap: 10px !important;
    align-items: flex-start !important;
  }
}

/* Extra small (<= 420px) — tighten further */
@media (max-width: 420px) {
  .vw-hero h1 { font-size: 38px !important; }
  .vw-hero-stats { grid-template-columns: 1fr 1fr !important; }
  .btn { padding: 12px 18px !important; font-size: 13px !important; }
}