/* =============================================================================
   REVERA ARC SLIDER — structural styles.
   Typography / colour / spacing are overridden by the Elementor Style controls
   (they output CSS scoped to {{WRAPPER}}). These defaults keep it looking right
   before any control is touched.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Saira+Condensed:ital,wght@0,600;0,700;0,800;1,600;1,700;1,800&display=swap');

.revera-stage{
  position:relative; width:100%; height:var(--revera-height,720px); min-height:420px;
  overflow:hidden; container-type:size; isolation:isolate; background:#160510;
  --revera-accent:#ff4fa3;
  --revera-glass-h:60cqh; --revera-glass-dx:0px; --revera-glass-dy:0px;
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
.revera-stage *{ box-sizing:border-box; }

/* theme / background image (behind everything) */
.revera-theme{ position:absolute; inset:0; z-index:0; background-size:cover; background-position:center center; background-repeat:no-repeat; }

/* colour layers — swapped instantly on select */
.revera-bgcolor{ position:absolute; inset:0; z-index:0; opacity:0; }

/* background curves + depth */
.revera-bg{ position:absolute; inset:0; pointer-events:none; z-index:1; }
.revera-glow-tl{ position:absolute; left:-8%; top:-14%; width:55%; height:70%;
  background:radial-gradient(closest-side, rgba(255,255,255,.10), transparent 70%); filter:blur(4px); }
.revera-glow-bl{ position:absolute; left:-22%; bottom:-30%; width:70%; height:80%; border-radius:50%;
  background:radial-gradient(closest-side, rgba(20,4,14,.55), transparent 68%); filter:blur(6px); }

/* the visible half-circle strip */
.revera-arc{ position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none; overflow:visible; }
.revera-arc path{ fill:none; stroke-linecap:round; stroke-linejoin:round; stroke:var(--revera-arc-color,#fff7fb); }
.revera-arc path:nth-child(1){ stroke-opacity:.05; }
.revera-arc path:nth-child(2){ stroke-opacity:.11; }
.revera-arc path:nth-child(3){ stroke-opacity:.18; }

/* coloured glow behind the glass */
.revera-halo{ position:absolute; z-index:1; filter:blur(8px); }

/* the animated glass */
.revera-glass{ position:absolute; left:0; top:0; z-index:2; display:inline-block; opacity:0; will-change:transform,opacity;
  filter:drop-shadow(0 30px 38px rgba(0,0,0,.5)); }
.revera-glass-svg,.revera-glass-img{ display:block; height:var(--revera-glass-h,60cqh); width:auto; max-width:46cqw; }
.revera-glass-img{ object-fit:contain; }
.revera-glass.is-rest .revera-glass-svg,
.revera-glass.is-rest .revera-glass-img{ animation:revera-bob 5s ease-in-out infinite; }
@keyframes revera-bob{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-2%);} }

/* copy panel */
.revera-panel{ position:absolute; right:4.5%; top:29%; width:44%; text-align:right; z-index:3; }
.revera-eyebrow{ font-weight:700; letter-spacing:.42em; padding-left:.42em;
  font-size:clamp(11px,1.35cqw,20px); color:rgba(255,255,255,.85); }
.revera-title{ font-family:"Saira Condensed","Arial Narrow",sans-serif; font-style:italic; font-weight:800;
  line-height:.88; letter-spacing:-.004em; font-size:clamp(40px,6.6cqw,120px); margin:.1em 0 .34em;
  color:#fff; text-shadow:0 8px 34px rgba(0,0,0,.4); white-space:nowrap; }
.revera-desc{ font-size:clamp(12px,1.5cqw,21px); line-height:1.6; color:rgba(255,255,255,.72);
  margin-left:auto; max-width:34ch; }

/* flavour cards */
.revera-cards{ position:absolute; right:3%; bottom:4.5%; z-index:4; display:flex;
  gap:clamp(6px,.7cqw,13px); justify-content:flex-end; align-items:flex-end; }
.revera-card{ appearance:none; border:0; cursor:pointer; color:inherit; font:inherit; display:flex;
  flex-direction:column; align-items:center; gap:.5cqw; width:clamp(74px,7cqw,116px);
  padding:clamp(9px,1cqw,16px) .8cqw clamp(7px,.9cqw,13px); border-radius:14px;
  background:rgba(150,105,122,.10); box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);
  transition:background .3s, box-shadow .3s, transform .3s; }
.revera-card:hover{ background:rgba(255,255,255,.07); transform:translateY(-3px); }
.revera-card.is-active{ background:rgba(255,255,255,.10);
  box-shadow:inset 0 0 0 1.5px var(--revera-accent), 0 14px 30px -16px rgba(0,0,0,.65); }
.revera-card:focus-visible{ outline:2px solid #fff; outline-offset:3px; }
.revera-card img,.revera-card svg{ width:clamp(44px,3.9cqw,66px); height:auto;
  filter:drop-shadow(0 6px 12px rgba(0,0,0,.45)); }
.revera-cname{ font-family:"Saira Condensed",sans-serif; font-weight:700;
  font-size:clamp(12px,1.15cqw,18px); letter-spacing:.02em; line-height:1; color:#fff; }
.revera-csub{ font-size:clamp(9px,.9cqw,13px); letter-spacing:.12em; color:rgba(255,255,255,.6); margin-top:.3cqw; }
.revera-card.is-active .revera-csub{ color:var(--revera-accent); }

/* tablet */
@media (max-width:1024px){
  .revera-panel{ top:24%; width:48%; }
  .revera-stage{ --revera-glass-h:52cqh; }
}
/* mobile — vertical hero, no strip, scrollable cards */
@media (max-width:767px){
  .revera-arc{ display:none; }
  .revera-stage{ --revera-glass-h:33cqh; }
  .revera-glass-svg,.revera-glass-img{ max-width:60cqw; }
  .revera-halo{ filter:blur(10px); }
  .revera-panel{ right:auto; left:5%; width:90%; top:auto; bottom:24%; text-align:center; }
  .revera-eyebrow{ font-size:3cqw; letter-spacing:.26em; padding-left:.26em; }
  .revera-title{ font-size:clamp(30px,10.5cqw,52px); white-space:normal; line-height:.94; margin:.1em 0 .32em; }
  .revera-desc{ font-size:3.3cqw; line-height:1.5; margin:0 auto; max-width:94%; }
  .revera-cards{ left:0; right:0; bottom:4%; padding:0 4%; justify-content:flex-start;
    overflow-x:auto; gap:3.5cqw; scrollbar-width:none; -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity; }
  .revera-cards::-webkit-scrollbar{ display:none; }
  .revera-card{ flex:0 0 auto; width:31cqw; padding:3cqw 2cqw; border-radius:12px; scroll-snap-align:start; }
  .revera-card img,.revera-card svg{ width:15cqw; }
  .revera-cname{ font-size:3.3cqw; } .revera-csub{ font-size:2.6cqw; }
}
@media (prefers-reduced-motion:reduce){
  .revera-glass.is-rest .revera-glass-svg,.revera-glass.is-rest .revera-glass-img{ animation:none; }
}