/* /solutions/reputation-management. Borrowed format: the "How did we do?" card.
   Warm card-paper cream, oak, a true star gold and deep ink. Every class is prefixed rg-. */
.rg-page {
  --rg-paper: #f7f0e3;
  --rg-card: #fffcf5;
  --rg-oak: #c89a5f;
  --rg-ink: #1d1a16;
  --rg-muted: #5a5247;
  --rg-line: #ddcfb8;
  --rg-star: #e2a82c;
  --rg-gold: #986a14;
  --rg-red: #9a3a28;
  --rg-sage: #3e5a4c;
  --rg-night: #181511;
  --rg-night-text: #cfc6b8;
  background: var(--rg-paper);
  color: var(--rg-ink);
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 1.68;
  color-scheme: light;
}
.rg-page * { box-sizing: border-box; }
.rg-page ::selection { background: var(--rg-star); color: var(--rg-ink); }
.rg-page :focus-visible { outline: 2px solid var(--rg-gold); outline-offset: 4px; border-radius: 3px; }
.rg-page a { color: inherit; text-underline-offset: 4px; text-decoration-thickness: 1px; }
:where(.rg-page) :where(h1, h2, h3, p, ul, ol, figure, dl) { margin: 0; }
:where(.rg-page) :where(ul, ol) { padding: 0; list-style: none; }
:where(.rg-page) p { max-width: 66ch; }
.rg-page h1, .rg-page h2 { font-family: var(--font-serif); font-weight: 500; letter-spacing: -0.02em; text-wrap: balance; }
.rg-page h1 { font-size: clamp(3.2rem, 6vw, 6.2rem); line-height: 0.95; }
.rg-page h1 em { font-style: italic; color: var(--rg-gold); font-weight: 400; }
.rg-page h2 { font-size: clamp(2.3rem, 3.8vw, 3.9rem); line-height: 1.03; }
.rg-page h3 { font-family: var(--font-serif); font-size: 1.6rem; font-weight: 600; line-height: 1.12; }
.rg-wrap { width: min(100%, 1340px); margin-inline: auto; padding-inline: clamp(16px, 4vw, 56px); }
.rg-section { padding-block: clamp(76px, 9vw, 128px); }
.rg-split-head { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: 20px 72px; align-items: end; margin-bottom: clamp(40px, 5vw, 60px); }
.rg-split-head p { font-size: 18px; color: var(--rg-muted); }
.rg-arrow { flex: none; }

/* Buttons. */
.rg-page .rg-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 14px 26px; border-radius: 999px; font-size: 15px; font-weight: 700; text-decoration: none; transition: background-color 180ms ease-out, border-color 180ms ease-out, transform 180ms ease-out; }
.rg-page .rg-btn-primary { background: var(--rg-ink); color: #fff; border: 1px solid var(--rg-ink); }
.rg-page .rg-btn-primary:hover { background: #342e26; transform: translateY(-1px); }
.rg-page .rg-btn-quiet { border: 1px solid rgba(29, 26, 22, 0.25); color: var(--rg-ink); }
.rg-page .rg-btn-quiet:hover { border-color: var(--rg-ink); }
.rg-page .rg-btn-gold { background: var(--rg-star); color: #1a1406; border: 1px solid var(--rg-star); }
.rg-page .rg-btn-gold:hover { background: #efbf4f; }

/* Hero. */
.rg-hero { padding: calc(104px + clamp(28px, 4vw, 60px)) 0 clamp(64px, 8vw, 110px); background: linear-gradient(180deg, #f3e9d8 0%, var(--rg-paper) 70%); border-bottom: 1px solid var(--rg-line); }
.rg-hero-grid { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(40px, 5vw, 80px); align-items: center; }
.rg-page .rg-hero .h1-kicker { color: var(--rg-gold); opacity: 1; }
.rg-lead { margin-top: 24px; font-size: 19px; line-height: 1.6; color: var(--rg-muted); max-width: 54ch; }
.rg-price { margin-top: 26px; padding-top: 18px; border-top: 1px solid var(--rg-line); }
.rg-price-figure { font-family: var(--font-serif); font-size: clamp(1.9rem, 2.6vw, 2.4rem); font-weight: 600; line-height: 1.1; }
.rg-price-note { margin-top: 4px; font-size: 14px; color: var(--rg-muted); }
.rg-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.rg-hero .ns-trustline { margin-top: 20px !important; }
.rg-hero-art { position: relative; }
.rg-hero-photo { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10.5; object-fit: cover; object-position: 30% 55%; border-radius: 18px; box-shadow: 0 40px 80px -40px rgba(60, 40, 10, 0.55); }
.rg-bubble { position: absolute; right: clamp(-28px, -2vw, 0px); bottom: -44px; width: min(62%, 360px); padding: 18px; border-radius: 22px; background: var(--rg-night); color: #fff; box-shadow: 0 30px 60px -24px rgba(0, 0, 0, 0.6); display: grid; gap: 10px; font-size: 14px; line-height: 1.5; }
.rg-bubble-meta { display: flex; justify-content: space-between; font-size: 12px; color: var(--rg-night-text); }
.rg-bubble-meta span:first-child { color: #fff; font-weight: 700; }
.rg-bubble-in { max-width: 90%; padding: 12px 14px; border-radius: 16px 16px 16px 4px; background: rgba(255, 255, 255, 0.09); color: #eee6d8; }
.rg-bubble-out { justify-self: end; max-width: 78%; padding: 12px 14px; border-radius: 16px 16px 4px 16px; background: var(--rg-star); color: #1a1406; font-weight: 600; }
.rg-bubble-stars { display: flex; gap: 3px; color: var(--rg-star); }
@media (prefers-reduced-motion: no-preference) {
  .rg-bubble { animation: rg-rise 900ms 200ms cubic-bezier(0.16, 1, 0.3, 1) both; }
  .rg-bubble-out { animation: rg-rise 700ms 900ms cubic-bezier(0.16, 1, 0.3, 1) both; }
  .rg-bubble-stars { animation: rg-rise 600ms 1300ms cubic-bezier(0.16, 1, 0.3, 1) both; }
}
@keyframes rg-rise { from { transform: translateY(12px); } to { transform: none; } }

/* Evidence: a ledger of four findings. */
.rg-evidence { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 2px solid var(--rg-ink); }
.rg-evidence li { padding: 26px 26px 6px 0; }
.rg-evidence li + li { padding-left: 26px; border-left: 1px solid var(--rg-line); }
.rg-evidence-figure { font-family: var(--font-serif); font-size: clamp(3.4rem, 5vw, 4.8rem); line-height: 0.9; font-weight: 600; color: var(--rg-gold); font-variant-numeric: lining-nums; }
.rg-evidence-fact { margin-top: 12px; font-size: 16px; font-weight: 600; line-height: 1.45; }
.rg-evidence-meaning { margin-top: 10px; font-size: 15px; line-height: 1.55; color: var(--rg-muted); }
.rg-source { margin-top: 26px; font-size: 13px; color: var(--rg-muted); }
.rg-source a { color: var(--rg-gold); font-weight: 600; }

/* Four engines: what runs every month. */
.rg-engines { background: var(--rg-paper); }
.rg-engine-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-top: 2px solid var(--rg-ink); }
.rg-engine-list li { padding: 26px 26px 8px 0; display: flex; flex-direction: column; gap: 10px; }
.rg-engine-list li + li { padding-left: 26px; border-left: 1px solid var(--rg-line); }
.rg-engine-list .rg-engine-num { font-family: var(--font-serif); font-size: 2.6rem; line-height: 1; color: var(--rg-star); font-weight: 600; }
.rg-engine-list h3 { font-size: 1.7rem; }
.rg-engine-list p { font-size: 15.5px; line-height: 1.6; color: var(--rg-muted); }
.rg-engine-list .rg-engine-note { margin-top: auto; padding-top: 8px; font-size: 13px; font-weight: 700; color: var(--rg-gold); }

/* Journey: one finished job, a track with the ask marked by a star. */
.rg-journey-section { background: var(--rg-card); border-block: 1px solid var(--rg-line); }
.rg-journey-intro { margin-top: 16px; color: var(--rg-muted); font-size: 18px; }
.rg-journey { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; margin-top: 56px; }
.rg-journey::before { content: ""; position: absolute; top: 9px; left: 0; right: 0; border-top: 2px solid var(--rg-ink); }
.rg-journey li { position: relative; padding: 36px 20px 0 0; }
.rg-journey li::before { content: ""; position: absolute; top: 1px; left: 0; width: 18px; height: 18px; border-radius: 50%; background: var(--rg-card); border: 2px solid var(--rg-ink); }
.rg-journey .rg-journey-ask::before { top: -6px; width: 30px; height: 30px; border: 0; border-radius: 0; background: var(--rg-star); clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%); }
.rg-journey .rg-journey-warn::before { background: var(--rg-red); border-color: var(--rg-red); }
.rg-journey-when { font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--rg-gold); }
.rg-journey-warn .rg-journey-when { color: var(--rg-red); }
.rg-journey h3 { margin-top: 6px; font-size: 1.55rem; }
.rg-journey li p:last-child { margin-top: 8px; font-size: 15px; line-height: 1.55; color: var(--rg-muted); }
.rg-moment { margin-top: 56px; display: grid; grid-template-columns: minmax(0, 0.45fr) minmax(0, 1fr); gap: 16px 48px; padding: 28px 32px; background: var(--rg-paper); border: 1px solid var(--rg-line); border-radius: 14px; }
.rg-moment h3 { font-size: 2rem; }
.rg-moment p { color: var(--rg-muted); }

/* Messages: four cards like the note left on the counter. */
.rg-scripts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.rg-scripts li { position: relative; display: flex; flex-direction: column; padding: 28px 30px 26px; background: var(--rg-card); border: 1px solid var(--rg-line); border-radius: 6px; box-shadow: 0 2px 0 rgba(29, 26, 22, 0.04), 0 24px 40px -30px rgba(60, 40, 10, 0.4); }
.rg-scripts li:nth-child(odd) { transform: rotate(-0.4deg); }
.rg-scripts li:nth-child(even) { transform: rotate(0.4deg); }
.rg-script-when { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--rg-gold); }
.rg-script-when span { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--rg-ink); color: #fff; letter-spacing: 0; }
.rg-scripts h3 { margin-top: 12px; font-size: 2rem; }
.rg-script-message { margin-top: 16px; padding: 16px 18px; border-radius: 16px 16px 16px 4px; background: #f1e7d6; font-size: 16px; line-height: 1.6; }
.rg-script-tip { margin-top: 14px; font-size: 15px; line-height: 1.55; color: var(--rg-muted); font-style: italic; }

/* Recovery. */
.rg-recovery { background: var(--rg-card); border-block: 1px solid var(--rg-line); }
.rg-recovery-grid { display: grid; grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); gap: clamp(40px, 5vw, 80px); align-items: center; }
.rg-recovery-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 4.4; object-fit: cover; object-position: 62% 50%; border-radius: 16px; }
.rg-recovery-intro { margin-top: 18px; font-size: 18px; color: var(--rg-muted); }
.rg-recovery-steps { counter-reset: rec; margin-top: 30px; display: grid; gap: 22px; }
.rg-recovery-steps li { counter-increment: rec; position: relative; padding-left: 50px; }
.rg-recovery-steps li::before { content: counter(rec); position: absolute; left: 0; top: 2px; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; border: 1.5px solid var(--rg-red); color: var(--rg-red); font-weight: 700; font-size: 14px; }
.rg-recovery-steps h3 { font-size: 1.5rem; }
.rg-recovery-steps p { margin-top: 6px; font-size: 16px; color: var(--rg-muted); }

/* Rules. */
.rg-rules-grid { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 32px clamp(40px, 6vw, 88px); }
.rg-rules-grid > div > p { margin-top: 18px; color: var(--rg-muted); }
.rg-rules-list { border-top: 2px solid var(--rg-ink); }
.rg-rules-list li { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 6px 28px; padding: 20px 0; border-bottom: 1px solid var(--rg-line); }
.rg-rules-list h3 { font-family: var(--font-sans); font-size: 17px; font-weight: 700; line-height: 1.4; }
.rg-rules-list p { font-size: 15px; line-height: 1.55; color: var(--rg-muted); }
.rg-rules-list a { color: var(--rg-gold); font-weight: 700; }

/* Plan: the decision band. */
.rg-plan { background: var(--rg-night); }
.rg-plan-card { color: #fff; }
.rg-plan-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 40px; align-items: end; padding-bottom: 26px; border-bottom: 1px solid rgba(226, 168, 44, 0.3); }
.rg-plan-head h2 { color: #fff; }
.rg-plan-price { font-family: var(--font-serif); font-size: clamp(1.8rem, 2.8vw, 2.6rem); font-weight: 600; color: var(--rg-star); text-align: right; }
.rg-plan-note { grid-column: 1 / -1; font-size: 15px; color: var(--rg-night-text); }
.rg-plan-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 56px; padding-block: 32px; }
.rg-plan-cols h3 { color: var(--rg-star); font-family: var(--font-sans); font-size: 13px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.rg-plan-cols ul { margin-top: 14px; display: grid; gap: 12px; }
.rg-plan-cols li { position: relative; padding-left: 26px; color: #efe8dc; font-size: 16px; line-height: 1.55; }
.rg-plan-cols li::before { content: ""; position: absolute; left: 2px; top: 9px; width: 11px; height: 6px; border-left: 2px solid var(--rg-star); border-bottom: 2px solid var(--rg-star); transform: rotate(-45deg); }
.rg-plan-not { padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, 0.12); font-size: 14px; color: var(--rg-night-text); }
.rg-plan-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 32px; margin-top: 28px; }
.rg-plan-actions p { font-size: 15px; color: var(--rg-night-text); }
.rg-plan-actions p a { color: #fff; font-weight: 700; }

/* FAQ. */
.rg-faq-grid { display: grid; grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr); gap: 32px clamp(40px, 6vw, 88px); }
.rg-faq-grid > div:first-child p { margin-top: 16px; color: var(--rg-muted); }
.rg-faq-list { border-top: 1px solid var(--rg-line); }
.rg-faq-list details { border-bottom: 1px solid var(--rg-line); }
.rg-faq-list summary { display: flex; justify-content: space-between; gap: 20px; padding: 18px 0; font-weight: 700; cursor: pointer; list-style: none; }
.rg-faq-list summary::-webkit-details-marker { display: none; }
.rg-faq-list summary::after { content: "+"; flex: none; font-family: var(--font-serif); font-size: 26px; line-height: 0.9; color: var(--rg-gold); transition: transform 180ms ease-out; }
.rg-faq-list details[open] summary::after { transform: rotate(45deg); }
.rg-faq-list details p { padding: 0 32px 20px 0; color: var(--rg-muted); }

/* Close. */
.rg-close { padding-block: clamp(88px, 10vw, 136px); background: radial-gradient(60% 80% at 50% 0%, rgba(226, 168, 44, 0.16), transparent 65%), var(--rg-night); color: #fff; text-align: center; }
.rg-close-inner { display: grid; justify-items: center; gap: 20px; }
.rg-close-stars { display: flex; gap: 6px; color: var(--rg-star); }
.rg-close-stars svg { width: 26px; height: 26px; }
.rg-close h2 { max-width: 22ch; color: #fff; }
.rg-close p { color: var(--rg-night-text); }
.rg-close .ns-trustline { justify-content: center; }

/* Tablet. */
@media (max-width: 1100px) {
  .rg-hero-grid, .rg-recovery-grid, .rg-rules-grid, .rg-faq-grid { grid-template-columns: minmax(0, 1fr); }
  .rg-hero-art { max-width: 760px; margin-bottom: 30px; }
  .rg-evidence, .rg-engine-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rg-engine-list li:nth-child(3) { padding-left: 0; border-left: 0; }
  .rg-evidence li:nth-child(3) { padding-left: 0; border-left: 0; }
  .rg-journey { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 40px; }
  .rg-recovery-photo img { aspect-ratio: 16 / 10; }
}

/* Phone. */
@media (max-width: 760px) {
  .rg-page { font-size: 16px; }
  .rg-hero { padding-top: calc(88px + 24px); }
  .rg-lead { font-size: 17px; margin-top: 18px; }
  .rg-split-head, .rg-moment, .rg-plan-cols, .rg-rules-list li { grid-template-columns: minmax(0, 1fr); }
  .rg-split-head p { font-size: 16px; }
  .rg-actions { flex-direction: column; align-items: stretch; gap: 8px; }
  .rg-bubble { position: relative; right: auto; bottom: auto; width: auto; margin: -40px 12px 0; }
  .rg-hero-art { margin-bottom: 0; }
  .rg-evidence, .rg-engine-list { grid-template-columns: minmax(0, 1fr); }
  .rg-evidence li, .rg-evidence li + li, .rg-engine-list li, .rg-engine-list li + li { padding: 22px 0 8px; border-left: 0; border-bottom: 1px solid var(--rg-line); }
  .rg-journey { grid-template-columns: minmax(0, 1fr); margin-left: 8px; row-gap: 28px; }
  .rg-journey::before { top: 0; bottom: 0; left: 8px; right: auto; border-top: 0; border-left: 2px solid var(--rg-ink); }
  .rg-journey li { padding: 0 0 0 38px; }
  .rg-journey li::before { top: 2px; left: 0; }
  .rg-journey .rg-journey-ask::before { top: -4px; left: -6px; }
  .rg-scripts { grid-template-columns: minmax(0, 1fr); }
  .rg-scripts li:nth-child(n) { transform: none; }
  .rg-plan-head { grid-template-columns: minmax(0, 1fr); }
  .rg-plan-price { text-align: left; }
  .rg-plan-actions { flex-direction: column; align-items: stretch; }
}