/*
Theme Name: RevenCall
Theme URI: https://revencall.com
Author: Revenco Agency
Description: Tema publica RevenCall. Construita pentru designul nou: violet profund, personajul Nova, sectiuni de tip landing pentru homepage si pentru fiecare industrie.
Version: 1.2.3
Requires at least: 6.5
Requires PHP: 8.1
License: GPL-2.0-or-later
Text Domain: revencall
*/

:root {
  --rc-violet: #6D28D9;
  --rc-purple: #8B5CF6;
  --rc-purple-light: #A78BFA;
  --rc-cyan: #22D3EE;
  --rc-ink: #170B2E;
  /*
   * Body and secondary text are near-black, not grey.
   *
   * The greys these replaced measured 4.2-4.5:1 against the lavender section
   * backgrounds, which is at or under the readable minimum, and it reads as washed-out
   * brown rather than as a deliberate hierarchy. Hierarchy now comes from size and weight
   * instead of from fading the ink out.
   */
  --rc-body: #191527;
  --rc-muted: #2E2A40;
  /* Text sitting on the deep violet backgrounds, where the roles invert. */
  --rc-on-dark: #F1EDFC;
  --rc-on-dark-soft: #C6BEE2;
  /* Brand violet is fine on white, but the lavender section grounds drag it to ~5.3:1.
     Text-only accents use a deeper shade so nothing on this page sits under 7:1. */
  --rc-violet-text: #55189C;
  --rc-line: #E9E6F2;
  --rc-bg: #FFFFFF;
  --rc-bg-soft: #F7F5FD;
  --rc-radius: 18px;
  --rc-radius-sm: 12px;
  --rc-shadow: 0 8px 30px rgba(109, 40, 217, .08);
  --rc-max: 1200px;
  --rc-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --rc-header-h: 68px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0; background: var(--rc-bg); color: var(--rc-body);
  font-family: var(--rc-font); font-size: 16px; line-height: 1.65;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--rc-violet); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { color: var(--rc-ink); line-height: 1.15; margin: 0 0 .5em; font-weight: 700; letter-spacing: -.02em; }
h1 { font-size: clamp(2.1rem, 4.6vw, 3.35rem); }
h2 { font-size: clamp(1.6rem, 3.2vw, 2.4rem); }
h3 { font-size: 1.15rem; }
p { margin: 0 0 1rem; }
button { font: inherit; }

.rc-wrap { width: 100%; max-width: var(--rc-max); margin-inline: auto; padding-inline: 20px; }
.rc-section { padding-block: clamp(48px, 7vw, 84px); }
.rc-section--soft { background: var(--rc-bg-soft); }
.rc-section--tight { padding-block: clamp(32px, 4vw, 52px); }
/* Figures are deliberately larger than the frame; the section edge is what cuts them. */
.rc-section--art { background-size: cover; background-position: center; overflow: hidden; }
.rc-center { text-align: center; }
.rc-accent { color: var(--rc-violet-text); }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.rc-eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: .78rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
  color: var(--rc-violet-text); font-weight: 700; margin-bottom: .5rem;
}
.rc-lead { font-size: 1.02rem; font-weight: 500; color: var(--rc-muted); max-width: 58ch; }
.rc-lead--center { margin-inline: auto; }
.rc-note { font-size: .85rem; font-weight: 500; color: var(--rc-muted); margin-top: .9rem; }

.rc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .82rem 1.45rem; border-radius: 999px; font-weight: 600; font-size: .93rem;
  border: 1px solid transparent; cursor: pointer; transition: transform .15s ease, box-shadow .15s ease;
  white-space: nowrap;
}
.rc-btn:hover { text-decoration: none; transform: translateY(-1px); }
.rc-btn--primary { background: var(--rc-violet); color: #fff; box-shadow: 0 6px 20px rgba(109,40,217,.28); }
.rc-btn--ghost { background: #fff; color: var(--rc-ink); border-color: var(--rc-line); }

.rc-imgph {
  display: grid; place-items: center; text-align: center;
  background: linear-gradient(135deg, #EDE9FE, #F5F3FF);
  border: 1px dashed var(--rc-purple-light); border-radius: var(--rc-radius);
  color: var(--rc-purple); font-size: .82rem; font-weight: 600; padding: 1rem; min-height: 220px;
}
.rc-skip { position: absolute; left: -9999px; }
.rc-skip:focus { left: 8px; top: 8px; background: #fff; padding: .6rem 1rem; border-radius: 8px; z-index: 100; }

/* ============================ HEADER ============================ */
.rc-header { background: rgba(255,255,255,.9); backdrop-filter: blur(10px); position: sticky; top: 0; z-index: 60; transition: box-shadow .2s ease, border-color .2s ease; border-bottom: 1px solid transparent; }
.rc-header.is-stuck { border-bottom-color: var(--rc-line); box-shadow: 0 6px 24px rgba(23,11,46,.06); }
.rc-header__inner { display: flex; align-items: center; gap: 1rem; min-height: var(--rc-header-h); }
.rc-logo { display: flex; align-items: center; gap: .55rem; font-weight: 700; color: var(--rc-ink); font-size: 1.08rem; }
.rc-logo:hover { text-decoration: none; }
.rc-logo__mark { width: 30px; height: 30px; border-radius: 9px; background: linear-gradient(135deg, var(--rc-violet), var(--rc-purple)); display: grid; place-items: center; color: #fff; font-weight: 800; font-size: .9rem; }

.rc-nav { display: none; align-items: center; gap: .35rem; margin-left: 1.5rem; }
@media (min-width: 1040px) { .rc-nav { display: flex; } }
.rc-nav__link {
  display: inline-flex; align-items: center; gap: .3rem; background: none; border: 0; cursor: pointer;
  color: var(--rc-body); font-size: .92rem; font-weight: 500; padding: .5rem .7rem; border-radius: 9px;
}
.rc-nav__link:hover { color: var(--rc-ink); background: var(--rc-bg-soft); text-decoration: none; }
.rc-nav__caret { font-size: .6rem; opacity: .85; }
.rc-nav__group { position: relative; }
.rc-nav__panel {
  position: absolute; top: calc(100% + 8px); left: 0; min-width: 232px; display: none;
  background: #fff; border: 1px solid var(--rc-line); border-radius: 14px; padding: .5rem;
  box-shadow: 0 16px 40px rgba(23,11,46,.12); flex-direction: column; gap: .1rem;
}
.rc-nav__group.is-open .rc-nav__panel { display: flex; }
.rc-nav__panel a { padding: .55rem .7rem; border-radius: 9px; color: var(--rc-body); font-size: .88rem; }
.rc-nav__panel a:hover { background: var(--rc-bg-soft); color: var(--rc-ink); text-decoration: none; }

.rc-header__cta { display: flex; align-items: center; gap: .6rem; margin-left: auto; }
.rc-header__demo { display: none; }
@media (min-width: 780px) { .rc-header__demo { display: inline-flex; } }

.rc-burger { display: grid; gap: 4px; background: none; border: 0; padding: .55rem; cursor: pointer; }
@media (min-width: 1040px) { .rc-burger { display: none; } }
.rc-burger span { display: block; width: 20px; height: 2px; background: var(--rc-ink); border-radius: 2px; transition: transform .2s ease, opacity .2s ease; }
.rc-burger.is-open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.rc-burger.is-open span:nth-child(2) { opacity: 0; }
.rc-burger.is-open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.rc-mobile { border-top: 1px solid var(--rc-line); background: #fff; padding-block: 1rem; max-height: 70vh; overflow-y: auto; }
.rc-mobile .rc-wrap { display: grid; gap: .1rem; }
.rc-mobile a { padding: .6rem .2rem; color: var(--rc-ink); font-weight: 600; font-size: .95rem; }
.rc-mobile__sub { padding-left: 1rem !important; color: var(--rc-muted) !important; font-weight: 500 !important; font-size: .88rem !important; }
.rc-mobile__cta { margin-top: .8rem; justify-content: center; }

/* ============================ HERO ============================ */
.rc-hero {
  /* Only the horizontal axis is clipped. `overflow: hidden` would also cut the benefit strip,
     which is translated downward on purpose, and Nova, who deliberately runs past the edge. */
  position: relative; overflow-x: clip; background-size: cover; background-position: center right;
  background-color: #F3EFFF; padding-top: clamp(40px, 5vw, 68px); padding-bottom: 0;
}
.rc-hero__inner { display: grid; gap: 1rem; align-items: center; }
@media (min-width: 992px) { .rc-hero__inner { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: 2rem; } }
.rc-hero__copy { padding-bottom: clamp(24px, 3vw, 40px); }
.rc-hero h1 { margin-bottom: 1rem; }
/* The lede inherits the shared ink; it had its own lighter grey, which was the
   least readable text on the page. */

.rc-hero__form {
  display: flex; align-items: center; gap: .5rem; background: #fff;
  border-radius: 999px; padding: .38rem .38rem .38rem 1rem; margin-block: 1.5rem 1rem;
  max-width: 520px; box-shadow: 0 12px 34px rgba(109,40,217,.16); border: 1px solid var(--rc-line);
}
.rc-hero__form-icon { opacity: .8; }
.rc-hero__form input {
  flex: 1; min-width: 0; border: 0; outline: 0; font: inherit; font-size: .95rem;
  padding: .6rem .4rem; color: var(--rc-ink); background: transparent;
}
.rc-hero__trust { display: flex; flex-wrap: wrap; gap: 1.1rem; list-style: none; padding: 0; margin: 0; font-size: .84rem; font-weight: 500; color: var(--rc-body); }

/* Nova is bottom-anchored and deliberately runs past the hero's lower edge so the benefit
   strip crops her, exactly as in the design. Floating her above the strip with a gap was the
   thing that read as broken. She also hugs the right of her column instead of being centred
   in it, which keeps her over the purple part of the background. */
.rc-hero__art { align-self: end; position: relative; z-index: 1; margin-bottom: -140px; }
.rc-hero__art img {
  margin-left: auto; margin-right: 0;
  /* max-height, not height: with a fixed height a narrow column would squash the width and
     distort her. This way she scales down whole and keeps her proportions. */
  max-height: clamp(430px, 46vw, 660px); height: auto; width: auto;
  filter: drop-shadow(0 24px 50px rgba(76,29,149,.35));
}
@media (max-width: 991px) {
  /*
   * The render is cut mid-thigh in the source file, so keeping her whole was never an
   * option: the only question is where the cut lands. On desktop the benefit card rides
   * over it. Here it used to sit 75px ABOVE the card, fully exposed against the purple,
   * which is what read as a torn photo.
   *
   * The card is translated down by half its own height, so its visible top is always
   * (layout top + 76.5px). Pulling the art box up by 100px lands that edge ~24px over the
   * cut: enough to bury the edge and the shadow it casts, without eating her hips.
   */
  .rc-hero__art { margin-bottom: -100px; }
  .rc-hero__art img { margin-inline: auto; max-height: clamp(320px, 62vw, 470px); height: auto; }

  /*
   * Grid items default to `min-width: auto`, so the column grows to the widest thing
   * inside it. The search field plus a nowrap button gave the column a 414px minimum on a
   * 375px screen, and because the hero clips its horizontal overflow the headline was
   * being cut rather than wrapped. minmax(0, 1fr) lets the column be narrower than its
   * contents; the form is then allowed to stack so nothing needs that width in the first
   * place.
   */
  .rc-hero__inner { grid-template-columns: minmax(0, 1fr); }
  .rc-hero__copy { min-width: 0; }

  /*
   * On phones the background art is cropped to a narrow, saturated band that lands right
   * behind the copy: the headline accent measured 1:1 against it, meaning literally
   * invisible. A feathered scrim restores a near-white ground under the text and dies out
   * before it reaches Nova, so the artwork still shows where nothing has to be read.
   */
  .rc-hero__copy { position: relative; z-index: 1; }
  .rc-hero__copy::before {
    content: ""; position: absolute; z-index: -1; inset: -40px -30px -10px -30px;
    background: radial-gradient(125% 92% at 50% 42%,
      rgba(255,255,255,.97) 0%, rgba(255,255,255,.95) 52%, rgba(255,255,255,.72) 78%, rgba(255,255,255,0) 100%);
    pointer-events: none;
  }
}

@media (max-width: 560px) {
  /* Field over button: a nowrap call to action must not be what decides the column width. */
  .rc-hero__form { flex-wrap: wrap; border-radius: 20px; padding: .55rem; }
  .rc-hero__form input { flex: 1 1 auto; width: 0; }
  .rc-hero__form .rc-btn { flex: 1 1 100%; }
}

/* Benefit strip sits inside the hero, overlapping its lower edge: no white gap. */
.rc-strip-wrap { position: relative; z-index: 5; transform: translateY(50%); margin-top: -1px; }
.rc-strip {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(148px, 1fr);
  gap: .5rem; overflow-x: auto; scroll-snap-type: x mandatory;
  background: #fff; border: 1px solid var(--rc-line); border-radius: var(--rc-radius);
  padding: 1.1rem; box-shadow: 0 18px 46px rgba(76,29,149,.16);
  scrollbar-width: none;
}
.rc-strip::-webkit-scrollbar { display: none; }
.rc-strip__item { display: grid; gap: .22rem; text-align: center; padding-inline: .5rem; scroll-snap-align: center; }
.rc-strip__item + .rc-strip__item { border-left: 1px solid var(--rc-line); }
.rc-strip__icon { font-size: 1.15rem; }
.rc-strip__item strong { font-size: .88rem; color: var(--rc-ink); }
.rc-strip__item span:last-child { font-size: .73rem; font-weight: 500; color: var(--rc-muted); line-height: 1.35; }

/* The section after the hero absorbs the strip's overhang. */
.rc-hero + .rc-section { padding-top: clamp(88px, 10vw, 130px); }

/* ==================== SECTION HEAD + ARROWS ==================== */
.rc-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.75rem; flex-wrap: wrap; }
.rc-head .rc-lead { margin-bottom: 0; }
.rc-arrows { display: flex; gap: .5rem; }
.rc-arrow {
  width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--rc-line); background: #fff;
  color: var(--rc-ink); font-size: 1.25rem; line-height: 1; cursor: pointer; display: grid; place-items: center;
  transition: border-color .15s ease, color .15s ease, opacity .15s ease;
}
.rc-arrow:hover:not(:disabled) { border-color: var(--rc-purple); color: var(--rc-purple); }
.rc-arrow:disabled { opacity: .62; cursor: default; }
[data-carousel].is-static .rc-arrows { display: none; }

.rc-carousel { position: relative; }
.rc-carousel__track {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 1rem;
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-left: 0;
  padding-bottom: .5rem; scrollbar-width: none;
}
.rc-carousel__track::-webkit-scrollbar { display: none; }
.rc-carousel__track > * { scroll-snap-align: start; }
@media (min-width: 700px) { .rc-carousel__track { grid-auto-columns: minmax(255px, calc(33.333% - .667rem)); } }
@media (min-width: 1040px) { .rc-carousel__track { grid-auto-columns: minmax(240px, calc(25% - .75rem)); } }
.rc-carousel__track--results { grid-auto-columns: minmax(230px, 1fr); }
@media (min-width: 700px) { .rc-carousel__track--results { grid-auto-columns: minmax(240px, calc(33.333% - .667rem)); } }
@media (min-width: 1040px) { .rc-carousel__track--results { grid-auto-columns: minmax(230px, calc(25% - .75rem)); } }

/* ============================ DEMOS ============================ */
.rc-demo { background: #fff; border: 1px solid var(--rc-line); border-radius: var(--rc-radius); overflow: hidden; display: flex; flex-direction: column; }
.rc-demo.is-active { border-color: var(--rc-purple); box-shadow: 0 10px 28px rgba(109,40,217,.16); }
.rc-demo__media { position: relative; background: #1B1030; }
.rc-demo__media .rc-imgph { border: 0; border-radius: 0; min-height: 150px; }
/* Reserve the box before the file arrives. Without a height the container collapses to zero,
   the lazy loader never sees it enter the viewport, and the image never loads at all. */
.rc-demo__media { min-height: 150px; }
.rc-demo__media img { width: 100%; height: 150px; object-fit: cover; }
.rc-demo__media::after {
  content: ""; position: absolute; inset: auto 0 0 0; height: 60%;
  background: linear-gradient(to top, rgba(11,6,22,.78), transparent); pointer-events: none;
}
.rc-demo__title, .rc-demo__badge { z-index: 2; }
.rc-caps__art { min-height: 380px; }
.rc-demo__badge {
  position: absolute; top: .6rem; left: .6rem; background: var(--rc-violet); color: #fff;
  font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  padding: .25rem .55rem; border-radius: 999px;
}
.rc-demo__title { position: absolute; left: .8rem; bottom: .7rem; margin: 0; color: #fff; font-size: 1rem; text-shadow: 0 2px 10px rgba(0,0,0,.6); }
.rc-demo__player { display: flex; align-items: center; gap: .55rem; padding: .7rem .8rem; border-bottom: 1px solid var(--rc-line); }
.rc-demo__time { font-size: .75rem; font-weight: 500; color: var(--rc-muted); }
.rc-demo__text { font-size: .79rem; font-weight: 500; color: var(--rc-muted); padding: .8rem; margin: 0; }

.rc-play { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; flex: none; background: var(--rc-violet); color: #fff; font-size: .58rem; padding-left: 2px; }
.rc-play--lg { width: 36px; height: 36px; font-size: .78rem; }
.rc-wave { flex: 1; height: 20px; border-radius: 4px; background: repeating-linear-gradient(90deg, var(--rc-purple-light) 0 2px, transparent 2px 5px); opacity: .5; }

/* ========================= CAPABILITIES ========================= */
.rc-caps { display: grid; gap: 1rem; margin-top: 1.5rem; }
@media (min-width: 1040px) {
  /*
   * The figure is a BACKGROUND LAYER, not a middle column.
   *
   * Sizing her to fit a gap between the columns was the mistake: at that scale she reads as
   * "a picture in a column" and no amount of drift makes her feel like a separate plane.
   * The reference layout works because the character is far larger than the gap, the cards
   * sit ON TOP of her, and her limbs pass behind them. That overlap is the depth cue.
   *
   * She is cropped to a torso rather than shown full length. Full length cost the section
   * ~700px of empty ground under her boots, and it forced her narrow (ratio 0.245) to fit
   * the height, which is the reason the cards could never reach her. A torso is wide for its
   * height, so the same vertical budget buys far more overlap and leaves room to drift.
   */
  .rc-caps {
    /* Width of her ACTUAL body: the asset is trimmed to its opaque bbox, so the frame is the
       figure. The torso crop is ratio 0.563, wide enough that this width leaves ~72px of her
       behind each column. */
    --nova-w: clamp(280px, 24vw, 400px);
    position: relative;
    grid-template-columns: 1fr 1fr;
    /* Narrower than she is, so the cards genuinely overlap her sides and she sits behind them. */
    column-gap: clamp(150px, 14vw, 235px);
    align-items: start;
  }
  /* The right column starts lower, so the two sides never line up. */
  .rc-caps__col--offset { margin-top: clamp(64px, 9vw, 132px); }
  .rc-caps__col { position: relative; z-index: 1; }

  .rc-caps__art {
    position: absolute; left: 50%; top: 50%;
    width: var(--nova-w);
    margin-left: calc(var(--nova-w) / -2);
    /* height is width / 0.563 (the torso ratio), so half of that recentres her vertically */
    margin-top: calc(var(--nova-w) * -0.8886);
    z-index: 0; pointer-events: none;
  }
  /* Cards ride above her and stay legible over the artwork. */
  .rc-caps .rc-cap { background: rgba(255,255,255,.9); backdrop-filter: blur(9px); padding: 1.4rem 1.5rem; }
  .rc-caps .rc-cap h3 { font-size: 1.02rem; margin-bottom: .45rem; }
  .rc-caps .rc-cap ul { gap: .22rem; }
  .rc-caps .rc-cap li { font-size: .8rem; }
  .rc-caps__art img { width: 100%; max-height: none; height: auto; }
}
.rc-caps__col { display: grid; gap: .8rem; }
@media (min-width: 1040px) {
  /* Tall enough to hold the enlarged figure plus her drift, and pushed down so her head
     never reaches the section lede at the top of her travel. */
  /*
   * The gap between cards is not decoration, it is the mechanism.
   *
   * At .8rem a five-card column measured 655px, shorter than the viewport, so every card
   * crossed the reveal line inside the same flick of the wheel: the stagger fired as one
   * flash and the drift behind them had nothing to be read against. The reference section
   * runs 89.6px between cards, which is what makes each of its columns ~1568px and why its
   * cards arrive one at a time. Same proportion here, gap is about half a card height.
   */
  .rc-caps__col { row-gap: clamp(60px, 6.8vw, 112px); }
  /* The floor only matters on narrow desktops; past ~1200px the spaced-out cards are taller
     than it. margin-top is clearance, not decoration: at the top of her travel she sits
     ~45px above this box, and without the gap she would sit on the section lede. */
  .rc-caps { min-height: calc(clamp(280px, 24vw, 400px) * 1.777 + 220px); margin-top: 120px; }
}
.rc-cap { display: flex; gap: .8rem; background: rgba(255,255,255,.86); backdrop-filter: blur(6px); border: 1px solid rgba(255,255,255,.9); border-radius: var(--rc-radius-sm); padding: 1rem 1.1rem; box-shadow: 0 6px 20px rgba(76,29,149,.07); }
.rc-cap__icon { color: var(--rc-violet-text); font-size: .65rem; margin-top: .5rem; }
.rc-cap h3 { font-size: .94rem; margin-bottom: .3rem; }
.rc-cap ul { margin: 0; padding-left: 1rem; display: grid; gap: .12rem; }
.rc-cap li { font-size: .77rem; font-weight: 500; color: var(--rc-muted); }
.rc-caps__art { display: none; }
@media (min-width: 1040px) { .rc-caps__art { display: block; } }
/*
 * The only figure no boundary can crop: parallax moves her, so the distance from her cut to
 * the section edge swings between 89px and 371px while it is on screen. A fixed pull-down
 * cannot close a moving gap, so the hard edge is feathered instead and she dissolves into
 * the light at every position. mask-repeat must be no-repeat, otherwise the gradient tiles
 * and paints bands across her.
 */
.rc-caps__art img {
  margin-inline: auto; height: auto; filter: drop-shadow(0 28px 60px rgba(76,29,149,.34));
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 120px), transparent 100%);
          mask-image: linear-gradient(to bottom, #000 calc(100% - 120px), transparent 100%);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
}
/* No max-height here on purpose. This rule sits after the desktop block, and media queries add
   no specificity, so a cap here would tie and win on source order and silently shrink her.
   Below 1040px `.rc-caps__art` is display:none (the cards stack, leaving no centre column),
   so no mobile sizing rule is needed at all. */
/* Parallax: the character drifts slower than the page. Only a transform is animated, so the
   work stays on the compositor and never triggers layout. */
.rc-caps__art[data-parallax] { will-change: transform; }

/* Cards fade up as they enter the viewport, staggered, instead of all landing at once. */
[data-reveal] { opacity: 0; transform: translateY(26px); transition: opacity .55s ease, transform .55s cubic-bezier(.22,.61,.36,1); }
[data-reveal].is-in { opacity: 1; transform: none; }
/* Without scripting nothing would ever add .is-in, so the cards must start visible. */
.no-js [data-reveal] { opacity: 1; transform: none; }
/* Taller cards need a longer rise to register. Both halves are restated at this
   specificity, otherwise `.rc-caps [data-reveal]` would outrank the shared `.is-in`
   reset and the cards would never settle. */
.rc-caps [data-reveal] { transform: translateY(58px); }
.rc-caps [data-reveal].is-in { transform: none; }
@media (prefers-reduced-motion: reduce) {
  [data-reveal], [data-reveal].is-in { opacity: 1; transform: none; transition: none; }
  .rc-caps__art[data-parallax] { transform: none !important; }
}

/* ========================= INTEGRATIONS ========================= */
.rc-logos { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin-top: 1.25rem; }
.rc-logos__item {
  display: grid; place-items: center; gap: .45rem; background: #fff; border: 1px solid var(--rc-line);
  border-radius: var(--rc-radius-sm); padding: .85rem .7rem; width: 104px; min-height: 88px;
  box-shadow: 0 2px 10px rgba(109,40,217,.05); transition: border-color .15s ease, transform .15s ease;
}
.rc-logos__item:hover { border-color: var(--rc-purple-light); transform: translateY(-2px); }
/* Logos arrive at wildly different intrinsic sizes, so the box is fixed and the mark is
   contained inside it. Without object-fit a tall logo would stretch its row. */
/* Every mark is normalised into the same square, so a wordmark cannot outweigh an icon. */
.rc-logos__img { width: 28px; height: 28px; object-fit: contain; }
.rc-logos__name { font-size: .72rem; font-weight: 600; color: var(--rc-body); text-align: center; line-height: 1.2; }
.rc-logos__text { font-size: .82rem; font-weight: 600; color: var(--rc-body); }

/* ============================ RESULTS ============================ */
.rc-result { background: #fff; border: 1px solid var(--rc-line); border-radius: var(--rc-radius); padding: 1.2rem; display: grid; gap: .35rem; align-content: start; }
.rc-result__tag { justify-self: start; background: #EDE9FE; color: var(--rc-violet-text); font-size: .67rem; font-weight: 700; padding: .22rem .6rem; border-radius: 999px; }
.rc-result__figure { font-size: 1.85rem; color: var(--rc-ink); line-height: 1.1; }
.rc-result__label { font-size: .81rem; color: var(--rc-ink); font-weight: 600; }
.rc-result p { font-size: .79rem; font-weight: 500; color: var(--rc-muted); margin: .3rem 0 0; }
.rc-result__who { display: flex; align-items: center; gap: .6rem; border-top: 1px solid var(--rc-line); padding-top: .8rem; margin-top: .5rem; }
.rc-result__who strong { display: block; font-size: .79rem; color: var(--rc-ink); }
.rc-result__who em { font-size: .71rem; font-weight: 500; color: var(--rc-muted); font-style: normal; }
.rc-avatar { width: 32px; height: 32px; border-radius: 50%; background: linear-gradient(135deg, #DDD6FE, #C4B5FD); flex: none; }

/* ========================== HOW IT WORKS ========================== */
.rc-how { display: grid; gap: 2rem; align-items: center; }
@media (min-width: 992px) { .rc-how { grid-template-columns: .9fr 1.1fr; align-items: end; } }
/* This render is cropped at the thigh in the source file. Left floating inside the section
   that cut edge reads as a chopped image, which is what looked broken. Pulling her down by the
   section's bottom padding lands the cut exactly on the section boundary, so she reads as
   continuing below it. The middle-section render is a full body with boots, so it is NOT
   treated this way: it stays whole. */
.rc-how__art { align-self: end; margin-bottom: calc(-1 * clamp(48px, 7vw, 84px)); }
/*
 * Stacked, she came FIRST and the cut floated above the steps with nothing to crop it. The
 * treatment only works against a boundary, so on phones she moves to the end of the section
 * and the same negative margin drops her cut onto the section edge.
 */
@media (max-width: 991px) {
  .rc-how__copy { order: 1; }
  .rc-how__art  { order: 2; }
}
.rc-how__art img { margin-inline: auto; max-height: clamp(400px, 44vw, 700px); height: auto; width: auto; filter: drop-shadow(0 24px 50px rgba(76,29,149,.3)); }
.rc-steps { list-style: none; counter-reset: s; padding: 0; margin: 0 0 1.5rem; display: grid; gap: 1rem; }
.rc-steps li { counter-increment: s; display: grid; gap: .18rem; padding-left: 2.6rem; position: relative; }
.rc-steps li::before {
  content: counter(s); position: absolute; left: 0; top: 0;
  width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
  background: #fff; color: var(--rc-violet); font-weight: 700; font-size: .8rem; box-shadow: 0 4px 12px rgba(76,29,149,.14);
}
.rc-steps strong { color: var(--rc-ink); font-size: .94rem; }
.rc-steps span { font-size: .83rem; font-weight: 500; color: var(--rc-muted); }
.rc-player { display: inline-flex; align-items: center; gap: .8rem; background: #fff; border: 1px solid var(--rc-line); border-radius: 999px; padding: .65rem 1.1rem; font-size: .85rem; box-shadow: var(--rc-shadow); min-width: min(420px, 100%); }
.rc-player:hover { border-color: var(--rc-purple); color: var(--rc-violet); text-decoration: none; transform: translateY(-2px); }
.rc-player:focus-visible { outline: 3px solid var(--rc-purple); outline-offset: 3px; }

/* =========================== RESOURCES =========================== */
.rc-res { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.rc-res__card { display: flex; align-items: center; gap: .9rem; background: #fff; border: 1px solid var(--rc-line); border-radius: var(--rc-radius); padding: 1.05rem 1.15rem; color: inherit; transition: border-color .15s ease, transform .15s ease; }
.rc-res__card:hover { text-decoration: none; border-color: var(--rc-purple); transform: translateY(-2px); }
.rc-res__icon { width: 38px; height: 38px; border-radius: 11px; background: #EDE9FE; color: var(--rc-violet); display: grid; place-items: center; flex: none; font-size: .68rem; }
.rc-res__card strong { display: block; font-size: .91rem; color: var(--rc-ink); }
.rc-res__card em { font-size: .77rem; font-weight: 500; color: var(--rc-muted); font-style: normal; }
.rc-res__arrow { margin-left: auto; color: var(--rc-violet-text); }

/* ============================== CTA ============================== */
.rc-cta-wrap { padding-bottom: clamp(32px, 4vw, 56px); }
.rc-cta {
  display: grid; gap: 1.25rem; align-items: center; text-align: center;
  background: linear-gradient(120deg, #4C1D95, #5B21B6 55%, #6D28D9);
  background-size: cover; background-position: center;
  color: #fff; border-radius: 26px; padding: clamp(30px, 4.5vw, 54px);
  box-shadow: 0 24px 56px rgba(76,29,149,.3);
}
@media (min-width: 900px) { .rc-cta { grid-template-columns: 1.5fr auto; text-align: left; } }
.rc-cta h2 { color: #fff; margin-bottom: .4rem; }
.rc-cta p { color: #E4DBFF; margin: 0; font-size: .95rem; }
.rc-cta__actions { display: flex; gap: .7rem; flex-wrap: wrap; justify-content: center; }
.rc-cta__actions .rc-btn--primary { background: #fff; color: var(--rc-violet); }
.rc-cta__actions .rc-btn--ghost { background: rgba(255,255,255,.14); color: #fff; border-color: rgba(255,255,255,.4); }

/* ============================ FOOTER ============================ */
.rc-footer { background: var(--rc-ink); color: var(--rc-on-dark-soft); padding-block: 56px 26px; }
.rc-footer a { color: var(--rc-on-dark-soft); font-size: .88rem; }
.rc-footer a:hover { color: #fff; }
.rc-footer h4 { color: #fff; font-size: .78rem; text-transform: uppercase; letter-spacing: .09em; margin-bottom: .9rem; }
.rc-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.rc-footer__cols { display: grid; gap: 2rem; grid-template-columns: 1fr; }
@media (min-width: 700px) { .rc-footer__cols { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1040px) { .rc-footer__cols { grid-template-columns: 1.6fr repeat(4, 1fr) 1.1fr; gap: 1.5rem; } }
.rc-footer__brand .rc-logo { color: #fff; margin-bottom: .9rem; }
.rc-footer__brand p { font-size: .88rem; line-height: 1.6; margin-bottom: .7rem; }
.rc-footer__note { font-size: .78rem !important; color: var(--rc-on-dark-soft); }
.rc-footer__contact li { display: grid; gap: .1rem; }
.rc-footer__hint { font-size: .74rem; color: var(--rc-on-dark-soft); }
.rc-footer__bottom { border-top: 1px solid rgba(255,255,255,.1); margin-top: 2.5rem; padding-top: 1.25rem; font-size: .82rem; display: flex; flex-wrap: wrap; gap: .8rem 1.5rem; justify-content: space-between; }
.rc-footer__legal { display: flex; flex-wrap: wrap; gap: 1.2rem; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* =====================================================================
   INDUSTRY PAGE: DENTAL CLINICS  (page-clinici-dentare.php)
   =====================================================================
   This page inverts the homepage's palette: its hero and closing band are deep violet with
   light text, so every colour below is picked against those grounds rather than against
   white. Nothing here is allowed under 7:1.
   ===================================================================== */

.rc-den-i { width: 1.15em; height: 1.15em; flex: none; }

/* ---------------------------- hero ---------------------------- */
.rc-denhero {
  position: relative;
  /* Only the horizontal axis is clipped: the benefit strip is translated downward on
     purpose and Nova deliberately runs past the lower edge. */
  overflow-x: clip;
  padding-top: clamp(36px, 4.5vw, 64px);
  padding-bottom: 0;
  color: var(--rc-on-dark);
  background:
    radial-gradient(120% 85% at 78% 18%, rgba(167,139,250,.42) 0%, rgba(167,139,250,0) 58%),
    radial-gradient(90% 70% at 8% 92%, rgba(109,40,217,.5) 0%, rgba(109,40,217,0) 62%),
    linear-gradient(128deg, #190A44 0%, #33127C 46%, #4C1D95 100%);
}
/* Soft light streaks, the same motif as the section artwork, drawn rather than shipped. */
.rc-denhero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(60% 40% at 62% 100%, rgba(196,181,253,.28), transparent 70%),
    radial-gradient(40% 30% at 96% 40%, rgba(255,255,255,.18), transparent 70%);
}
.rc-denhero__inner { position: relative; z-index: 1; display: grid; gap: 1rem; align-items: center; }
@media (min-width: 992px) { .rc-denhero__inner { grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr); gap: 2rem; } }
.rc-denhero__copy { padding-bottom: clamp(24px, 3vw, 44px); min-width: 0; }
.rc-denhero h1 { color: #fff; margin-bottom: 1rem; }
.rc-denhero__accent { color: #C9B8FF; display: block; }
.rc-denhero__lead { font-size: 1.02rem; font-weight: 500; color: #E4DDF7; max-width: 54ch; margin-bottom: 1.5rem; }
.rc-denhero__actions { display: flex; flex-wrap: wrap; gap: .7rem; }
.rc-denhero__note { display: inline-flex; align-items: center; gap: .45rem; margin-top: 1.1rem; font-size: .84rem; font-weight: 500; color: #D6CCF2; }

.rc-btn--light { background: #fff; color: var(--rc-violet-text); box-shadow: 0 8px 24px rgba(10,4,30,.28); }
.rc-btn--outline { background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.55); }
.rc-btn--outline:hover { background: rgba(255,255,255,.16); }
.rc-eyebrow--on-dark { color: #C9B8FF; }

.rc-den-playdot { display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--rc-violet); color: #fff; flex: none; }
.rc-btn--light .rc-den-playdot { background: var(--rc-violet); color: #fff; }
.rc-den-playdot--lg { width: 2.4rem; height: 2.4rem; }
.rc-den-playdot .rc-den-i { width: .85em; height: .85em; }
.rc-den-playdot--lg .rc-den-i { width: 1em; height: 1em; }

/* Nova, bottom-anchored: the strip crops her cut edge exactly as on the homepage. */
.rc-denhero__art { position: relative; align-self: end; z-index: 1; margin-bottom: -130px; }
.rc-denhero__art img {
  margin-left: auto; margin-right: 0; display: block;
  max-height: clamp(400px, 44vw, 620px); height: auto; width: auto;
  filter: drop-shadow(0 26px 54px rgba(10,4,40,.5));
}

/* Floating cards over the artwork. Absolute so they never change the art's box. */
.rc-den-float {
  position: absolute; z-index: 2;
  background: rgba(255,255,255,.97); color: var(--rc-ink);
  border-radius: 14px; box-shadow: 0 14px 40px rgba(12,5,40,.28);
  backdrop-filter: blur(6px);
}
.rc-den-float--player { left: 0; top: 12%; display: flex; align-items: center; gap: .7rem; padding: .6rem .85rem; min-width: min(300px, 78%); }
.rc-den-float__body { display: grid; gap: .3rem; min-width: 0; flex: 1; }
.rc-den-float__body strong { font-size: .82rem; }
.rc-den-float__time { font-size: .78rem; font-weight: 600; color: var(--rc-muted); }
.rc-den-float--chip { display: inline-flex; align-items: center; gap: .45rem; padding: .5rem .8rem; font-size: .8rem; font-weight: 600; }
.rc-den-float--chip1 { right: 2%; top: 44%; }
.rc-den-float--chip2 { right: 8%; top: 56%; }
.rc-den-chipicon { display: inline-grid; place-items: center; width: 1.35rem; height: 1.35rem; border-radius: 50%; background: #EDE9FE; color: var(--rc-violet-text); }
.rc-den-chipicon--ok { background: #D8F5E5; color: #10633C; }

/* Benefit strip with arrows. `.rc-strip` scrolls itself on the homepage; here the inner
   track scrolls instead, so the arrows can sit outside the scrolling area. */
.rc-strip--arrows { overflow: visible; display: flex; align-items: stretch; gap: .3rem; padding: .5rem; }
.rc-strip__track {
  display: flex; flex: 1; min-width: 0; gap: 0;
  overflow-x: auto; scroll-snap-type: x proximity;
  scrollbar-width: none; -ms-overflow-style: none;
}
.rc-strip__track::-webkit-scrollbar { display: none; }
.rc-strip__item--icon { display: grid; justify-items: center; gap: .5rem; padding: .6rem 1rem; min-width: 148px; scroll-snap-align: center; }
.rc-strip__item--icon strong { font-size: .82rem; line-height: 1.3; text-align: center; color: var(--rc-ink); }
.rc-den-stripicon { display: grid; place-items: center; width: 2.35rem; height: 2.35rem; border-radius: 12px; background: #EDE9FE; color: var(--rc-violet-text); }
.rc-den-stripicon .rc-den-i { width: 1.2rem; height: 1.2rem; }
.rc-strip__nav { align-self: center; flex: none; }
.rc-strip.is-static .rc-strip__nav { display: none; }

/* ------------------------ reception cases ------------------------ */
.rc-den-cases { display: grid; gap: 1.1rem; margin-top: 2rem; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.rc-den-case { display: grid; gap: .5rem; align-content: start; }
.rc-den-case__media { border-radius: var(--rc-radius-sm); overflow: hidden; box-shadow: var(--rc-shadow); }
.rc-den-case__media img { width: 100%; height: 168px; object-fit: cover; display: block; }
.rc-den-case h3 { font-size: .98rem; margin: .4rem 0 0; }
.rc-den-case p { font-size: .84rem; font-weight: 500; color: var(--rc-muted); margin: 0; }
.rc-den-case__out { font-size: .8rem; color: var(--rc-violet-text); }
.rc-den-case__out strong { font-weight: 700; }

/* --------------------------- listen --------------------------- */
.rc-den-listen { display: grid; gap: 1rem; margin-top: 2rem; }
@media (min-width: 1040px) { .rc-den-listen { grid-template-columns: 210px minmax(0, 1fr); align-items: start; } }
.rc-den-listen__tabs { display: grid; gap: .4rem; align-content: start; }
@media (max-width: 1039px) { .rc-den-listen__tabs { grid-auto-flow: column; grid-auto-columns: max-content; overflow-x: auto; padding-bottom: .3rem; scrollbar-width: none; } .rc-den-listen__tabs::-webkit-scrollbar { display: none; } }
.rc-den-tab {
  display: flex; align-items: center; gap: .5rem; text-align: left;
  border: 1px solid var(--rc-line); background: #fff; border-radius: 999px;
  padding: .6rem .9rem; font: inherit; font-size: .83rem; font-weight: 600; color: var(--rc-ink);
  cursor: pointer; white-space: nowrap; transition: background .15s ease, border-color .15s ease;
}
.rc-den-tab:hover { border-color: var(--rc-purple-light); }
.rc-den-tab.is-active { background: var(--rc-violet); border-color: var(--rc-violet); color: #fff; }
.rc-den-tab__dot { width: .5rem; height: .5rem; border-radius: 50%; background: var(--rc-purple-light); flex: none; }
.rc-den-tab.is-active .rc-den-tab__dot { background: #fff; }

.rc-den-listen__panel { display: none; gap: 1rem; }
.rc-den-listen__panel.is-active { display: grid; }
@media (min-width: 1200px) { .rc-den-listen__panel.is-active { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); } }

.rc-den-callcard, .rc-den-transcript { background: #fff; border: 1px solid var(--rc-line); border-radius: var(--rc-radius); padding: 1.1rem; box-shadow: var(--rc-shadow); }
.rc-den-callcard__top { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.rc-den-badge { display: inline-flex; align-items: center; border-radius: 999px; padding: .24rem .6rem; font-size: .72rem; font-weight: 700; background: var(--rc-bg-soft); color: var(--rc-muted); }
.rc-den-badge--v { background: #EDE9FE; color: var(--rc-violet-text); }
.rc-den-callcard__time { margin-left: auto; font-size: .78rem; font-weight: 600; color: var(--rc-muted); }
.rc-den-callcard__player { display: flex; align-items: center; gap: .8rem; margin: .9rem 0 1rem; }
.rc-den-callcard__grid { display: grid; gap: .8rem; }
@media (min-width: 640px) { .rc-den-callcard__grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); } }
.rc-den-outcome { background: var(--rc-bg-soft); border-radius: var(--rc-radius-sm); padding: .85rem .95rem; }
.rc-den-outcome h4 { font-size: .82rem; margin: 0 0 .5rem; }
.rc-den-outcome dl { margin: 0; display: grid; gap: .32rem; }
.rc-den-outcome dl > div { display: flex; gap: .4rem; font-size: .79rem; }
.rc-den-outcome dt { font-weight: 600; color: var(--rc-muted); flex: none; }
.rc-den-outcome dd { margin: 0; font-weight: 600; color: var(--rc-ink); }
.rc-den-slot { display: grid; gap: .2rem; align-content: center; justify-items: start; background: #EDE9FE; border-radius: var(--rc-radius-sm); padding: .9rem; }
.rc-den-slot__icon { color: var(--rc-violet-text); }
.rc-den-slot__icon .rc-den-i { width: 1.4rem; height: 1.4rem; }
.rc-den-slot strong { font-size: .88rem; color: var(--rc-ink); }
.rc-den-slot span { font-size: .78rem; font-weight: 600; color: var(--rc-muted); }
.rc-den-slot em { font-size: .72rem; font-weight: 700; font-style: normal; color: var(--rc-violet-text); }

.rc-den-transcript h4 { font-size: .82rem; margin: 0 0 .7rem; }
.rc-den-transcript ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.rc-den-line { display: grid; gap: .1rem; font-size: .82rem; line-height: 1.5; }
.rc-den-line__who { font-weight: 700; font-size: .74rem; }
.rc-den-line--n .rc-den-line__who { color: var(--rc-violet-text); }
.rc-den-line--p .rc-den-line__who { color: var(--rc-muted); }
.rc-den-line__txt { font-weight: 500; color: var(--rc-body); }
.rc-wave--wide { flex: 1; }

/* ---------------------------- flow ---------------------------- */
.rc-den-flow { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.rc-den-step { position: relative; display: grid; gap: .35rem; align-content: start; background: #fff; border: 1px solid var(--rc-line); border-radius: var(--rc-radius-sm); padding: 1.1rem 1rem; box-shadow: var(--rc-shadow); }
.rc-den-step__num { display: grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: #EDE9FE; color: var(--rc-violet-text); font-size: .82rem; font-weight: 700; }
.rc-den-step strong { font-size: .9rem; }
.rc-den-step span { font-size: .8rem; font-weight: 500; color: var(--rc-muted); }
/* Dashed connector between steps, drawn only where two cards actually sit side by side. */
@media (min-width: 1040px) {
  .rc-den-step + .rc-den-step::before {
    content: ""; position: absolute; left: -1rem; top: 2rem; width: 1rem;
    border-top: 2px dashed var(--rc-purple-light);
  }
}

/* --------------------------- features --------------------------- */
.rc-den-feats { display: grid; gap: 1rem; margin-top: 2rem; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.rc-den-feat { display: grid; gap: .45rem; align-content: start; background: #fff; border: 1px solid var(--rc-line); border-radius: var(--rc-radius-sm); padding: 1.2rem 1.1rem; box-shadow: var(--rc-shadow); }
.rc-den-feat__icon { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 12px; background: #EDE9FE; color: var(--rc-violet-text); }
.rc-den-feat__icon .rc-den-i { width: 1.25rem; height: 1.25rem; }
.rc-den-feat h3 { font-size: .94rem; margin: .2rem 0 0; }
.rc-den-feat p { font-size: .81rem; font-weight: 500; color: var(--rc-muted); margin: 0; }
.rc-logos__glyph { display: grid; place-items: center; width: 28px; height: 28px; color: var(--rc-violet-text); }

/* ---------------------------- results ---------------------------- */
.rc-den-quotes { display: grid; gap: 1rem; margin-top: 2rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.rc-den-quote { display: grid; gap: .6rem; align-content: start; background: #fff; border: 1px solid var(--rc-line); border-radius: var(--rc-radius); padding: 1.2rem 1.1rem; box-shadow: var(--rc-shadow); }
.rc-den-quote__mark { display: grid; place-items: center; width: 2.3rem; height: 2.3rem; border-radius: 12px; background: #EDE9FE; color: var(--rc-violet-text); }
.rc-den-quote p { font-size: .85rem; font-weight: 500; color: var(--rc-body); margin: 0; }
.rc-den-quote footer { display: grid; gap: .1rem; }
.rc-den-quote footer strong { font-size: .82rem; }
.rc-den-quote footer em { font-size: .72rem; font-weight: 600; font-style: normal; color: var(--rc-muted); }

.rc-den-stats { display: grid; gap: 1rem; margin-top: 1.4rem; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); background: var(--rc-bg-soft); border-radius: var(--rc-radius); padding: 1.3rem 1rem; }
.rc-den-stat { display: grid; gap: .15rem; justify-items: center; text-align: center; }
.rc-den-stat strong { font-size: clamp(1.5rem, 3vw, 2rem); color: var(--rc-violet-text); line-height: 1.1; }
.rc-den-stat span { font-size: .8rem; font-weight: 600; color: var(--rc-muted); }
.rc-den-disclaimer { text-align: center; }

/* ---------------------- locations and roles ---------------------- */
.rc-den-two { display: grid; gap: 1.1rem; }
@media (min-width: 900px) { .rc-den-two { grid-template-columns: 1fr 1fr; } }
.rc-den-panel { background: #fff; border: 1px solid var(--rc-line); border-radius: var(--rc-radius); padding: 1.4rem; box-shadow: var(--rc-shadow); }
.rc-den-panel h3 { font-size: 1.05rem; margin-bottom: .35rem; }
.rc-den-panel > p { font-size: .85rem; font-weight: 500; color: var(--rc-muted); margin: 0 0 .9rem; }
.rc-den-ticks { list-style: none; margin: 0 0 1.1rem; padding: 0; display: grid; gap: .45rem; }
.rc-den-ticks li { display: flex; align-items: center; gap: .5rem; font-size: .84rem; font-weight: 600; color: var(--rc-body); }
.rc-den-ticks .rc-den-i { color: #10633C; width: 1.05rem; height: 1.05rem; }

.rc-den-map { position: relative; border-radius: var(--rc-radius-sm); overflow: hidden; height: 190px; }
.rc-den-map svg { width: 100%; height: 100%; display: block; }
.rc-den-map__chip { position: absolute; right: .7rem; bottom: .7rem; display: grid; gap: .05rem; background: #fff; border-radius: 10px; padding: .5rem .7rem; box-shadow: 0 8px 22px rgba(76,29,149,.18); }
.rc-den-map__chip strong { font-size: .84rem; }
.rc-den-map__chip span { font-size: .7rem; font-weight: 600; color: var(--rc-muted); }

.rc-den-roles { display: grid; gap: 1rem; }
@media (min-width: 560px) { .rc-den-roles { grid-template-columns: minmax(0, 1fr) 150px; align-items: start; } }
.rc-den-roles ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.rc-den-roles li { display: flex; gap: .6rem; align-items: center; }
.rc-den-role__icon { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border-radius: 10px; background: #EDE9FE; color: var(--rc-violet-text); flex: none; }
.rc-den-role__icon .rc-den-i { width: 1.05rem; height: 1.05rem; }
.rc-den-roles li strong { display: block; font-size: .85rem; }
.rc-den-roles li em { font-size: .75rem; font-weight: 500; font-style: normal; color: var(--rc-muted); }
.rc-den-roles__side { display: grid; gap: .5rem; }
.rc-den-roles__photo { border-radius: var(--rc-radius-sm); overflow: hidden; }
.rc-den-roles__photo img { width: 100%; height: 150px; object-fit: cover; object-position: center top; display: block; }
.rc-den-mini { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .4rem; background: var(--rc-bg-soft); border-radius: 10px; padding: .45rem .6rem; }
.rc-den-mini strong { font-size: .95rem; }
.rc-den-mini span { font-size: .68rem; font-weight: 600; color: var(--rc-muted); line-height: 1.2; }
.rc-den-mini em { font-size: .7rem; font-weight: 700; font-style: normal; }
.is-up { color: #10633C; }
.is-down { color: #A3122F; }
.rc-den-bars { display: flex; align-items: flex-end; gap: .22rem; height: 46px; padding: .35rem .5rem; background: var(--rc-bg-soft); border-radius: 10px; }
.rc-den-bars span { flex: 1; background: linear-gradient(180deg, var(--rc-purple-light), var(--rc-violet)); border-radius: 3px; }

/* --------------------------- dashboard --------------------------- */
.rc-den-dashwrap { padding-block: clamp(28px, 4vw, 52px); }
.rc-den-dash {
  display: grid; gap: 1.4rem; align-items: center;
  border-radius: 22px; padding: clamp(1.4rem, 3vw, 2.4rem);
  color: var(--rc-on-dark);
  background:
    radial-gradient(90% 80% at 88% 10%, rgba(139,92,246,.36) 0%, rgba(139,92,246,0) 62%),
    linear-gradient(135deg, #150A36 0%, #241154 58%, #2E1668 100%);
}
@media (min-width: 900px) { .rc-den-dash { grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); } }
.rc-den-dash h2 { color: #fff; margin: .6rem 0 .5rem; }
.rc-den-dash__copy > p { font-size: .92rem; font-weight: 500; color: #DCD4F3; margin: 0 0 1.2rem; max-width: 42ch; }
.rc-den-badge--soft { background: rgba(255,255,255,.14); color: #EFE9FF; }

.rc-den-ui { display: grid; grid-template-columns: 116px minmax(0, 1fr); gap: .6rem; background: rgba(9,4,26,.5); border: 1px solid rgba(196,181,253,.22); border-radius: 14px; padding: .6rem; font-size: .68rem; }
@media (max-width: 560px) { .rc-den-ui { grid-template-columns: minmax(0, 1fr); } .rc-den-ui__side { display: none; } }
.rc-den-ui__side { display: grid; gap: .18rem; align-content: start; background: rgba(255,255,255,.05); border-radius: 10px; padding: .5rem .45rem; }
.rc-den-ui__logo { display: flex; align-items: center; gap: .35rem; font-weight: 700; color: #fff; margin-bottom: .35rem; font-size: .72rem; }
.rc-den-ui__logo span { display: grid; place-items: center; width: 1.1rem; height: 1.1rem; border-radius: 6px; background: var(--rc-purple); color: #fff; font-size: .6rem; }
.rc-den-ui__nav { border-radius: 6px; padding: .26rem .4rem; color: #C6BEE2; }
.rc-den-ui__nav.is-on { background: rgba(139,92,246,.34); color: #fff; font-weight: 600; }
.rc-den-ui__main { display: grid; gap: .6rem; min-width: 0; }
.rc-den-ui__kpis { display: grid; gap: .45rem; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); }
.rc-den-ui__kpis > div { background: rgba(255,255,255,.06); border-radius: 10px; padding: .5rem .55rem; display: grid; gap: .1rem; }
.rc-den-ui__kpis span { color: #C6BEE2; font-size: .62rem; }
.rc-den-ui__kpis strong { color: #fff; font-size: .98rem; }
.rc-den-ui__kpis em { font-style: normal; font-weight: 700; font-size: .62rem; }
.rc-den-ui__kpis .is-up { color: #6EE7B7; }
.rc-den-ui__kpis .is-down { color: #FDA4AF; }
.rc-den-ui__row { display: grid; gap: .5rem; }
@media (min-width: 700px) { .rc-den-ui__row { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); } }
.rc-den-ui__card { background: rgba(255,255,255,.06); border-radius: 10px; padding: .55rem .6rem; display: grid; gap: .4rem; min-width: 0; }
.rc-den-ui__ttl { color: #DCD4F3; font-weight: 600; font-size: .64rem; }
.rc-den-ui__card svg { width: 100%; height: 74px; display: block; }
.rc-den-ui__donut { position: relative; display: grid; place-items: center; }
.rc-den-ui__donut svg { width: 86px; height: 86px; }
.rc-den-ui__donutmid { position: absolute; display: grid; justify-items: center; }
.rc-den-ui__donutmid strong { color: #fff; font-size: .74rem; }
.rc-den-ui__donutmid em { font-style: normal; color: #C6BEE2; font-size: .58rem; }
.rc-den-ui__legend { list-style: none; margin: 0; padding: 0; display: grid; gap: .16rem; }
.rc-den-ui__legend li { display: flex; align-items: center; gap: .3rem; color: #DCD4F3; font-size: .62rem; }
.rc-den-ui__legend i { width: .45rem; height: .45rem; border-radius: 2px; flex: none; }

/* ------------------------ comparison + FAQ ------------------------ */
.rc-den-why { display: grid; gap: 1.6rem; align-items: start; }
@media (min-width: 1040px) { .rc-den-why { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 2.2rem; } }
.rc-den-why h2 { font-size: clamp(1.3rem, 2.4vw, 1.7rem); margin-bottom: 1rem; }
/* Wide tables scroll inside their own box; the page itself must never scroll sideways. */
.rc-den-tablescroll { overflow-x: auto; border: 1px solid var(--rc-line); border-radius: var(--rc-radius-sm); }
.rc-den-table { width: 100%; border-collapse: collapse; font-size: .8rem; min-width: 520px; background: #fff; }
.rc-den-table th, .rc-den-table td { padding: .6rem .7rem; text-align: center; border-bottom: 1px solid var(--rc-line); }
.rc-den-table thead th { font-size: .74rem; color: var(--rc-muted); background: var(--rc-bg-soft); }
.rc-den-table thead th:nth-child(2) { color: var(--rc-violet-text); }
.rc-den-table tbody th { text-align: left; font-weight: 600; color: var(--rc-body); }
.rc-den-table tbody tr:last-child th, .rc-den-table tbody tr:last-child td { border-bottom: 0; }
.rc-den-table td.is-us { background: rgba(237,233,254,.6); }
.rc-den-yes, .rc-den-no { display: inline-grid; place-items: center; width: 1.4rem; height: 1.4rem; border-radius: 50%; }
.rc-den-yes { background: #D8F5E5; color: #10633C; }
.rc-den-no { background: #FBE0E5; color: #A3122F; }
.rc-den-part { font-size: .72rem; font-weight: 700; color: var(--rc-muted); }

.rc-den-q { border: 1px solid var(--rc-line); border-radius: var(--rc-radius-sm); padding: .8rem 1rem; margin-bottom: .55rem; background: #fff; }
.rc-den-q summary { display: flex; align-items: center; justify-content: space-between; gap: .8rem; cursor: pointer; font-size: .87rem; font-weight: 600; color: var(--rc-ink); list-style: none; }
.rc-den-q summary::-webkit-details-marker { display: none; }
.rc-den-q__mark { position: relative; width: .8rem; height: .8rem; flex: none; }
.rc-den-q__mark::before, .rc-den-q__mark::after { content: ""; position: absolute; background: var(--rc-violet-text); border-radius: 2px; transition: transform .18s ease; }
.rc-den-q__mark::before { left: 0; top: .33rem; width: .8rem; height: .14rem; }
.rc-den-q__mark::after { left: .33rem; top: 0; width: .14rem; height: .8rem; }
.rc-den-q[open] .rc-den-q__mark::after { transform: scaleY(0); }
.rc-den-q p { font-size: .82rem; font-weight: 500; color: var(--rc-muted); margin: .6rem 0 0; }
.rc-den-faq__more { display: inline-block; margin-top: .6rem; font-size: .84rem; font-weight: 700; color: var(--rc-violet-text); }

/* ----------------------------- CTA ----------------------------- */
.rc-den-ctawrap { padding-bottom: clamp(28px, 4vw, 52px); }
.rc-den-cta {
  position: relative; overflow: hidden;
  display: grid; gap: 1.2rem; align-items: center;
  border-radius: 22px; padding: clamp(1.4rem, 3vw, 2.2rem);
  color: var(--rc-on-dark);
  background:
    radial-gradient(80% 90% at 12% 100%, rgba(167,139,250,.42) 0%, rgba(167,139,250,0) 60%),
    linear-gradient(120deg, #2A1160 0%, #4C1D95 55%, #6D28D9 100%);
}
@media (min-width: 900px) { .rc-den-cta { grid-template-columns: 190px minmax(0, 1.1fr) minmax(0, .95fr); gap: 1.6rem; } }
/* Nova is cropped at the thigh in the source render, so her cut is landed on the band's
   bottom edge, where it reads as her continuing below rather than as a torn image. */
.rc-den-cta__art { align-self: end; margin-bottom: calc(-1 * clamp(1.4rem, 3vw, 2.2rem)); }
.rc-den-cta__art img { display: block; margin-inline: auto; max-height: 250px; height: auto; width: auto; }
@media (max-width: 899px) { .rc-den-cta__art { display: none; } }
.rc-den-cta h2 { color: #fff; font-size: clamp(1.3rem, 2.6vw, 1.85rem); margin-bottom: .4rem; }
.rc-den-cta__copy p { font-size: .89rem; font-weight: 500; color: #E4DDF7; margin: 0; }
.rc-den-cta__form { display: grid; gap: .55rem; justify-items: stretch; }
.rc-den-form { display: flex; align-items: center; gap: .4rem; background: #fff; border-radius: 999px; padding: .32rem .32rem .32rem 1rem; }
.rc-den-form input { flex: 1; min-width: 0; border: 0; outline: 0; font: inherit; font-size: .9rem; padding: .55rem .2rem; color: var(--rc-ink); background: transparent; }
.rc-den-or { text-align: center; font-size: .76rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #D6CCF2; }
.rc-den-cta__form .rc-btn { justify-content: center; }

/* ---- fixes after the first render pass ---- */

/* The strip hangs half its height below the hero, exactly as on the homepage, so the next
   section has to absorb the overhang. Without this the first heading sat ON the card. */
.rc-denhero + .rc-section { padding-top: clamp(88px, 10vw, 130px); }

/* Grid children default to min-width:auto, so the 520px-wide comparison table pushed the
   whole page 167px wider than the phone. The scroll container can only do its job once its
   grid cell is allowed to be narrower than its contents. */
.rc-den-why > * { min-width: 0; }
.rc-den-table-wrap { min-width: 0; }
@media (min-width: 900px) { .rc-den-two { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }

/* Inside the white pill a white button is invisible; the call to action has to be the violet. */
.rc-den-form .rc-btn { background: var(--rc-violet); color: #fff; box-shadow: none; }
.rc-den-form .rc-btn:hover { background: #5B21B6; }

/* Below this width the field and the button cannot share a row without one of them being
   squeezed under its own label, so the button drops to a full-width row of its own. */
@media (max-width: 560px) {
  .rc-den-form { flex-wrap: wrap; border-radius: 16px; padding: .5rem; gap: .5rem; }
  .rc-den-form input { flex: 1 0 100%; padding: .5rem .6rem; }
  .rc-den-form .rc-btn { flex: 1 0 100%; }
}

/* Cards in a row should end on the same line, so the quote takes the slack. */
.rc-den-quote { grid-template-rows: auto 1fr auto; }

/* Keep the floating player clear of Nova's face at every width. */
.rc-den-float--player { top: 5%; }
@media (max-width: 991px) { .rc-den-float--player { top: auto; bottom: 8%; left: 50%; transform: translateX(-50%); } }

/* On a phone the artwork is only ~400px tall and the benefit card already covers its lower
   130px, so the floating player had nowhere to sit that was not either over Nova's face or
   half under the card. It also duplicates the "Ascultă un apel" button directly above it,
   so on small screens it simply goes away. */
@media (max-width: 991px) { .rc-den-float--player { display: none; } }

/* A scroll container clips what it paints, but the table's 520px min-width still reached the
   root scroll box, so the page could be scrolled sideways by script even though no gesture
   did it and nothing was visually cut. `contain: paint` stops that width propagating.
   Note: overflow-x:clip on html/body does NOT fix this, it only masks it. */
.rc-den-tablescroll { contain: paint; }

/* The mock's logo chip was the one thing on the page under AA: white on #8B5CF6 is 4.23:1.
   The brand violet takes the same mark to about 7:1. */
.rc-den-ui__logo span { background: var(--rc-violet); }

/* Wide tables give no hint that more columns exist; a fade on the right edge does. */
.rc-den-table-wrap { position: relative; }
.rc-den-tablescroll::after { content: none; }
@media (max-width: 1039px) {
  .rc-den-table-wrap::after {
    content: ""; position: absolute; right: 0; top: 2.6rem; bottom: 0; width: 34px;
    pointer-events: none; border-radius: 0 var(--rc-radius-sm) var(--rc-radius-sm) 0;
    background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,.92));
  }
}

/* ================= landing engine: shared additions ================= */

/* Solution pages use an icon instead of a photo in the problem cards: four more stock photos
   per page would be four more downloads and would repeat across pages anyway. */
.rc-den-case__icon { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 14px; background: #EDE9FE; color: var(--rc-violet-text); }
.rc-den-case__icon .rc-den-i { width: 1.4rem; height: 1.4rem; }
.rc-den-case--icon { background: #fff; border: 1px solid var(--rc-line); border-radius: var(--rc-radius); padding: 1.2rem 1.1rem; box-shadow: var(--rc-shadow); }
.rc-den-case--icon h3 { margin-top: .55rem; }

/* Hub pages: shorter hero, since there is no artwork to balance a tall one. */
.rc-denhero--short { padding-bottom: clamp(30px, 4vw, 52px); }
.rc-denhero--short + .rc-section { padding-top: clamp(40px, 5vw, 72px); }
.rc-denhero__inner--solo { grid-template-columns: minmax(0, 1fr) !important; }
.rc-denhero__inner--solo .rc-denhero__copy { padding-bottom: 0; max-width: 46rem; }
.rc-denhero__accent--inline { display: inline; }

.rc-den-hub { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.rc-den-hubcard {
  display: grid; gap: .5rem; align-content: start;
  background: #fff; border: 1px solid var(--rc-line); border-radius: var(--rc-radius);
  padding: 1.3rem 1.2rem; box-shadow: var(--rc-shadow);
  color: var(--rc-ink); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.rc-den-hubcard:hover { text-decoration: none; transform: translateY(-2px); border-color: var(--rc-purple-light); box-shadow: 0 14px 34px rgba(109,40,217,.14); }
.rc-den-hubcard strong { font-size: 1rem; margin-top: .3rem; }
.rc-den-hubcard > span:not([class]) { font-size: .84rem; font-weight: 500; color: var(--rc-muted); }
.rc-den-hubcard__go { font-size: 1.1rem; font-weight: 700; color: var(--rc-violet-text); }
@media (min-width: 900px) {
  body.page-id-6 .rc-den-hub { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  body.page-id-6 .rc-den-hubcard { grid-column: span 2; }
  body.page-id-6 .rc-den-hubcard:nth-last-child(-n+2) { grid-column: span 3; }
}