/* ============================================================
   IVNV Community Reviews — floating pop-ups + testimonial carousel
   Scoped under .ivnvr-* to avoid collisions with site styles.
   Premium dark green-gold glass aesthetic. SVG marks + stars.
   Respects prefers-reduced-motion. Mobile-optimized.
   ============================================================ */

:root{
  --ivnvr-green: var(--green, #70ff9c);
  --ivnvr-gold:  var(--gold,  #f4c76b);
  --ivnvr-text:  var(--text,  #fff8e6);
  --ivnvr-soft:  var(--soft,  rgba(255,248,230,.72));
  --ivnvr-line:  var(--line,  rgba(244,199,107,.28));
  --ivnvr-star:  #ffcf6b;
  --ivnvr-font:  var(--font,  Inter, ui-sans-serif, system-ui, sans-serif);
  --ivnvr-display: var(--display, Georgia, "Times New Roman", serif);
}

/* ---------- shared marks ---------- */
.ivnvr-stars{ display:inline-flex; align-items:center; gap:3px; line-height:0; }
.ivnvr-star{ width:14px; height:14px; flex:0 0 auto; fill:var(--ivnvr-star); filter:drop-shadow(0 1px 1px rgba(0,0,0,.35)); }
.ivnvr-leaf{ width:18px; height:18px; color:#06160d; }
.ivnvr-check{ width:12px; height:12px; color:var(--ivnvr-green); flex:0 0 auto; }

/* ---------- floating popup ---------- */
.ivnvr-pop{
  position: fixed; right: 22px; bottom: 22px; z-index: 9990;
  width: min(330px, calc(100vw - 24px)); max-width: 330px; box-sizing: border-box;
  padding: 18px 18px 17px; border-radius: 16px;
  border: 1px solid var(--ivnvr-line);
  background: linear-gradient(158deg, rgba(10,26,18,.95), rgba(5,15,10,.9));
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  color: var(--ivnvr-text); font-family: var(--ivnvr-font);
  box-shadow: 0 22px 56px -16px rgba(0,0,0,.72), 0 1px 0 rgba(255,255,255,.04) inset, 0 0 0 1px rgba(244,199,107,.07), 0 0 28px -10px rgba(112,255,156,.16);
  opacity: 0; transform: translateY(18px) scale(.985); pointer-events: none;
  transition: opacity .5s ease, transform .55s cubic-bezier(.22,1,.36,1);
}
.ivnvr-pop.ivnvr-show{ opacity: 1; transform: none; pointer-events: auto; animation: ivnvr-glow 4.2s ease-in-out infinite; }
@keyframes ivnvr-glow{
  0%,100%{ box-shadow: 0 22px 56px -16px rgba(0,0,0,.72), 0 0 0 1px rgba(244,199,107,.07), 0 0 26px -10px rgba(112,255,156,.14); }
  50%    { box-shadow: 0 22px 60px -14px rgba(0,0,0,.74), 0 0 0 1px rgba(244,199,107,.12), 0 0 42px -8px rgba(112,255,156,.28); }
}
@keyframes ivnvr-bar{ from{ transform: scaleX(0); } to{ transform: scaleX(1); } }

.ivnvr-close{
  position:absolute; top:9px; right:9px; width:26px; height:26px; border-radius:50%;
  border:1px solid var(--ivnvr-line); background:rgba(0,0,0,.32); color:var(--ivnvr-soft);
  font-size:16px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .2s, color .2s, transform .2s;
}
.ivnvr-close:hover{ background:rgba(0,0,0,.5); color:var(--ivnvr-text); transform:scale(1.08); }
.ivnvr-close:focus-visible{ outline:2px solid var(--ivnvr-gold); outline-offset:2px; }

.ivnvr-head{ display:flex; align-items:center; gap:11px; padding-right:28px; }
.ivnvr-avatar{
  flex:0 0 auto; width:40px; height:40px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, var(--ivnvr-green), var(--ivnvr-gold));
  box-shadow:0 4px 12px -4px rgba(112,255,156,.45), 0 0 0 1px rgba(244,199,107,.25);
}
.ivnvr-headtext{ display:flex; flex-direction:column; gap:3px; min-width:0; }
.ivnvr-title{ font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--ivnvr-gold); }
.ivnvr-label{ display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:600; color:var(--ivnvr-soft); letter-spacing:.01em; }
.ivnvr-stars{ margin:12px 0 8px; }
.ivnvr-text{ margin:0 0 14px; font-size:14px; line-height:1.55; color:var(--ivnvr-text); }
.ivnvr-cta{
  display:inline-flex; align-items:center; gap:6px; font-family:var(--ivnvr-font);
  font-size:12.5px; font-weight:700; letter-spacing:.01em; color:#06160d;
  background:linear-gradient(135deg, var(--ivnvr-green), var(--ivnvr-gold));
  border:none; border-radius:11px; padding:10px 15px; cursor:pointer;
  box-shadow:0 6px 18px -8px rgba(112,255,156,.55);
  transition:transform .2s ease, filter .2s ease, box-shadow .2s ease;
}
.ivnvr-cta:hover{ transform:translateY(-1px); filter:brightness(1.05); box-shadow:0 10px 22px -8px rgba(112,255,156,.6); }
.ivnvr-cta:focus-visible{ outline:2px solid var(--ivnvr-gold); outline-offset:2px; }
.ivnvr-progress{ position:absolute; left:0; right:0; bottom:0; height:3px; overflow:hidden; border-radius:0 0 16px 16px; background:rgba(255,255,255,.05); }
.ivnvr-progress > span{ display:block; height:100%; width:100%; transform:scaleX(0); transform-origin:left; background:linear-gradient(90deg, var(--ivnvr-green), var(--ivnvr-gold)); }
.ivnvr-pop.ivnvr-paused .ivnvr-progress > span{ animation-play-state:paused !important; }

@media (max-width:640px){
  .ivnvr-pop{ right:12px; left:12px; bottom:12px; width:auto; max-width:none; }
}

/* ---------- testimonial carousel section ---------- */
.ivnvr-section{ width:100%; padding:72px 20px 80px; box-sizing:border-box; }
.ivnvr-section-inner{ max-width:880px; margin:0 auto; text-align:center; }
.ivnvr-eyebrow{ margin:0 0 10px; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--ivnvr-green); }
.ivnvr-section-title{ margin:0 0 10px; font-family:var(--ivnvr-display); font-size:clamp(27px,4vw,42px); line-height:1.08; color:var(--ivnvr-text); }
.ivnvr-section-sub{ margin:0 auto 34px; max-width:540px; font-size:14.5px; line-height:1.6; color:var(--ivnvr-soft); }
.ivnvr-carousel{ display:flex; align-items:center; gap:12px; }
.ivnvr-viewport{ flex:1 1 auto; overflow:hidden; border-radius:20px; }
.ivnvr-viewport:focus-visible{ outline:2px solid var(--ivnvr-gold); outline-offset:3px; }
.ivnvr-track{ display:flex; margin:0; padding:0; list-style:none; transition:transform .6s cubic-bezier(.22,1,.36,1); }
.ivnvr-slide{ flex:0 0 100%; box-sizing:border-box; padding:4px; }
.ivnvr-card{
  height:100%; box-sizing:border-box; padding:30px 30px 28px; border-radius:20px; text-align:left;
  border:1px solid var(--ivnvr-line);
  background:linear-gradient(158deg, rgba(10,26,18,.74), rgba(5,15,10,.52));
  -webkit-backdrop-filter:blur(13px); backdrop-filter:blur(13px);
  box-shadow:0 16px 44px -18px rgba(0,0,0,.62);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.ivnvr-card:hover{ transform:translateY(-4px); border-color:rgba(244,199,107,.5); box-shadow:0 24px 54px -18px rgba(0,0,0,.68), 0 0 30px -10px rgba(112,255,156,.22); }
.ivnvr-card-top{ display:flex; align-items:center; gap:13px; margin-bottom:16px; }
.ivnvr-card .ivnvr-avatar{ width:46px; height:46px; }
.ivnvr-card .ivnvr-leaf{ width:21px; height:21px; }
.ivnvr-card .ivnvr-star{ width:16px; height:16px; }
.ivnvr-card-meta{ display:flex; flex-direction:column; gap:3px; }
.ivnvr-card-label{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:700; letter-spacing:.02em; color:var(--ivnvr-gold); }
.ivnvr-card-sub{ font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--ivnvr-soft); }
.ivnvr-card-stars{ margin-bottom:14px; }
.ivnvr-card-text{ margin:0; font-size:16px; line-height:1.62; color:var(--ivnvr-text); font-family:var(--ivnvr-display); }
.ivnvr-arrow{
  flex:0 0 auto; width:46px; height:46px; border-radius:50%; border:1px solid var(--ivnvr-line);
  background:rgba(10,26,18,.6); color:var(--ivnvr-gold); font-size:24px; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  transition:background .2s, transform .2s, color .2s;
}
.ivnvr-arrow:hover{ background:rgba(10,26,18,.88); transform:scale(1.06); color:var(--ivnvr-text); }
.ivnvr-arrow:focus-visible{ outline:2px solid var(--ivnvr-gold); outline-offset:2px; }
.ivnvr-dots{ display:flex; justify-content:center; gap:9px; margin-top:24px; }
.ivnvr-dot{ width:8px; height:8px; padding:0; border-radius:50%; border:none; cursor:pointer; background:rgba(255,248,230,.26); transition:background .25s, transform .25s, width .25s; }
.ivnvr-dot.ivnvr-active{ width:22px; border-radius:5px; background:linear-gradient(135deg, var(--ivnvr-green), var(--ivnvr-gold)); }
.ivnvr-dot:focus-visible{ outline:2px solid var(--ivnvr-gold); outline-offset:2px; }
@media (max-width:640px){
  .ivnvr-section{ padding:54px 14px 60px; }
  .ivnvr-arrow{ width:40px; height:40px; font-size:21px; }
  .ivnvr-card{ padding:24px 22px; }
  .ivnvr-card-text{ font-size:15px; }
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  .ivnvr-pop{ transition:opacity .25s ease; transform:none; }
  .ivnvr-pop.ivnvr-show{ transform:none; animation:none; }
  .ivnvr-track{ transition:none; }
  .ivnvr-card{ transition:none; }
  .ivnvr-card:hover{ transform:none; }
  .ivnvr-dot{ transition:none; }
  .ivnvr-progress > span{ animation:none !important; }
}
