/* ============================================================
   Online Reputation Management - page-specific styles
   Builds on styles.css + service-page.css.
   ============================================================ */

/* ---------- hero board: reputation gauge + live reviews ---------- */
.or-board{
  position:relative;z-index:1;display:grid;grid-template-columns:.85fr 1.15fr;gap:18px;
  margin:clamp(40px,6vw,68px) auto 0;max-width:1060px;align-items:stretch;
}

/* reputation score gauge */
.or-score{
  background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-lg);
  border:1px solid rgba(255,255,255,.6);padding:24px 22px 26px;
  display:flex;flex-direction:column;align-items:center;text-align:center;
}
.or-score .lab{font-size:12.5px;font-weight:600;color:var(--muted);letter-spacing:.01em;}
.or-gauge{position:relative;width:188px;height:188px;margin:14px 0 4px;}
.or-gauge svg{transform:rotate(-90deg);overflow:visible;}
.or-gauge .track{fill:none;stroke:#efeee9;stroke-width:14;}
.or-gauge .fill{fill:none;stroke:url(#orGrad);stroke-width:14;stroke-linecap:round;
  stroke-dasharray:534;stroke-dashoffset:534;transition:stroke-dashoffset 1.6s cubic-bezier(.2,.7,.2,1);}
.reveal.in .or-gauge .fill{stroke-dashoffset:75;} /* ~4.5/5 */
.or-gauge .center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.or-gauge .num{font-size:46px;font-weight:800;letter-spacing:-.03em;color:var(--ink);line-height:1;}
.or-gauge .num .of{font-size:18px;color:var(--muted);font-weight:700;}
.or-gauge .stars{color:var(--accent);font-size:16px;letter-spacing:2px;margin-top:4px;}
.or-score .meta{margin-top:8px;font-size:13px;color:var(--muted);}
.or-score .meta b{color:#2e9c54;font-weight:700;}
.or-score .src{display:flex;gap:7px;margin-top:16px;flex-wrap:wrap;justify-content:center;}
.or-score .src .s{font-size:11.5px;font-weight:700;color:#7a7873;background:#f2f1ee;border-radius:999px;padding:5px 11px;display:flex;align-items:center;gap:6px;}
.or-score .src .s .dot{width:7px;height:7px;border-radius:50%;background:#2e9c54;}

/* live reviews side */
.or-side{display:flex;flex-direction:column;gap:14px;}
.or-senti{background:rgba(255,255,255,.97);border-radius:16px;box-shadow:0 18px 40px -20px rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.6);padding:16px 18px;}
.or-senti .sh{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.or-senti .sh .t{font-weight:700;font-size:13.5px;color:var(--ink);display:flex;align-items:center;gap:8px;}
.or-senti .sh .t .dotlive{width:8px;height:8px;border-radius:50%;background:#2e9c54;box-shadow:0 0 0 4px rgba(46,156,84,.18);animation:orPulse 1.6s ease-in-out infinite;}
@keyframes orPulse{50%{box-shadow:0 0 0 7px rgba(46,156,84,0);}}
.or-senti .sh .pct{font-weight:800;font-size:14px;color:#2e9c54;font-variant-numeric:tabular-nums;}
.or-bar{height:12px;border-radius:999px;background:#f0625c;overflow:hidden;position:relative;}
.or-bar .pos{position:absolute;left:0;top:0;bottom:0;width:38%;background:linear-gradient(90deg,#2e9c54,#46c46f);border-radius:999px;transition:width 1.8s cubic-bezier(.2,.7,.2,1);}
.reveal.in .or-bar .pos{width:92%;}
.or-bar-legend{display:flex;justify-content:space-between;margin-top:7px;font-size:11px;font-weight:600;}
.or-bar-legend .g{color:#2e9c54;}.or-bar-legend .r{color:#c4534b;}

/* review feed */
.or-feed{flex:1;background:rgba(255,255,255,.97);border-radius:16px;box-shadow:0 18px 40px -20px rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.6);padding:14px 8px 10px;display:flex;flex-direction:column;overflow:hidden;}
.or-feed .fh{display:flex;align-items:center;justify-content:space-between;padding:0 12px 12px;}
.or-feed .fh .t{font-weight:700;font-size:13.5px;color:var(--ink);}
.or-feed .fh .lk{font-size:11.5px;font-weight:600;color:var(--muted);}
.rrow{display:flex;align-items:flex-start;gap:12px;padding:11px 12px;border-radius:11px;transition:.4s;opacity:.5;transform:translateY(4px);}
.rrow.active{opacity:1;transform:none;background:#fbf7f4;box-shadow:0 6px 18px -8px rgba(0,0,0,.2);}
.rrow .av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;color:#fff;flex:none;}
.rrow .rt{flex:1;min-width:0;}
.rrow .rt .top{display:flex;align-items:center;gap:8px;}
.rrow .rt .nm{font-weight:700;font-size:13px;color:#16181a;}
.rrow .rt .platform{font-size:10.5px;font-weight:700;color:var(--muted);background:#f2f1ee;border-radius:999px;padding:2px 7px;}
.rrow .rt .stars{color:var(--accent);font-size:12px;letter-spacing:1px;margin-top:2px;}
.rrow .rt .txt{font-size:12.5px;color:#54524e;margin-top:3px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* ---------- problem: reputation leaks ---------- */
.or-leak{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:clamp(30px,4vw,44px);}
.or-leak .lk{background:var(--ink);border:1px solid var(--line-d);border-radius:var(--r);padding:24px 22px;position:relative;overflow:hidden;}
.or-leak .lk .big{font-size:40px;font-weight:800;letter-spacing:-.03em;color:var(--accent);line-height:1;}
.or-leak .lk h4{color:#fff;font-size:17px;margin:10px 0 6px;}
.or-leak .lk p{color:var(--muted-d);font-size:14px;line-height:1.5;}

/* ---------- platform chips ---------- */
.or-plat{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-width:820px;margin:clamp(30px,4vw,44px) auto 0;}
.or-plat .chip{display:flex;align-items:center;gap:9px;}
.or-plat .chip .d{width:9px;height:9px;border-radius:3px;background:var(--accent);opacity:.7;}

/* ---------- mid-page lead CTA band ---------- */
.or-band{background:linear-gradient(120deg,#17120f,#0E0F11);border:1px solid var(--line-d);border-radius:var(--r-lg);
  padding:clamp(28px,4vw,44px);display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  box-shadow:var(--shadow-lg);position:relative;overflow:hidden;}
.or-band::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 120% at 90% 10%,rgba(244,81,30,.25),transparent 60%);}
.or-band .bt{position:relative;z-index:1;max-width:560px;}
.or-band h3{color:#fff;font-size:clamp(22px,2.6vw,30px);letter-spacing:-.02em;}
.or-band p{color:var(--muted-d);font-size:15px;margin-top:8px;}
.or-band .ba{position:relative;z-index:1;display:flex;gap:12px;flex-wrap:wrap;}

/* ---------- responsive ---------- */
@media (max-width:860px){
  .or-board{grid-template-columns:1fr;}
  .or-leak{grid-template-columns:1fr;}
  .or-band{flex-direction:column;align-items:flex-start;}
}