/*!
 * Oyolloo Elements - J10 Reviews widget.
 * Scoped to .oo-reviews-sec: no element selector, no :root, nothing leaks.
 */
.oo-reviews-sec{
  --oov-maxw:1220px;
  --oov-pad:clamp(18px,4.5vw,44px);
  --oov-r:12px;
  --oov-yellow:#F7BE27;
  --oov-star:#BC8500;
  --oov-red:#E3000E;
  --oov-brown:#642F21;
  --oov-ink:#212121;
  --oov-faint:#A1A1A1;
  --oov-surface:#FFFFFF;
  --oov-border:#EAEAEA;
  --oov-border-2:#D9D9D9;
  --oov-f-display:'Oswald','Oswald Fallback','Arial Narrow',Arial,sans-serif;
  --oov-f-head:'Oswald','Oswald Fallback','Arial Narrow',Arial,sans-serif;
  --oov-f-body:'Roboto','Roboto Fallback','Segoe UI',Helvetica,Arial,sans-serif;
  --oov-sh:0 2px 8px rgba(100,47,33,.06), 0 18px 40px -24px rgba(100,47,33,.34);

  position:relative;
  padding:clamp(50px,6.5vw,92px) 0;
  background:#FFFFFF; color:var(--oov-ink);
  font-family:var(--oov-f-body); font-size:16px; line-height:1.7; font-weight:400;
}
.oo-reviews-sec,.oo-reviews-sec *,.oo-reviews-sec *::before,.oo-reviews-sec *::after{ box-sizing:border-box; }

.oo-reviews-sec--alt{ background:#F7F7F7; }
.oo-reviews-sec--cool{ background:#EFF6F8; }
.oo-reviews-sec--alt::before,.oo-reviews-sec--cool::before{
  content:""; position:absolute; inset:0 0 auto 0; height:1px;
  background:linear-gradient(90deg,transparent,var(--oov-border-2),transparent);
}

.oo-reviews-sec__in{ max-width:var(--oov-maxw); margin-inline:auto; padding-inline:var(--oov-pad); }

.oo-reviews-sec__head{ margin-bottom:34px; text-align:center; }
.oo-reviews-sec__eyebrow{
  display:inline-flex; align-items:center; gap:10px; margin:0;
  font-family:var(--oov-f-head); font-weight:600; font-size:.78rem;
  letter-spacing:.22em; text-transform:uppercase; color:var(--oov-brown);
}
.oo-reviews-sec__eyebrow::before{ content:""; flex:none; width:22px; height:2px; background:currentColor; opacity:.5; }
.oo-reviews-sec__title{
  position:relative; margin:14px 0 0; padding-bottom:18px;
  font-family:var(--oov-f-display); font-weight:700;
  font-size:clamp(2rem,4.4vw,3.4rem); line-height:1;
  letter-spacing:.012em; text-transform:uppercase; color:var(--oov-red);
}
.oo-reviews-sec__title::after{
  content:""; position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:58px; height:3px; border-radius:3px; background:var(--oov-yellow);
}
@media (max-width:620px){ .oo-reviews-sec__eyebrow::before{ display:none; } }

.oo-reviews{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
@media (max-width:900px){ .oo-reviews{ grid-template-columns:1fr; } }

.oo-review{
  position:relative; overflow:hidden;
  display:flex; flex-direction:column; gap:11px;
  /* the UA gives blockquote margin:1em 40px; without this the cards sit
     inside 40px of dead space on each side */
  margin:0;
  padding:24px 24px 20px;
  background:var(--oov-surface); border:1px solid var(--oov-border);
  border-radius:var(--oov-r); box-shadow:var(--oov-sh);
}
.oo-review::before{
  content:"\201C"; position:absolute; top:12px; right:24px;
  font-family:var(--oov-f-display); font-weight:700; font-size:3rem; line-height:1;
  color:var(--oov-yellow); opacity:.32; pointer-events:none;
}
/* brand yellow on a white card runs at 1.7:1, so the stars take a deeper gold */
.oo-review__stars{ color:var(--oov-star); font-size:.82rem; letter-spacing:2px; line-height:1; }
.oo-review__q{ position:relative; margin:0; font-size:.95rem; line-height:1.62; color:var(--oov-ink); }
.oo-review__by{
  /* it is a <footer>, which the theme sets a tight line-height on */
  line-height:1.65;
  margin-top:auto; padding-top:14px; width:100%;
  border-top:1px solid var(--oov-border);
  font-family:var(--oov-f-head); font-weight:600; font-size:.86rem;
  letter-spacing:.06em; text-transform:uppercase; color:var(--oov-brown);
}
.oo-review__by small{
  display:block; font-weight:400; font-size:.68rem;
  letter-spacing:.14em; color:var(--oov-faint);
}

.oo-reviews-sec :focus-visible{ outline:3px solid var(--oov-yellow); outline-offset:2px; border-radius:2px; }

.oo-js .oo-reviews-sec .oo-reveal{ opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; }
.oo-js .oo-reviews-sec .oo-reveal.oo-is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .oo-js .oo-reviews-sec .oo-reveal{ opacity:1; transform:none; transition:none; } }

/* theme hardening: a theme styles bare blockquote/h2/p, and those rules beat inheritance */
/* The theme hangs an 80px Font Awesome quote glyph on every blockquote::after,
   which lands on top of the author line. The card draws its own mark in
   ::before, so the theme's is turned off here. */
.oo-review::after{ content:none !important; }
/* The theme squares off bare blockquote corners with !important. Tested in
   the browser: two and three class levels both still lose, so !important is
   the only thing that answers it. */
.oo-reviews-sec .oo-review{ border-radius:var(--oov-r) !important; }
.oo-reviews-sec__eyebrow,.oo-reviews-sec__title,.oo-review__q{ margin-block-end:0; }
body.elementor-editor-active .oo-reviews-sec .oo-reveal{ opacity:1; transform:none; }