@charset "UTF-8";
/* ═══════════════════════════════════════════════
   NIVELVA REACH — Email Blast / SMTP Marketing
   distinct layout, warm brand palette
   ═══════════════════════════════════════════════ */

.rcKick {
  display: inline-block;
  font-family: var(--mono); font-size: 11.5px; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 12px;
}

/* ── HERO ── */
.rcHero {
  position: relative;
  background: radial-gradient(ellipse 80% 60% at 50% -10%, #FFE9CF 0%, transparent 60%), linear-gradient(180deg, #FFFBF3 0%, #FFF4E2 100%);
  padding: 64px 0 80px;
  overflow: hidden;
  text-align: center;
}
.rcHero__noise {
  position: absolute; inset: 0; pointer-events: none; opacity: 0.5;
  background-image: radial-gradient(circle at 20% 30%, rgba(236,101,42,0.08) 0%, transparent 40%), radial-gradient(circle at 82% 18%, rgba(241,182,45,0.16) 0%, transparent 42%);
}
.rcHero__inner { position: relative; z-index: 1; max-width: 820px; }
.rcHero__pill {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--mono); font-size: 11.5px; font-weight: 700;
  letter-spacing: 0.06em;
  background: #fff; color: var(--ink-2);
  padding: 8px 16px; border-radius: 999px;
  border: 2px solid var(--ink);
  box-shadow: 3px 3px 0 var(--ink);
  margin-bottom: 24px;
}
.rcHero__pill i { width: 7px; height: 7px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,0.2); animation: rcPulse 1.6s ease-in-out infinite; }
@keyframes rcPulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }
.rcHero__t {
  font-family: var(--serif); font-weight: 700;
  font-size: clamp(36px, 6vw, 68px);
  line-height: 1.02; letter-spacing: -0.03em;
  margin: 0 0 20px; color: var(--ink);
}
.rcHero__hl {
  position: relative; color: var(--accent); font-style: italic;
  white-space: nowrap;
}
.rcHero__hl::after {
  content: ""; position: absolute; left: -2%; right: -2%; bottom: 4%;
  height: 28%; background: var(--accent-2); opacity: 0.32;
  border-radius: 4px; z-index: -1;
}
.rcHero__d {
  font-size: 17px; line-height: 1.65; color: var(--ink-2);
  max-width: 600px; margin: 0 auto 28px;
}
.rcHero__d b { color: var(--ink); font-weight: 800; }
.rcHero__cta { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-bottom: 44px; }
.rcHero__primary {
  background: var(--ink); color: #fff;
  font-family: var(--sans); font-weight: 800; font-size: 15.5px;
  padding: 16px 30px; border-radius: 999px; text-decoration: none;
  box-shadow: 5px 5px 0 var(--accent);
  transition: transform .15s, box-shadow .15s, background .15s;
}
.rcHero__primary:hover { background: var(--accent); transform: translate(-2px,-2px); box-shadow: 7px 7px 0 var(--ink); }
.rcHero__ghost {
  background: #fff; color: var(--ink);
  font-family: var(--sans); font-weight: 800; font-size: 15.5px;
  padding: 16px 28px; border-radius: 999px; text-decoration: none;
  border: 2px solid var(--ink);
  transition: transform .15s;
}
.rcHero__ghost:hover { transform: translateY(-2px); }

/* live counter */
.rcHero__counter {
  position: relative;
  display: inline-block;
  background: #0e1118; color: #fff;
  border: 2px solid var(--ink);
  border-radius: 20px;
  padding: 26px 48px 30px;
  box-shadow: 8px 8px 0 var(--ink);
  overflow: hidden;
}
.rcHero__counter__live {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--mono); font-size: 11px; font-weight: 800;
  letter-spacing: 0.1em; color: #ff6b6b; margin-bottom: 10px;
}
.rcHero__counter__live i { width: 7px; height: 7px; border-radius: 50%; background: #ff6b6b; animation: rcPulse 1.2s ease-in-out infinite; }
.rcHero__counter__num {
  font-family: var(--serif); font-weight: 800;
  font-size: clamp(40px, 7vw, 68px); line-height: 1;
  letter-spacing: -0.04em;
  background: linear-gradient(135deg, var(--accent-2), var(--accent));
  -webkit-background-clip: text; background-clip: text; color: transparent;
  font-variant-numeric: tabular-nums;
}
.rcHero__counter__lbl {
  font-family: var(--mono); font-size: 12px; color: rgba(255,255,255,0.6);
  letter-spacing: 0.04em; margin-top: 8px;
}
.rcHero__counter__track {
  display: flex; gap: 8px; justify-content: center; margin-top: 18px;
}
.rcHero__counter__env {
  width: 14px; height: 10px; border-radius: 2px;
  background: rgba(255,255,255,0.12);
  position: relative;
  animation: rcEnv 5s ease-in-out infinite;
}
.rcHero__counter__env::after {
  content: ""; position: absolute; inset: 0;
  border-top: 5px solid rgba(255,255,255,0.2);
  border-left: 7px solid transparent; border-right: 7px solid transparent;
}
@keyframes rcEnv {
  0%, 100% { background: rgba(255,255,255,0.12); transform: translateY(0); }
  50% { background: var(--accent); transform: translateY(-3px); }
}

/* ── LOGOS marquee ── */
.rcLogos { background: var(--ink); padding: 28px 0; overflow: hidden; }
.rcLogos__lbl { text-align: center; font-family: var(--sans); font-size: 13.5px; color: rgba(255,255,255,0.6); margin: 0 0 18px; }
.rcLogos__lbl b { color: #fff; font-weight: 800; }
.rcLogos__rail { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.rcLogos__track { display: flex; gap: 48px; width: max-content; animation: rcMarquee 28s linear infinite; }
@keyframes rcMarquee { to { transform: translateX(-50%); } }
.rcLogos__item {
  font-family: var(--serif); font-weight: 700; font-size: 22px;
  color: rgba(255,255,255,0.4); letter-spacing: -0.01em; white-space: nowrap;
  transition: color .2s;
}
.rcLogos__rail:hover .rcLogos__track { animation-play-state: paused; }

/* ── STEPS ── */
.rcSteps { background: #FFFBF3; padding: 80px 0; }
.rcSteps__head { text-align: center; max-width: 640px; margin: 0 auto 48px; }
.rcSteps__head h2 { font-family: var(--serif); font-weight: 700; font-size: clamp(28px, 3.6vw, 44px); letter-spacing: -0.025em; margin: 0; }
.rcSteps__head h2 em { font-style: italic; color: var(--accent); }
.rcSteps__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.rcStep {
  position: relative;
  background: #fff; border: 2px solid var(--ink); border-radius: 20px;
  padding: 28px 26px;
  box-shadow: 5px 5px 0 var(--ink);
  transition: transform .2s, box-shadow .2s;
}
.rcStep:hover { transform: translateY(-4px); box-shadow: 9px 9px 0 var(--c); }
.rcStep__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.rcStep__n {
  width: 52px; height: 52px; border-radius: 14px;
  background: var(--c); color: #fff;
  display: grid; place-items: center;
  font-family: var(--serif); font-weight: 800; font-size: 20px;
  border: 2px solid var(--ink); box-shadow: 3px 3px 0 var(--ink);
}
.rcStep__arrow { font-family: var(--serif); font-weight: 800; font-size: 26px; color: var(--ink-3); }
.rcStep h3 { font-family: var(--serif); font-weight: 700; font-size: 21px; letter-spacing: -0.015em; margin: 0 0 8px; }
.rcStep p { font-size: 14px; line-height: 1.6; color: var(--ink-2); margin: 0; }

/* ── FEATURES bento ── */
.rcFeat { background: linear-gradient(180deg, #FFFBF3 0%, #fff 100%); padding: 80px 0; }
.rcFeat__head { text-align: center; max-width: 680px; margin: 0 auto 44px; }
.rcFeat__head h2 { font-family: var(--serif); font-weight: 700; font-size: clamp(28px, 3.6vw, 44px); letter-spacing: -0.025em; line-height: 1.1; margin: 0 0 12px; }
.rcFeat__head h2 em { font-style: italic; color: var(--accent); }
.rcFeat__head p { font-size: 16px; line-height: 1.6; color: var(--ink-2); margin: 0; }
.rcFeat__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.rcFeatCard {
  background: #fff; border: 2px solid var(--ink); border-radius: 18px;
  padding: 26px 24px;
  box-shadow: 4px 4px 0 var(--ink);
  transition: transform .2s, box-shadow .2s;
}
.rcFeatCard:hover { transform: translateY(-3px); box-shadow: 8px 8px 0 var(--accent); }
.rcFeatCard.is-wide { grid-column: span 2; }
.rcFeatCard.is-dark { background: linear-gradient(135deg, #1a1426 0%, #2a1018 100%); color: #fff; }
.rcFeatCard.is-dark h3, .rcFeatCard.is-dark p { color: #fff; }
.rcFeatCard.is-dark p { color: rgba(255,255,255,0.72); }
.rcFeatCard__ic {
  display: inline-grid; place-items: center;
  width: 52px; height: 52px; border-radius: 14px;
  background: rgba(236,101,42,0.12); color: var(--accent);
  border: 2px solid var(--ink); box-shadow: 3px 3px 0 var(--ink);
  margin-bottom: 16px;
}
.rcFeatCard__ic svg { width: 26px; height: 26px; }
.rcFeatCard.is-dark .rcFeatCard__ic { background: linear-gradient(135deg, #c266ff, #7c3aed); color: #fff; }
.rcFeatCard h3 { font-family: var(--serif); font-weight: 700; font-size: 20px; letter-spacing: -0.015em; margin: 0 0 8px; color: var(--ink); }
.rcFeatCard p { font-size: 14px; line-height: 1.6; color: var(--ink-2); margin: 0; }

/* feature index list */
.rcFeat__list {
  max-width: 880px; margin: 0 auto;
  border: 2px solid var(--ink); border-radius: 20px;
  background: #fff; overflow: hidden;
  box-shadow: 8px 8px 0 var(--ink);
}
.rcFeatRow {
  display: grid; grid-template-columns: 56px 56px 1fr 24px;
  align-items: center; gap: 20px;
  padding: 22px 28px;
  border-bottom: 2px solid var(--ink);
  position: relative;
  transition: background .2s;
}
.rcFeatRow:last-child { border-bottom: none; }
.rcFeatRow::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0;
  background: linear-gradient(90deg, rgba(236,101,42,0.1), transparent);
  transition: width .25s; pointer-events: none;
}
.rcFeatRow:hover { background: rgba(255,250,240,0.6); }
.rcFeatRow:hover::before { width: 100%; }
.rcFeatRow__n {
  font-family: var(--serif); font-weight: 800; font-size: 26px;
  letter-spacing: -0.03em; color: rgba(236,101,42,0.3);
  position: relative; z-index: 1;
}
.rcFeatRow__ic {
  display: inline-grid; place-items: center;
  width: 52px; height: 52px; border-radius: 14px;
  background: rgba(236,101,42,0.1); color: var(--accent);
  border: 2px solid var(--ink); box-shadow: 3px 3px 0 var(--ink);
  position: relative; z-index: 1;
  transition: transform .2s, background .2s, color .2s;
}
.rcFeatRow__ic svg { width: 26px; height: 26px; }
.rcFeatRow:hover .rcFeatRow__ic { transform: rotate(-6deg) scale(1.05); background: var(--accent); color: #fff; }
.rcFeatRow__body { position: relative; z-index: 1; }
.rcFeatRow__body h3 { font-family: var(--serif); font-weight: 700; font-size: 20px; letter-spacing: -0.015em; margin: 0 0 4px; color: var(--ink); }
.rcFeatRow__body p { font-size: 14px; line-height: 1.55; color: var(--ink-2); margin: 0; }
.rcFeatRow__arrow {
  font-family: var(--serif); font-weight: 800; font-size: 22px;
  color: var(--ink-3); opacity: 0; transform: translateX(-6px);
  transition: opacity .2s, transform .2s; position: relative; z-index: 1;
}
.rcFeatRow:hover .rcFeatRow__arrow { opacity: 1; transform: translateX(0); color: var(--accent); }

/* ── DASHBOARD ── */
.rcDash { background: linear-gradient(180deg, #0d0f14 0%, #14100c 100%); padding: 84px 0; color: #fff; }
.rcDash__head { text-align: center; max-width: 680px; margin: 0 auto 40px; }
.rcDash__head h2 { font-family: var(--serif); font-weight: 700; font-size: clamp(28px, 3.6vw, 44px); letter-spacing: -0.025em; margin: 0 0 12px; color: #fff; }
.rcDash__head h2 em { font-style: italic; background: linear-gradient(90deg, var(--accent-2), var(--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rcDash__head p { font-size: 16px; line-height: 1.6; color: rgba(255,255,255,0.65); margin: 0; }
.rcDashApp {
  background: #15171e; border: 1.5px solid rgba(255,255,255,0.1); border-radius: 18px;
  overflow: hidden; box-shadow: 0 30px 60px rgba(0,0,0,0.4);
}
.rcDashApp__top { display: flex; align-items: center; justify-content: space-between; padding: 16px 22px; border-bottom: 1px solid rgba(255,255,255,0.08); flex-wrap: wrap; gap: 10px; }
.rcDashApp__brand { display: flex; align-items: center; gap: 10px; font-family: var(--serif); font-weight: 700; font-size: 15px; }
.rcDashApp__logo { width: 30px; height: 30px; border-radius: 8px; background: linear-gradient(135deg, var(--accent), #d54a18); display: grid; place-items: center; font-weight: 800; font-size: 15px; }
.rcDashApp__status { display: inline-flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 11.5px; font-weight: 700; color: var(--accent-2); }
.rcDashApp__status i { width: 7px; height: 7px; border-radius: 50%; background: var(--accent-2); animation: rcPulse 1.2s ease-in-out infinite; }
.rcDashApp__kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-bottom: 1px solid rgba(255,255,255,0.08); }
.rcKpi { padding: 18px 22px; border-right: 1px dashed rgba(255,255,255,0.1); }
.rcKpi:last-child { border-right: none; }
.rcKpi__k { display: block; font-family: var(--mono); font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(255,255,255,0.45); }
.rcKpi__v { display: block; font-family: var(--serif); font-weight: 800; font-size: 28px; letter-spacing: -0.025em; margin: 6px 0 4px; color: #fff; }
.rcKpi__v small { font-family: var(--mono); font-size: 13px; font-weight: 400; color: rgba(255,255,255,0.4); }
.rcKpi__up { font-family: var(--mono); font-style: normal; font-size: 11px; font-weight: 700; color: #4ade80; }
.rcKpi__mut { font-family: var(--mono); font-style: normal; font-size: 11px; color: rgba(255,255,255,0.4); }
.rcDashApp__cols { display: grid; grid-template-columns: 1.3fr 1fr; gap: 14px; padding: 18px 22px; }
.rcDashCard { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); border-radius: 14px; padding: 16px 18px; }
.rcDashCard__hd { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.rcDashCard__hd b { font-family: var(--serif); font-weight: 700; font-size: 14.5px; }
.rcDashCard__tag { font-family: var(--mono); font-size: 11px; font-weight: 700; color: #4ade80; padding: 3px 9px; border-radius: 999px; background: rgba(74,222,128,0.12); }
.rcDashChart { display: flex; align-items: flex-end; gap: 8px; height: 130px; }
.rcDashBar { flex: 1; background: linear-gradient(180deg, var(--accent-2), var(--accent)); border-radius: 5px 5px 0 0; min-height: 6px; transform-origin: bottom; animation: rcGrow .7s cubic-bezier(.3,.7,.4,1) both; }
@keyframes rcGrow { from { transform: scaleY(0); } to { transform: scaleY(1); } }
.rcDashChart__x { display: flex; gap: 8px; margin-top: 8px; }
.rcDashChart__x span { flex: 1; text-align: center; font-family: var(--mono); font-size: 11px; color: rgba(255,255,255,0.4); }
.rcSeg { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; align-items: center; margin-bottom: 10px; }
.rcSeg__n { font-family: var(--sans); font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.85); }
.rcSeg em { font-family: var(--mono); font-style: normal; font-size: 11px; font-weight: 700; color: var(--accent-2); }
.rcSeg__bar { grid-column: 1 / -1; height: 6px; background: rgba(255,255,255,0.08); border-radius: 3px; overflow: hidden; }
.rcSeg__bar span { display: block; height: 100%; background: linear-gradient(90deg, var(--accent), var(--accent-2)); border-radius: 3px; }

/* ── PRICING ── */
.rcPrice { background: #FFFBF3; padding: 80px 0; }
.rcPrice__head { text-align: center; max-width: 640px; margin: 0 auto 40px; }
.rcPrice__head h2 { font-family: var(--serif); font-weight: 700; font-size: clamp(28px, 3.6vw, 44px); letter-spacing: -0.025em; margin: 0 0 12px; }
.rcPrice__head h2 em { font-style: italic; color: var(--accent); }
.rcPrice__head p { font-size: 16px; line-height: 1.6; color: var(--ink-2); margin: 0; }
.rcPriceCard {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 0;
  background: #fff; border: 2px solid var(--ink); border-radius: 24px;
  overflow: hidden; box-shadow: 8px 8px 0 var(--ink);
  max-width: 940px; margin: 0 auto;
}
.rcPriceCard__l { padding: 36px 40px; border-right: 2px solid var(--ink); }
.rcPriceCard__plan { display: inline-block; font-family: var(--mono); font-size: 11px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--accent); padding: 5px 12px; border-radius: 999px; background: rgba(236,101,42,0.1); margin-bottom: 16px; }
.rcPriceCard__amt { display: flex; align-items: baseline; gap: 4px; font-family: var(--serif); color: var(--ink); }
.rcPriceCard__amt span { font-size: 22px; font-weight: 700; }
.rcPriceCard__amt b { font-size: 56px; font-weight: 800; letter-spacing: -0.03em; line-height: 1; }
.rcPriceCard__amt em { font-family: var(--mono); font-style: normal; font-size: 14px; color: var(--ink-3); }
.rcPriceCard__vol { font-family: var(--mono); font-size: 13px; font-weight: 700; color: var(--ink-2); margin: 8px 0 24px; }
.rcSlider { -webkit-appearance: none; appearance: none; width: 100%; height: 8px; border-radius: 4px; background: linear-gradient(90deg, var(--accent) 0%, var(--accent-2) 100%); outline: none; margin-bottom: 14px; }
.rcSlider::-webkit-slider-thumb { -webkit-appearance: none; width: 26px; height: 26px; border-radius: 50%; background: #fff; border: 3px solid var(--ink); box-shadow: 2px 2px 0 var(--ink); cursor: pointer; }
.rcSlider::-moz-range-thumb { width: 26px; height: 26px; border-radius: 50%; background: #fff; border: 3px solid var(--ink); cursor: pointer; }
.rcSlider__ticks { display: flex; justify-content: space-between; gap: 4px; margin-bottom: 24px; flex-wrap: wrap; }
.rcSlider__tick { font-family: var(--mono); font-size: 11px; font-weight: 700; color: var(--ink-3); background: none; border: none; cursor: pointer; padding: 2px 4px; transition: color .15s; }
.rcSlider__tick.is-on { color: var(--accent); font-weight: 800; }
.rcPriceCard__cta { display: inline-block; background: var(--ink); color: #fff; font-family: var(--sans); font-weight: 800; font-size: 15px; padding: 14px 28px; border-radius: 999px; text-decoration: none; transition: background .15s; }
.rcPriceCard__cta:hover { background: var(--accent); }
.rcPriceCard__r { padding: 36px 36px; background: #fffaf0; }
.rcPriceCard__incl { display: block; font-family: var(--mono); font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 16px; }
.rcPriceCard__feats { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.rcPriceCard__feats li { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.45; color: var(--ink); }
.rcPriceCard__feats span { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: #16a34a; color: #fff; font-size: 11px; font-weight: 800; flex-shrink: 0; margin-top: 1px; }

/* ── FAQ split ── */
.rcFaq { background: linear-gradient(180deg, #fff 0%, #FFFBF3 100%); padding: 72px 0 80px; }
.rcFaq__head { text-align: center; margin-bottom: 36px; }
.rcFaq__head h2 { font-family: var(--serif); font-weight: 700; font-size: clamp(26px, 3.2vw, 40px); letter-spacing: -0.025em; margin: 0; }
.rcFaq__head h2 em { font-style: italic; color: var(--accent); }
.rcFaq__split { display: grid; grid-template-columns: 360px 1fr; gap: 20px; align-items: stretch; }
.rcFaq__list { background: #fff; border: 2px solid var(--ink); border-radius: 22px; padding: 18px 14px; box-shadow: 6px 6px 0 var(--ink); display: flex; flex-direction: column; }
.rcFaq__list__hd { display: flex; align-items: baseline; justify-content: space-between; padding: 6px 12px 12px; border-bottom: 1.5px dashed rgba(0,0,0,0.12); }
.rcFaq__list__hd span { font-family: var(--serif); font-weight: 700; font-size: 20px; color: var(--ink); }
.rcFaq__list__hd em { font-family: var(--mono); font-style: normal; font-size: 11px; font-weight: 700; color: var(--ink-3); }
.rcFaq__items { list-style: none; padding: 0; margin: 6px 0 0; display: flex; flex-direction: column; gap: 2px; }
.rcFaqRow { width: 100%; display: grid; grid-template-columns: 26px 1fr 16px; gap: 10px; align-items: center; padding: 13px 10px; background: transparent; border: none; border-radius: 10px; text-align: left; cursor: pointer; font-family: inherit; transition: background .18s; }
.rcFaqRow:hover { background: rgba(236,101,42,0.06); }
.rcFaqRow__n { font-family: var(--mono); font-size: 12.5px; font-weight: 800; color: var(--ink-3); }
.rcFaqRow__q { font-family: var(--sans); font-weight: 600; font-size: 14px; line-height: 1.4; color: var(--ink-2); }
.rcFaqRow__arrow { opacity: 0; font-size: 15px; font-weight: 800; color: var(--accent); transition: opacity .18s, transform .18s; }
.rcFaqRow.is-on { background: linear-gradient(135deg, rgba(236,101,42,0.14), rgba(241,182,45,0.12)); }
.rcFaqRow.is-on .rcFaqRow__n { color: var(--accent); }
.rcFaqRow.is-on .rcFaqRow__q { color: var(--ink); font-weight: 700; }
.rcFaqRow.is-on .rcFaqRow__arrow { opacity: 1; transform: translateX(2px); }
.rcFaq__panel { background: linear-gradient(135deg, #fff 0%, #fffaf0 100%); border: 2px solid var(--ink); border-radius: 22px; padding: 32px 36px; box-shadow: 6px 6px 0 var(--ink); position: relative; overflow: hidden; display: flex; flex-direction: column; animation: rcFaqFade .25s ease; }
@keyframes rcFaqFade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.rcFaq__panel::before { content: ""; position: absolute; top: -60px; right: -60px; width: 200px; height: 200px; background: radial-gradient(circle, rgba(241,182,45,0.25) 0%, transparent 65%); pointer-events: none; }
.rcFaq__panel__n { font-family: var(--serif); font-weight: 800; font-size: 56px; line-height: 1; letter-spacing: -0.04em; color: rgba(236,101,42,0.18); margin-bottom: 6px; }
.rcFaq__panel__q { font-family: var(--serif); font-weight: 700; font-size: clamp(20px, 2.4vw, 28px); line-height: 1.2; letter-spacing: -0.015em; margin: 0 0 14px; color: var(--ink); }
.rcFaq__panel__sep { width: 48px; height: 4px; background: linear-gradient(90deg, var(--accent), var(--accent-2)); border-radius: 4px; margin-bottom: 16px; }
.rcFaq__panel__a { font-size: 15.5px; line-height: 1.7; color: var(--ink-2); margin: 0; }
.rcFaq__panel__nav { display: flex; gap: 10px; margin-top: auto; padding-top: 24px; }
.rcFaq__panel__btn { flex: 1; padding: 11px 16px; background: transparent; border: 1.5px solid rgba(0,0,0,0.15); border-radius: 999px; font-family: var(--sans); font-weight: 700; font-size: 13px; color: var(--ink-2); cursor: pointer; transition: all .15s; }
.rcFaq__panel__btn:hover { background: var(--accent); color: #fff; border-color: var(--accent); }

/* ── CTA banner ── */
.rcCta { background: var(--ink); padding: 80px 0; }
.rcCta__inner { text-align: center; max-width: 640px; }
.rcCta h2 { font-family: var(--serif); font-weight: 700; font-size: clamp(28px, 3.8vw, 46px); letter-spacing: -0.025em; line-height: 1.1; margin: 0 0 14px; color: #fff; }
.rcCta h2 em { font-style: italic; background: linear-gradient(90deg, var(--accent-2), var(--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rcCta p { font-size: 16px; line-height: 1.6; color: rgba(255,255,255,0.7); margin: 0 0 28px; }
.rcCta__btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.rcCta__primary { background: var(--accent-2); color: var(--ink); font-family: var(--sans); font-weight: 800; font-size: 15.5px; padding: 16px 32px; border-radius: 999px; text-decoration: none; box-shadow: 5px 5px 0 var(--accent); transition: transform .15s; }
.rcCta__primary:hover { transform: translate(-2px,-2px); box-shadow: 7px 7px 0 rgba(255,255,255,0.3); }
.rcCta__ghost { background: transparent; color: #fff; font-family: var(--sans); font-weight: 800; font-size: 15.5px; padding: 16px 30px; border-radius: 999px; text-decoration: none; border: 2px solid rgba(255,255,255,0.3); transition: border-color .15s; }
.rcCta__ghost:hover { border-color: #fff; }

/* ═══ RESPONSIVE ═══ */
@media (max-width: 920px) {
  .rcSteps__grid { grid-template-columns: 1fr; }
  .rcStep__arrow { display: none; }
  .rcFeat__grid { grid-template-columns: 1fr 1fr; }
  .rcFeatCard.is-wide { grid-column: span 2; }
  .rcFeatRow { grid-template-columns: 40px 48px 1fr; gap: 14px; padding: 18px 20px; }
  .rcFeatRow__arrow { display: none; }
  .rcDashApp__cols { grid-template-columns: 1fr; }
  .rcPriceCard { grid-template-columns: 1fr; }
  .rcPriceCard__l { border-right: none; border-bottom: 2px solid var(--ink); }
  .rcFaq__split { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .rcHero { padding: 44px 0 56px; }
  .rcHero__counter { padding: 22px 28px 26px; box-shadow: 5px 5px 0 var(--ink); }
  .rcHero__primary, .rcHero__ghost { width: 100%; text-align: center; }
  .rcHero__counter__track { flex-wrap: wrap; }
  .rcLogos__item { font-size: 18px; }
  .rcSteps, .rcFeat, .rcDash, .rcPrice, .rcFaq, .rcCta { padding: 56px 0; }
  .rcFeat__grid { grid-template-columns: 1fr; }
  .rcFeatCard.is-wide { grid-column: span 1; }
  .rcFeatRow__n { font-size: 20px; }
  .rcFeatRow__ic { width: 44px; height: 44px; }
  .rcDashApp__kpis { grid-template-columns: 1fr 1fr; }
  .rcKpi:nth-child(2) { border-right: none; }
  .rcKpi:nth-child(1), .rcKpi:nth-child(2) { border-bottom: 1px dashed rgba(255,255,255,0.1); }
  .rcPriceCard__l, .rcPriceCard__r { padding: 28px 24px; }
  .rcPriceCard__amt b { font-size: 44px; }
  .rcFaq__list, .rcFaq__panel { box-shadow: 4px 4px 0 var(--ink); }
  .rcFaq__panel { padding: 26px 22px; }
  .rcFaq__panel__n { font-size: 44px; }
}


/* ── FEATURE EXPLORER (rcFx) ── */
.rcFx { display: grid; grid-template-columns: 360px 1fr; gap: 18px; align-items: stretch; max-width: 1040px; margin: 0 auto; }
.rcFx__tabs { display: flex; flex-direction: column; gap: 8px; }
.rcFxTab {
  display: grid; grid-template-columns: 38px 1fr 18px; align-items: center; gap: 12px;
  padding: 16px 18px; background: #fff; border: 2px solid var(--ink); border-radius: 14px;
  font-family: inherit; cursor: pointer; text-align: left;
  box-shadow: 3px 3px 0 transparent; transition: all .18s;
}
.rcFxTab:hover { transform: translateX(3px); box-shadow: 3px 3px 0 var(--ink); }
.rcFxTab.is-on { background: var(--ink); box-shadow: 4px 4px 0 var(--accent); }
.rcFxTab__n { font-family: var(--mono); font-weight: 800; font-size: 13px; color: var(--accent); }
.rcFxTab.is-on .rcFxTab__n { color: var(--accent-2); }
.rcFxTab__t { font-family: var(--serif); font-weight: 700; font-size: 16px; letter-spacing: -0.01em; color: var(--ink); }
.rcFxTab.is-on .rcFxTab__t { color: #fff; }
.rcFxTab__chev { font-family: var(--serif); font-weight: 800; color: var(--ink-3); opacity: 0; transition: opacity .18s; }
.rcFxTab.is-on .rcFxTab__chev { opacity: 1; color: var(--accent-2); }

.rcFx__stage {
  display: flex; flex-direction: column;
  background: linear-gradient(160deg, #fff 0%, #fffaf0 100%);
  border: 2px solid var(--ink); border-radius: 20px;
  padding: 32px 36px; box-shadow: 8px 8px 0 var(--ink);
  animation: rcFxFade .3s ease; overflow: hidden; position: relative;
}
@keyframes rcFxFade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.rcFx__tag { display: inline-block; align-self: flex-start; font-family: var(--mono); font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; background: rgba(236,101,42,0.12); color: var(--accent); margin-bottom: 14px; }
.rcFx__stageHd h3 { font-family: var(--serif); font-weight: 700; font-size: clamp(22px, 2.6vw, 30px); letter-spacing: -0.02em; margin: 0 0 10px; color: var(--ink); }
.rcFx__stageHd p { font-size: 15px; line-height: 1.65; color: var(--ink-2); margin: 0 0 24px; }
.rcFx__viz { flex: 1; min-height: 200px; display: flex; align-items: center; justify-content: center; background: #faf6ee; border: 1.5px dashed rgba(0,0,0,0.12); border-radius: 14px; padding: 24px; }

/* viz: blast */
.rcVizBlast { display: flex; align-items: center; gap: 16px; position: relative; }
.rcVizBlast__src { width: 56px; height: 56px; border-radius: 14px; background: var(--accent); color: #fff; display: grid; place-items: center; font-size: 26px; box-shadow: 3px 3px 0 var(--ink); }
.rcVizBlast__rays { display: flex; flex-direction: column; gap: 5px; }
.rcVizBlast__rays span { width: 34px; height: 3px; border-radius: 2px; background: var(--accent); opacity: 0.3; animation: rcRay 1.4s ease-in-out infinite; }
@keyframes rcRay { 0%,100% { opacity: 0.2; transform: scaleX(0.6); } 50% { opacity: 1; transform: scaleX(1); } }
.rcVizBlast__inboxes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.rcVizBlast__inbox { font-size: 24px; animation: rcPop .6s ease both; }
@keyframes rcPop { from { transform: scale(0); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.rcVizBlast__count { position: absolute; bottom: -14px; right: 0; font-family: var(--mono); font-size: 11px; font-weight: 800; color: var(--accent); }

/* viz: AI */
.rcVizAI { width: 100%; max-width: 380px; }
.rcVizAI__prompt { font-family: var(--mono); font-size: 12.5px; color: var(--ink-2); background: #fff; border: 1.5px solid var(--ink); border-radius: 10px; padding: 11px 14px; margin-bottom: 16px; }
.rcVizAI__gen { display: flex; flex-direction: column; gap: 9px; }
.rcVizAI__line { height: 10px; border-radius: 5px; background: rgba(0,0,0,0.1); animation: rcType .8s ease both; transform-origin: left; }
.rcVizAI__line--accent { background: var(--accent); }
@keyframes rcType { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.rcVizAI__badge { display: inline-block; margin-top: 16px; font-family: var(--mono); font-size: 11px; font-weight: 800; color: #fff; background: linear-gradient(135deg, #c266ff, #7c3aed); padding: 6px 14px; border-radius: 999px; }

/* viz: flow */
.rcVizFlow { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.rcVizFlow__node { font-family: var(--sans); font-weight: 700; font-size: 13px; color: var(--ink); background: #fff; border: 2px solid var(--ink); border-radius: 10px; padding: 9px 18px; box-shadow: 2px 2px 0 var(--ink); }
.rcVizFlow__node--start { background: var(--accent-2); }
.rcVizFlow__node--end { background: var(--accent); color: #fff; }
.rcVizFlow__arr { font-family: var(--mono); font-size: 11px; color: var(--ink-3); }

/* viz: reply */
.rcVizReply { width: 100%; max-width: 340px; display: flex; flex-direction: column; gap: 12px; }
.rcVizReply__in { background: #fff; border: 1.5px solid var(--ink); border-radius: 10px; padding: 12px 14px; }
.rcVizReply__in b { display: block; font-family: var(--sans); font-size: 13px; }
.rcVizReply__in span { font-family: var(--mono); font-size: 11px; color: var(--ink-3); }
.rcVizReply__trigger { align-self: center; font-family: var(--mono); font-size: 11px; font-weight: 800; color: var(--accent); }
.rcVizReply__out { display: flex; align-items: center; gap: 8px; background: var(--ink); color: #fff; border-radius: 10px; padding: 12px 14px; font-family: var(--sans); font-size: 12.5px; font-weight: 600; }
.rcVizReply__dot { width: 8px; height: 8px; border-radius: 50%; background: #4ade80; }

/* viz: smtp */
.rcVizSmtp { width: 100%; max-width: 320px; display: flex; flex-direction: column; gap: 9px; }
.rcVizSmtp__check { display: flex; align-items: center; gap: 10px; font-family: var(--sans); font-weight: 700; font-size: 13.5px; color: var(--ink); }
.rcVizSmtp__check span { width: 22px; height: 22px; border-radius: 50%; background: #16a34a; color: #fff; display: grid; place-items: center; font-size: 12px; font-weight: 800; }
.rcVizSmtp__gauge { position: relative; height: 28px; background: rgba(0,0,0,0.08); border-radius: 999px; overflow: hidden; margin-top: 8px; }
.rcVizSmtp__gaugeFill { height: 100%; background: linear-gradient(90deg, var(--accent), var(--accent-2)); border-radius: 999px; animation: rcGauge 1s ease both; transform-origin: left; }
@keyframes rcGauge { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.rcVizSmtp__gaugeLbl { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--mono); font-size: 11px; font-weight: 800; color: #fff; }

/* viz: chart */
.rcVizChart { display: flex; align-items: flex-end; gap: 10px; height: 150px; position: relative; }
.rcVizChart__bar { width: 30px; background: linear-gradient(180deg, var(--accent-2), var(--accent)); border-radius: 5px 5px 0 0; animation: rcGrow .6s cubic-bezier(.3,.7,.4,1) both; transform-origin: bottom; }
@keyframes rcGrow { from { transform: scaleY(0); } to { transform: scaleY(1); } }
.rcVizChart__tip { position: absolute; top: -6px; right: -8px; font-family: var(--mono); font-size: 11px; font-weight: 800; color: var(--accent); background: #fff; border: 1.5px solid var(--ink); border-radius: 8px; padding: 4px 9px; }

@media (max-width: 860px) {
  .rcFx { grid-template-columns: 1fr; }
  .rcFx__tabs { flex-direction: row; overflow-x: auto; padding-bottom: 4px; }
  .rcFxTab { grid-template-columns: auto 1fr; min-width: 200px; }
  .rcFxTab__chev { display: none; }
}
@media (max-width: 640px) {
  .rcFx__stage { padding: 24px 22px; box-shadow: 4px 4px 0 var(--ink); }
  .rcFxTab { min-width: 170px; padding: 12px 14px; }
}


/* ── BRING IN CONTACTS (luxury dark) ── */
.rcCon { background: linear-gradient(180deg, #120d1c 0%, #1a0f1a 55%, #1f1010 100%); padding: 84px 0; position: relative; overflow: hidden; }
.rcCon::before { content: ""; position: absolute; top: -120px; left: 50%; transform: translateX(-50%); width: 700px; height: 360px; background: radial-gradient(ellipse, rgba(236,101,42,0.18) 0%, transparent 65%); pointer-events: none; }
.rcCon__head { text-align: center; max-width: 680px; margin: 0 auto 44px; position: relative; z-index: 1; }
.rcCon__head .rcKick { color: var(--accent-2); }
.rcCon__head h2 { font-family: var(--serif); font-weight: 700; font-size: clamp(28px, 3.6vw, 44px); letter-spacing: -0.025em; line-height: 1.1; margin: 0 0 12px; color: #fff; }
.rcCon__head h2 em { font-style: italic; background: linear-gradient(90deg, var(--accent-2), var(--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rcCon__head p { font-size: 16px; line-height: 1.6; color: rgba(255,255,255,0.65); margin: 0; }

.rcCon__big { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; position: relative; z-index: 1; }
.rcConCard {
  background: linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%);
  border: 1.5px solid rgba(255,255,255,0.12); border-radius: 22px;
  padding: 32px 34px; position: relative; overflow: hidden;
  transition: border-color .2s, transform .2s;
}
.rcConCard:hover { border-color: rgba(241,182,45,0.4); transform: translateY(-3px); }
.rcConCard::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 50%; background: radial-gradient(ellipse at 50% 120%, rgba(236,101,42,0.18) 0%, transparent 70%); pointer-events: none; }
.rcConCard__pill { display: inline-block; font-family: var(--mono); font-size: 11px; font-weight: 800; letter-spacing: 0.06em; padding: 6px 13px; border-radius: 999px; background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.85); border: 1px solid rgba(255,255,255,0.14); margin-bottom: 18px; }
.rcConCard h3 { font-family: var(--serif); font-weight: 700; font-size: clamp(22px, 2.4vw, 30px); letter-spacing: -0.02em; margin: 0 0 10px; color: #fff; }
.rcConCard p { font-size: 15px; line-height: 1.6; color: rgba(255,255,255,0.62); margin: 0 0 28px; max-width: 420px; }

/* integration hub */
.rcConHub { position: relative; height: 200px; }
.rcConHub__lines { position: absolute; inset: 0; width: 100%; height: 100%; stroke: rgba(255,255,255,0.18); stroke-width: 1.5; fill: none; }
.rcConHub__core { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 64px; height: 64px; border-radius: 18px; background: linear-gradient(135deg, var(--accent), #d54a18); display: grid; place-items: center; color: #fff; z-index: 2; box-shadow: 0 0 0 8px rgba(236,101,42,0.15), 0 8px 24px rgba(236,101,42,0.4); }
.rcConHub__node { position: absolute; width: 52px; height: 52px; border-radius: 14px; background: rgba(255,255,255,0.08); border: 1.5px solid rgba(255,255,255,0.16); display: grid; place-items: center; font-family: var(--serif); font-weight: 800; font-size: 13px; color: #fff; z-index: 1; }
.rcConHub__node--a { top: 14%; left: 12%; }
.rcConHub__node--b { top: 14%; right: 12%; }
.rcConHub__node--c { bottom: 14%; left: 12%; }
.rcConHub__node--d { bottom: 14%; right: 12%; }

/* subscribe form */
.rcConForm { margin-top: 4px; }
.rcConForm__row { display: flex; gap: 8px; background: rgba(255,255,255,0.06); border: 1.5px solid rgba(255,255,255,0.16); border-radius: 14px; padding: 8px; }
.rcConForm__input { flex: 1; display: flex; align-items: center; padding: 0 14px; font-family: var(--sans); font-size: 14px; color: rgba(255,255,255,0.5); }
.rcConForm__btn { background: linear-gradient(135deg, var(--accent), #d54a18); color: #fff; font-family: var(--sans); font-weight: 800; font-size: 14px; padding: 13px 22px; border-radius: 10px; white-space: nowrap; }
.rcConForm__proof { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
.rcConForm__avs { display: flex; }
.rcConForm__avs i { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-family: var(--serif); font-weight: 800; font-size: 13px; color: #fff; border: 2px solid #1a0f1a; margin-left: -8px; }
.rcConForm__avs i:first-child { margin-left: 0; background: #EC652A; }
.rcConForm__avs i:nth-child(2) { background: #7c3aed; }
.rcConForm__avs i:nth-child(3) { background: #16a34a; }
.rcConForm__txt { font-family: var(--sans); font-size: 13px; color: rgba(255,255,255,0.6); }
.rcConForm__txt b { color: #fff; font-weight: 800; }

.rcCon__divider { display: flex; align-items: center; gap: 20px; margin: 40px 0 24px; position: relative; z-index: 1; }
.rcCon__divider::before, .rcCon__divider::after { content: ""; flex: 1; height: 1px; background: rgba(255,255,255,0.14); }
.rcCon__divider span { font-family: var(--mono); font-size: 12.5px; font-weight: 700; letter-spacing: 0.04em; color: rgba(255,255,255,0.55); }

.rcCon__small { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; position: relative; z-index: 1; }
.rcConMini { display: flex; gap: 16px; align-items: flex-start; background: rgba(255,255,255,0.04); border: 1.5px solid rgba(255,255,255,0.1); border-radius: 18px; padding: 24px 26px; transition: border-color .2s, transform .2s; }
.rcConMini:hover { border-color: rgba(241,182,45,0.4); transform: translateY(-2px); }
.rcConMini__ic { width: 48px; height: 56px; border-radius: 8px; display: grid; place-items: center; font-family: var(--mono); font-weight: 800; font-size: 13px; color: #fff; flex-shrink: 0; }
.rcConMini__ic--csv { background: linear-gradient(160deg, #1e9e54, #0f7a3d); }
.rcConMini__ic--api { background: linear-gradient(160deg, #5b8df0, #3a5fd0); font-size: 15px; }
.rcConMini h4 { font-family: var(--serif); font-weight: 700; font-size: 19px; letter-spacing: -0.015em; margin: 4px 0 7px; color: #fff; }
.rcConMini p { font-size: 13.5px; line-height: 1.55; color: rgba(255,255,255,0.6); margin: 0; }

@media (max-width: 860px) {
  .rcCon__big, .rcCon__small { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .rcCon { padding: 56px 0; }
  .rcConCard { padding: 26px 24px; }
  .rcConForm__btn { padding: 12px 16px; font-size: 13px; }
}


/* ── TEMPLATES + BUILDER ── */
.rcTpl { background: #FFFBF3; padding: 80px 0; }
.rcTpl__head { text-align: center; max-width: 700px; margin: 0 auto 40px; }
.rcTpl__head h2 { font-family: var(--serif); font-weight: 700; font-size: clamp(28px, 3.6vw, 44px); letter-spacing: -0.025em; line-height: 1.1; margin: 0 0 12px; }
.rcTpl__head h2 em { font-style: italic; color: var(--accent); }
.rcTpl__head p { font-size: 16px; line-height: 1.6; color: var(--ink-2); margin: 0; }

.rcTpl__gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 24px; }
.rcTplCard { background: #fff; border: 2px solid var(--ink); border-radius: 16px; padding: 14px; cursor: pointer; font-family: inherit; text-align: left; box-shadow: 4px 4px 0 transparent; transition: all .2s; }
.rcTplCard:hover { transform: translateY(-4px); box-shadow: 6px 6px 0 var(--ink); }
.rcTplCard.is-on { box-shadow: 6px 6px 0 var(--ac); border-color: var(--ink); }
.rcTplCard__preview { background: #faf7f0; border: 1px solid rgba(0,0,0,0.08); border-radius: 10px; padding: 12px; height: 190px; overflow: hidden; display: flex; flex-direction: column; gap: 7px; position: relative; }
.rcTplCard__bar { position: absolute; top: 0; left: 0; right: 0; height: 5px; }
.rcTplB { display: block; border-radius: 4px; background: rgba(0,0,0,0.07); }
.rcTplB--text { height: 12px; }
.rcTplB--img { border-radius: 6px; }
.rcTplB--btn { height: 18px; width: 55%; border-radius: 6px; }
.rcTplB--logo { height: 18px; width: 36px; border-radius: 4px; background: rgba(0,0,0,0.14); }
.rcTplB--grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 5px; background: none; }
.rcTplB--grid i { height: 30px; border-radius: 4px; background: rgba(0,0,0,0.07); }
.rcTplB--list { display: flex; flex-direction: column; gap: 5px; background: none; }
.rcTplB--list i { height: 12px; border-radius: 4px; background: rgba(0,0,0,0.07); }
.rcTplCard__meta { display: flex; align-items: center; justify-content: space-between; margin-top: 11px; }
.rcTplCard__meta b { font-family: var(--serif); font-weight: 700; font-size: 14px; color: var(--ink); }
.rcTplCard__meta em { font-family: var(--mono); font-style: normal; font-size: 11px; font-weight: 700; }

/* builder */
.rcBuilder { background: #15171e; border: 2px solid var(--ink); border-radius: 18px; overflow: hidden; box-shadow: 8px 8px 0 var(--ink); }
.rcBuilder__bar { display: flex; align-items: center; gap: 14px; padding: 13px 18px; background: #1e2128; border-bottom: 1px solid rgba(255,255,255,0.08); }
.rcBuilder__dots { display: flex; gap: 6px; }
.rcBuilder__dots i { width: 11px; height: 11px; border-radius: 50%; background: #3a3f4a; }
.rcBuilder__dots i:first-child { background: #ff5f57; } .rcBuilder__dots i:nth-child(2) { background: #febc2e; } .rcBuilder__dots i:nth-child(3) { background: #28c840; }
.rcBuilder__title { font-family: var(--mono); font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.65); }
.rcBuilder__save { margin-left: auto; font-family: var(--mono); font-size: 11px; font-weight: 700; color: #4ade80; }
.rcBuilder__body { display: grid; grid-template-columns: 200px 1fr; min-height: 360px; }
.rcBuilder__palette { background: #1a1d24; border-right: 1px solid rgba(255,255,255,0.08); padding: 16px 14px; display: flex; flex-direction: column; gap: 8px; }
.rcBuilder__paletteLbl { font-family: var(--mono); font-size: 11px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(255,255,255,0.4); margin-bottom: 4px; }
.rcBlock { display: flex; align-items: center; gap: 9px; padding: 10px 12px; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); border-radius: 9px; font-family: var(--sans); font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.85); cursor: grab; animation: rcFloat 3s ease-in-out infinite; }
@keyframes rcFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-2px); } }
.rcBlock__grip { font-style: normal; color: rgba(255,255,255,0.3); letter-spacing: -2px; }
.rcBuilder__canvas { position: relative; padding: 26px 30px; background: repeating-linear-gradient(45deg, #181b22 0 12px, #15171e 12px 24px); display: flex; flex-direction: column; gap: 12px; }
.rcCanvasBlock { background: #fff; border-radius: 10px; padding: 16px 18px; position: relative; }
.rcCanvasBlock__tag { position: absolute; top: -8px; left: 14px; font-family: var(--mono); font-size: 11px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: #fff; background: var(--accent); padding: 2px 7px; border-radius: 4px; }
.rcCanvasBlock--hero { background: linear-gradient(135deg, #fff5ea, #fff); border: 1.5px solid var(--accent-2); }
.rcCanvasBlock--hero b { font-family: var(--serif); font-weight: 800; font-size: 20px; color: var(--ink); }
.rcCanvasLine { display: block; height: 10px; border-radius: 5px; background: rgba(0,0,0,0.1); margin-top: 8px; }
.rcCanvasBlock--drop { background: transparent; border: 2px dashed rgba(236,101,42,0.5); display: grid; place-items: center; padding: 22px; }
.rcCanvasBlock__hint { font-family: var(--sans); font-size: 13px; font-weight: 700; color: var(--accent-2); }
.rcCanvasBlock--btnrow { display: flex; align-items: center; }
.rcCanvasBtn { background: var(--accent); color: #fff; font-family: var(--sans); font-weight: 800; font-size: 13.5px; padding: 11px 22px; border-radius: 8px; }
.rcBuilder__cursor { position: absolute; right: 28%; top: 52%; z-index: 5; animation: rcCursor 3.5s ease-in-out infinite; }
.rcBuilder__ghost { position: absolute; left: 16px; top: 8px; background: rgba(236,101,42,0.92); color: #fff; font-family: var(--sans); font-size: 11px; font-weight: 700; padding: 5px 11px; border-radius: 6px; white-space: nowrap; box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
@keyframes rcCursor { 0%,100% { transform: translate(0,0); opacity: 0.95; } 40% { transform: translate(-60px,-40px); } 70% { transform: translate(-80px,-70px); opacity: 1; } }

@media (max-width: 860px) {
  .rcTpl__gallery { grid-template-columns: 1fr 1fr; }
  .rcBuilder__body { grid-template-columns: 1fr; }
  .rcBuilder__palette { flex-direction: row; flex-wrap: wrap; border-right: none; border-bottom: 1px solid rgba(255,255,255,0.08); }
  .rcBuilder__paletteLbl { flex-basis: 100%; }
  .rcBuilder__cursor { display: none; }
}
@media (max-width: 640px) {
  .rcTpl { padding: 56px 0; }
  .rcTpl__gallery { grid-template-columns: 1fr; }
  .rcBuilder { box-shadow: 4px 4px 0 var(--ink); }
}


/* ── realistic template mini-mail previews ── */
.rcTplCard__preview { height: auto; padding: 0; background: #f4f0e8; }
.rcTplMail { background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 10px rgba(0,0,0,0.08); }
.rcTplMail__hero { position: relative; height: 92px; display: grid; place-items: center; overflow: hidden; }
.rcTplMail__hero image-slot { position: absolute; inset: 0; width: 100%; height: 100%; display: block; opacity: 0.85; }
.rcTplMail__heroTxt { position: relative; z-index: 1; font-family: var(--serif); font-weight: 800; font-size: 15px; color: #fff; text-shadow: 0 1px 4px rgba(0,0,0,0.4); letter-spacing: -0.01em; text-align: center; padding: 0 10px; }
.rcTplMail__body { padding: 12px 13px 14px; display: flex; flex-direction: column; gap: 9px; }
.rcTplMail__sub { font-family: var(--sans); font-weight: 700; font-size: 11.5px; color: var(--ink); }
.rcTplMail__grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
.rcTplProd { display: flex; flex-direction: column; gap: 3px; }
.rcTplProd i { display: block; height: 30px; border-radius: 5px; }
.rcTplProd b { font-family: var(--mono); font-size: 11px; font-weight: 800; color: var(--ink); }
.rcTplMail__lines { display: flex; flex-direction: column; gap: 5px; }
.rcTplMail__lines span { height: 7px; border-radius: 4px; background: rgba(0,0,0,0.09); }
.rcTplMail__steps { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.rcTplMail__steps li { display: flex; align-items: center; gap: 7px; font-family: var(--sans); font-size: 11px; font-weight: 600; color: var(--ink-2); }
.rcTplMail__steps i { width: 16px; height: 16px; border-radius: 50%; color: #fff; display: grid; place-items: center; font-family: var(--mono); font-size: 11px; font-weight: 800; font-style: normal; }
.rcTplMail__event { display: flex; align-items: center; gap: 10px; }
.rcTplMail__date { font-family: var(--serif); font-weight: 800; font-size: 30px; line-height: 1; }
.rcTplMail__dateInfo { font-family: var(--sans); font-size: 11px; font-weight: 600; color: var(--ink-2); line-height: 1.35; }
.rcTplMail__btn { align-self: flex-start; font-family: var(--sans); font-weight: 800; font-size: 11px; color: #fff; padding: 7px 13px; border-radius: 6px; }


/* ── PRICING credit cards + calculator ── */
.rcCalc { max-width: 720px; margin: 0 auto 36px; background: #fff; border: 2px solid var(--ink); border-radius: 18px; padding: 24px 28px; box-shadow: 6px 6px 0 var(--ink); }
.rcCalc__top { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 16px; gap: 12px; flex-wrap: wrap; }
.rcCalc__lbl { font-family: var(--sans); font-weight: 700; font-size: 15px; color: var(--ink); }
.rcCalc__val { font-family: var(--serif); font-weight: 800; font-size: 26px; letter-spacing: -0.02em; color: var(--accent); }
.rcCalc__val em { font-family: var(--mono); font-style: normal; font-size: 12px; font-weight: 600; color: var(--ink-3); margin-left: 6px; }
.rcCalc__slider { -webkit-appearance: none; appearance: none; width: 100%; height: 10px; border-radius: 5px; background: linear-gradient(90deg, var(--accent) 0%, var(--accent-2) 100%); outline: none; margin-bottom: 14px; }
.rcCalc__slider::-webkit-slider-thumb { -webkit-appearance: none; width: 28px; height: 28px; border-radius: 50%; background: #fff; border: 3px solid var(--ink); box-shadow: 2px 2px 0 var(--ink); cursor: pointer; }
.rcCalc__slider::-moz-range-thumb { width: 28px; height: 28px; border-radius: 50%; background: #fff; border: 3px solid var(--ink); cursor: pointer; }
.rcCalc__hint { display: flex; align-items: center; gap: 8px; font-family: var(--sans); font-size: 13.5px; color: var(--ink-2); }
.rcCalc__hint b { font-weight: 800; }

.rcPlans { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; align-items: stretch; }
.rcPlan {
  position: relative; display: flex; flex-direction: column;
  background: #fff; border: 2px solid var(--ink); border-radius: 20px;
  padding: 26px 24px; box-shadow: 5px 5px 0 var(--ink);
  transition: transform .2s, box-shadow .2s, border-color .2s;
}
.rcPlan:hover { transform: translateY(-4px); box-shadow: 9px 9px 0 var(--pc); }
.rcPlan.is-pop { border-color: var(--pc); }
.rcPlan.is-rec { box-shadow: 0 0 0 3px var(--pc), 8px 8px 0 var(--pc); transform: translateY(-6px); }
.rcPlan__ribbon { position: absolute; top: -13px; left: 22px; background: var(--pc); color: #fff; font-family: var(--mono); font-size: 11px; font-weight: 800; letter-spacing: 0.06em; padding: 5px 12px; border-radius: 999px; border: 2px solid var(--ink); white-space: nowrap; z-index: 3; }
.rcPlan__rec { position: absolute; top: -13px; right: 18px; background: var(--ink); color: #fff; font-family: var(--mono); font-size: 11px; font-weight: 800; letter-spacing: 0.04em; padding: 5px 11px; border-radius: 999px; animation: rcRecPop .3s ease; }
@keyframes rcRecPop { from { transform: scale(0.7); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.rcPlan__name { font-family: var(--mono); font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 12px; }
.rcPlan__price { display: flex; align-items: baseline; gap: 4px; font-family: var(--serif); color: var(--ink); margin-bottom: 16px; }
.rcPlan__price span { font-size: 16px; font-weight: 700; }
.rcPlan__price b { font-size: clamp(24px, 2.6vw, 32px); font-weight: 800; letter-spacing: -0.03em; line-height: 1; }
.rcPlan__credit { font-family: var(--mono); font-size: 13.5px; color: var(--ink); padding-top: 14px; border-top: 1.5px dashed rgba(0,0,0,0.12); }
.rcPlan__credit b { font-family: var(--serif); font-weight: 800; font-size: 16px; }
.rcPlan__bonus { font-family: var(--mono); font-size: 13px; font-weight: 700; color: #16a34a; margin-top: 7px; }
.rcPlan__bonus--none { color: rgba(0,0,0,0.2); }
.rcPlan__per { font-family: var(--mono); font-size: 12px; color: var(--ink-3); margin-top: 7px; }
.rcPlan__per span { opacity: 0.7; }
.rcPlan__meter { height: 6px; border-radius: 3px; background: rgba(0,0,0,0.07); margin: 16px 0 18px; overflow: hidden; }
.rcPlan__meter span { display: block; height: 100%; background: var(--pc); border-radius: 3px; }
.rcPlan__cta { margin-top: auto; display: block; text-align: center; background: #fff; color: var(--pc); border: 2px solid var(--pc); font-family: var(--sans); font-weight: 800; font-size: 14px; padding: 12px; border-radius: 10px; text-decoration: none; transition: background .15s, color .15s; }
.rcPlan__cta:hover { background: var(--pc); color: #fff; }
.rcPlan.is-pop .rcPlan__cta, .rcPlan.is-rec .rcPlan__cta { background: var(--pc); color: #fff; }
.rcPlan.is-pop .rcPlan__cta:hover, .rcPlan.is-rec .rcPlan__cta:hover { filter: brightness(0.92); }

.rcPrice__note { display: flex; align-items: flex-start; gap: 14px; max-width: 880px; margin: 36px auto 0; background: #fffaf0; border: 1.5px dashed rgba(236,101,42,0.4); border-radius: 16px; padding: 20px 24px; }
.rcPrice__note__ic { font-size: 22px; }
.rcPrice__note p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--ink-2); }
.rcPrice__note b { color: var(--ink); font-weight: 800; }

@media (max-width: 920px) {
  .rcPlans { grid-template-columns: 1fr 1fr; gap: 14px; }
  .rcPlan.is-rec, .rcPlan.is-pop { transform: none; }
}
@media (max-width: 560px) {
  .rcPlans { grid-template-columns: 1fr; }
  .rcCalc__val { font-size: 22px; }
}

.nvMark{width:64%;height:64%;object-fit:contain;display:block}
.nvWord{height:22px;width:auto;display:block}

/* pricing tidy v2 */
.rcCalc{max-width:none}
.rcPlans{align-items:stretch}
.rcPlan,.rcPlan.is-rec{transform:none}
.rcPlan.is-rec{box-shadow:0 0 0 3px var(--accent),5px 5px 0 var(--ink)}
.rcPlan.is-pop{border-color:var(--accent);box-shadow:5px 5px 0 var(--accent)}
.rcPlan.is-pop.is-rec{box-shadow:0 0 0 3px var(--accent),5px 5px 0 var(--accent)}
.rcPlan:hover{transform:translateY(-3px)}
.rcPlan__top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;min-height:24px}
.rcPlan__top .rcPlan__name{margin:0}
.rcPlan__ribbon{position:static;border:0;background:var(--accent);font-size:10.5px;padding:4px 10px}
.rcPlan__rec{position:static;background:#FDE7D9;color:#B4441A;font-size:10.5px;padding:4px 10px;white-space:nowrap;animation:none}
.rcPlan__bonus--none{color:var(--ink-3);font-weight:500}
.rcPlan__meter span{background:var(--accent)}
.rcPlan:not(.is-pop) .rcPlan__cta{color:var(--ink);border-color:var(--ink)}
.rcPlan:not(.is-pop) .rcPlan__cta:hover{background:var(--ink);color:#fff}
.rcCalc__hint b{color:var(--accent)}
.rcPrice__note{max-width:none;border:1.5px solid rgba(236,101,42,.28);background:#FFF6EC;align-items:center}
.rcPrice__note__ic{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#FDE7D9;color:var(--accent)}
.rcTplMail__hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rcTplMail__hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.5))}
.rcTplMail__hero{height:104px}
.rcTplProd img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:5px;background:#f4f0e8}
.rcTplCard{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch}
.rcTplCard__preview{flex:none}
.rcTplCard__meta{gap:8px;align-items:flex-start}.rcTplCard__meta em{white-space:nowrap;margin-top:2px}
.rcLogos__track{gap:44px;align-items:center}
.rcLogos__item{display:inline-flex;align-items:center;gap:10px;font-family:var(--sans);font-weight:800;font-size:19px;letter-spacing:-.01em;color:rgba(255,255,255,.72)}
.rcLogos__item img{width:26px;height:26px;object-fit:contain;flex:none;border-radius:6px}
.rcLogos__item.is-mono img{filter:brightness(0) invert(1);opacity:.85;border-radius:0}
.rcLogos__item:hover{color:#fff}
@media (max-width:600px){.rcLogos__track{gap:32px}.rcLogos__item{font-size:16px}.rcLogos__item img{width:22px;height:22px}}
.rcLogos{padding:30px 0 32px}.rcLogos__lbl{margin-bottom:22px}.rcLogos__item.is-word img{width:92px;height:92px;margin:-33px 0;object-fit:contain}

.rcHero__pill>i{display:none!important}
/* real white logos */
.rcLogos__item.is-real{height:44px;display:flex;align-items:center}
.rcLogos__item.is-real img{display:block;width:auto!important;height:30px!important;max-width:150px;margin:0!important;border-radius:0!important;object-fit:contain;filter:brightness(0) invert(1);opacity:.8;transition:opacity .2s}
.rcLogos__item.is-real:hover img{opacity:1}
@media (max-width:600px){.rcLogos__item.is-real img{height:24px!important;max-width:120px}}
/* feature tag: quiet label */
.rcFx__tag{background:none!important;padding:0 0 0 14px!important;border-radius:0!important;position:relative;font:600 13px/1.3 var(--sans)!important;letter-spacing:0!important;text-transform:none!important;color:var(--accent)!important}
.rcFx__tag::before{content:"";position:absolute;left:0;top:50%;width:8px;height:1.5px;background:var(--accent)}
/* integ hub logos */
.rcConHub__node.is-logo{background:#fff;border-color:transparent;box-shadow:0 10px 24px -12px rgba(0,0,0,.5)}
.rcConHub__node.is-logo img{width:26px;height:26px;display:block}
/* engagement line chart */
.rcEng{position:relative;padding-left:30px}
.rcEng__legend{display:flex;gap:16px;margin-bottom:10px;font:500 12.5px/1 var(--sans);color:rgba(255,255,255,.62)}
.rcEng__legend span{display:inline-flex;align-items:center;gap:6px}
.rcEng__legend b{color:#fff;font-weight:700}
.rcEng__legend i{width:10px;height:3px;border-radius:2px;background:#EC652A}
.rcEng__legend .is-click i{background:#7FD3FF}
.rcEng__svg{display:block;width:100%;height:130px;overflow:visible}
.rcEng__grid{stroke:rgba(255,255,255,.08);stroke-width:1;vector-effect:non-scaling-stroke}
.rcEng__l{fill:none;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.rcEng__l--open{stroke:#EC652A}
.rcEng__l--click{stroke:#7FD3FF;stroke-dasharray:4 4}
.rcEng__dot{fill:#fff;stroke:#EC652A;stroke-width:2;vector-effect:non-scaling-stroke}
.rcEng__y{position:absolute;left:0;top:28px;bottom:6px;display:flex;flex-direction:column;justify-content:space-between;font:500 10.5px/1 var(--mono);color:rgba(255,255,255,.38)}
.rcDashChart__x{padding-left:30px}
.rcLogos__item.is-real img{height:34px!important;width:120px!important;max-width:none}
@media (max-width:600px){.rcLogos__item.is-real img{height:28px!important;width:96px!important}}
/* pricing example */
.rcEx{max-width:960px;margin:40px auto 0;background:#1B1A17;color:#EDE7DD;border-radius:22px;padding:22px 24px 18px;box-shadow:0 26px 50px -34px rgba(0,0,0,.55)}
.rcEx__hd{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-bottom:16px}
.rcEx__hd span{font:600 12.5px/1 var(--sans);color:#F7A26F}
.rcEx__hd b{font:700 18px/1.3 var(--serif);color:#fff}
.rcEx__steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;counter-reset:none}
.rcEx__steps li{position:relative;padding:14px 16px;border-radius:14px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);display:flex;flex-direction:column;gap:4px}
.rcEx__steps li+li::before{content:"→";position:absolute;left:-12px;top:50%;transform:translate(-50%,-50%);width:22px;height:22px;border-radius:50%;background:#1B1A17;color:#F7A26F;display:grid;place-items:center;font-size:13px;z-index:1}
.rcEx__steps em{font:500 12.5px/1.2 var(--sans);font-style:normal;color:rgba(255,255,255,.6)}
.rcEx__steps b{font:800 24px/1.1 var(--serif);color:#fff;letter-spacing:-.01em}
.rcEx__steps small{font-size:12.5px;color:rgba(255,255,255,.55)}
.rcEx__steps li.is-res{background:linear-gradient(135deg,#EC652A,#C9471A);box-shadow:none}
.rcEx__steps li.is-res em,.rcEx__steps li.is-res small{color:rgba(255,255,255,.88)}
.rcEx__ft{margin:14px 0 0;font-size:13.5px;color:rgba(255,255,255,.62)}
@media (max-width:640px){.rcEx{padding:18px 16px 16px;border-radius:18px}.rcEx__steps{grid-template-columns:1fr;gap:8px}.rcEx__steps li{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:2px 10px}.rcEx__steps em{flex-basis:100%}.rcEx__steps b{font-size:21px}.rcEx__steps li+li::before{content:"↓";left:50%;top:-4px}}
/* logos: consistent size + seamless loop */
.rcLogos__track{gap:56px!important;animation-duration:48s!important}
.rcLogos__item.is-real img{width:auto!important;height:38px!important;max-width:150px!important;object-fit:contain}
.rcLogos__item[data-l="kino"] img,.rcLogos__item[data-l="sidomuncul"] img{height:30px!important}
.rcLogos__item[data-l="indomobil"] img,.rcLogos__item[data-l="polytron"] img{height:44px!important}
@media (max-width:600px){.rcLogos__track{gap:40px!important}.rcLogos__item.is-real img{height:30px!important}.rcLogos__item[data-l="kino"] img,.rcLogos__item[data-l="sidomuncul"] img{height:24px!important}.rcLogos__item[data-l="indomobil"] img,.rcLogos__item[data-l="polytron"] img{height:36px!important}}
/* steps: elegant */
.rcSteps__grid{gap:22px}
.rcStep{border:0!important;border-radius:20px;padding:26px 24px 28px!important;box-shadow:0 0 0 1px rgba(40,40,40,.08),0 22px 40px -32px rgba(60,40,20,.45)!important}
.rcStep:hover{transform:translateY(-3px);box-shadow:0 0 0 1px color-mix(in oklab,var(--c) 40%,transparent),0 26px 44px -30px rgba(60,40,20,.5)!important}
.rcStep__top{position:relative;margin-bottom:20px!important}
.rcStep__ic{position:relative;z-index:1;width:50px;height:50px;border-radius:15px;display:grid;place-items:center;color:var(--c);background:color-mix(in oklab,var(--c) 11%,#fff);box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--c) 22%,transparent)}
.rcStep__line{flex:1;height:1px;margin-left:16px;background:repeating-linear-gradient(90deg,rgba(40,40,40,.22) 0 5px,transparent 5px 10px)}
.rcStep:last-child .rcStep__line{display:none}
.rcStep h3{font-size:20px!important;margin-bottom:8px}
.rcStep p{font-size:14.5px!important;line-height:1.65!important}
@media (max-width:920px){.rcStep__line{display:none}}
#harga .rcCalc{margin-bottom:28px!important}
/* templates: realistic mail */
.rcTplMail__inbox{display:flex;align-items:center;gap:9px;padding:9px 10px;border-bottom:1px solid #EEE7DE;background:#FBF8F4}
.rcTplMail__av{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:#fff;font:700 11px/1 var(--sans)}
.rcTplMail__from{min-width:0;display:flex;flex-direction:column;gap:1px}
.rcTplMail__from b{display:flex;justify-content:space-between;gap:6px;font:700 11.5px/1.25 var(--sans);color:var(--ink)}
.rcTplMail__from time{font:500 10.5px/1.25 var(--sans);color:#9A9187}
.rcTplMail__from span{font-size:10.5px;line-height:1.3;color:#5E5750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rcTplMail__news{list-style:none;margin:6px 0 10px;padding:0;display:flex;flex-direction:column;gap:7px}
.rcTplMail__news li{font-size:10.5px;line-height:1.4;color:#6B635B;padding-left:8px;border-left:2px solid var(--ac)}
.rcTplMail__news b{display:block;font-size:11px;color:var(--ink)}
.rcTplMail__steps i{font-style:normal;font-size:9px}
.rcTplMail__foot{display:flex;justify-content:space-between;gap:6px;padding:8px 10px;border-top:1px solid #EEE7DE;font-size:9.5px;color:#A39A90}
.rcTplMail__foot span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rcTplMail__foot u{flex:none;color:#8A8178}
/* CTA with photo */
.rcCta{position:relative;overflow:hidden;padding:96px 0!important;background:linear-gradient(105deg,rgba(22,19,15,.94) 0%,rgba(22,19,15,.82) 45%,rgba(120,44,12,.72) 100%),url(assets/karir/team-office.webp) center/cover no-repeat!important}
.rcCta__inner{position:relative;z-index:2}
.rcCta__deco{position:absolute;inset:0;z-index:1;pointer-events:none}
.rcCta__env{position:absolute;display:flex;flex-direction:column;gap:3px;padding:12px 16px 12px 46px;border-radius:14px;background:rgba(255,255,255,.08);backdrop-filter:blur(6px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);font:700 17px/1.1 var(--serif);color:#fff;animation:rcCtaFloat 6s ease-in-out infinite}
.rcCta__env b{font:600 11.5px/1 var(--sans);color:#F7A26F}
.rcCta__env::before{content:"";position:absolute;left:14px;top:50%;width:20px;height:15px;margin-top:-7.5px;border-radius:3px;border:1.6px solid #F7A26F;background:linear-gradient(to bottom right,transparent 46%,#F7A26F 47%,#F7A26F 53%,transparent 54%) top left/50% 60% no-repeat,linear-gradient(to bottom left,transparent 46%,#F7A26F 47%,#F7A26F 53%,transparent 54%) top right/50% 60% no-repeat}
.rcCta__env--a{left:6%;top:22%}
.rcCta__env--b{right:7%;top:18%;animation-delay:-2s}
.rcCta__env--c{right:12%;bottom:16%;animation-delay:-4s}
@keyframes rcCtaFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media (max-width:1100px){.rcCta__env--a{left:3%;top:10%}.rcCta__env--b{right:3%;top:8%}.rcCta__env--c{display:none}}
@media (max-width:760px){.rcCta{padding:64px 0!important}.rcCta__deco{display:none}}
@media (prefers-reduced-motion:reduce){.rcCta__env{animation:none}}
.rcTpl__gallery{grid-template-columns:repeat(4,minmax(0,1fr))}
.rcTplCard,.rcTplCard__preview,.rcTplMail{min-width:0}
@media (max-width:1000px){.rcTpl__gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.rcTpl__gallery{grid-template-columns:minmax(0,1fr)}}
.rcCta__env{padding:12px 16px!important}
.rcCta__env::before{display:none}
.rcTplMail__from{flex:1}
/* pricing cards v3 */
.rcPk{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:stretch}
.rcPk__card{position:relative;display:flex;flex-direction:column;background:#fff;border-radius:20px;padding:22px 20px 20px;box-shadow:0 0 0 1px rgba(40,40,40,.09),0 20px 40px -32px rgba(60,40,20,.45);transition:transform .2s,box-shadow .2s}
.rcPk__card:hover{transform:translateY(-3px)}
.rcPk__card.is-rec{background:#1B1A17;color:#EDE7DD;box-shadow:0 0 0 2px var(--accent),0 28px 50px -30px rgba(236,101,42,.55)}
.rcPk__hd{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:26px}
.rcPk__name{font:700 15px/1 var(--sans);color:var(--ink)}
.is-rec .rcPk__name{color:#fff}
.rcPk__tag{font:700 11.5px/1 var(--sans);padding:6px 10px;border-radius:999px;background:var(--accent);color:#fff;white-space:nowrap}
.rcPk__tag--pop{background:#FDE7D9;color:#B84A17}
.rcPk__price{display:flex;align-items:baseline;gap:5px;margin-top:16px}
.rcPk__price small{font:600 14px/1 var(--sans);color:#8A8178}
.rcPk__price b{font:800 32px/1 var(--serif);letter-spacing:-.02em;color:var(--ink)}
.is-rec .rcPk__price b{color:#fff}.is-rec .rcPk__price small{color:rgba(255,255,255,.6)}
.rcPk__per{margin-top:6px;font-size:13px;color:#7A7168}
.is-rec .rcPk__per{color:#F7A26F}
.rcPk__credit{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:18px 0 16px;padding:12px 14px;border-radius:14px;background:#F7F2EB}
.is-rec .rcPk__credit{background:rgba(255,255,255,.07)}
.rcPk__credit div{display:flex;flex-direction:column;gap:2px}
.rcPk__credit b{font:800 19px/1.1 var(--serif);color:var(--ink)}
.is-rec .rcPk__credit b{color:#fff}
.rcPk__credit span{font-size:12px;color:#7A7168}
.is-rec .rcPk__credit span{color:rgba(255,255,255,.6)}
.rcPk__credit em{font:700 12px/1 var(--sans);font-style:normal;color:#15803D;background:#DCFCE7;padding:6px 8px;border-radius:8px;white-space:nowrap}
.is-rec .rcPk__credit em{background:rgba(34,197,94,.16);color:#4ADE80}
.rcPk__list{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:9px;flex:1}
.rcPk__list li{position:relative;padding-left:22px;font-size:13.5px;line-height:1.45;color:#4A443E}
.is-rec .rcPk__list li{color:rgba(255,255,255,.82)}
.rcPk__list li::before{content:"";position:absolute;left:2px;top:4px;width:11px;height:6px;border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(-45deg)}
.rcPk__cta{display:flex;justify-content:center;align-items:center;min-height:46px;border-radius:12px;font:700 14.5px/1 var(--sans);text-decoration:none;color:var(--ink);background:#fff;box-shadow:inset 0 0 0 1.5px rgba(40,40,40,.18);transition:background .15s,color .15s}
.rcPk__cta:hover{background:var(--ink);color:#fff}
.is-rec .rcPk__cta{background:var(--accent);color:#fff;box-shadow:none}
.is-rec .rcPk__cta:hover{background:#D5551E}
@media (max-width:1000px){.rcPk{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.rcPk{grid-template-columns:minmax(0,1fr);gap:12px}.rcPk__price b{font-size:28px}}
.rcPk__credit{background:transparent!important;padding:12px 0!important;border-radius:0!important;border-top:1px solid rgba(40,40,40,.1);border-bottom:1px solid rgba(40,40,40,.1)}
.is-rec .rcPk__credit{background:transparent!important;border-color:rgba(255,255,255,.12)}
/* feature explorer mobile */
@media (max-width:860px){
.rcFx{gap:14px}
.rcFx__tabs{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;overflow:visible!important;padding:0!important}
.rcFxTab{min-width:0!important;display:flex!important;align-items:center;padding:12px 12px!important;border-width:1.5px!important;border-radius:12px!important;box-shadow:none!important;transform:none!important}
.rcFxTab__n,.rcFxTab__chev{display:none!important}
.rcFxTab__t{font-size:14px!important;line-height:1.25}
.rcFxTab.is-on{box-shadow:none!important}
.rcFx__stage{padding:22px 18px!important;box-shadow:none!important;border-width:1.5px!important;min-width:0}
.rcFx__viz{min-height:160px;padding:14px!important;overflow:hidden}
.rcFx__viz>*{max-width:100%}
}
@media (max-width:640px){.rcFx__stageHd h3{font-size:21px!important}.rcFx__stageHd p{font-size:14.5px!important;margin-bottom:16px!important}.rcFx__viz{border-style:solid!important;border-color:rgba(40,40,40,.08)!important;background:#fff!important}}
/* builder mobile */
@media (max-width:640px){
.rcBuilder{border-width:1.5px!important;box-shadow:0 20px 40px -28px rgba(0,0,0,.6)!important;border-radius:16px}
.rcBuilder__bar{padding:11px 14px;gap:10px}
.rcBuilder__dots i{width:9px;height:9px}
.rcBuilder__title{font:600 12px/1.2 var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.rcBuilder__save{flex:none;font:600 11.5px/1 var(--sans)}
.rcBuilder__body{display:flex!important;flex-direction:column-reverse;min-height:0}
.rcBuilder__palette{flex-direction:row!important;flex-wrap:nowrap!important;overflow-x:auto;gap:8px!important;padding:12px 14px!important;border-bottom:0!important;border-top:1px solid rgba(255,255,255,.08);scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
.rcBuilder__palette::-webkit-scrollbar{display:none}
.rcBuilder__paletteLbl{display:none!important}
.rcBuilder__palette>span:not(.rcBuilder__paletteLbl){flex:none;white-space:nowrap}
.rcBuilder__canvas{padding:16px 14px!important;background:#181b22!important;gap:10px!important}
.rcCanvasBlock{padding:12px 12px!important}
.rcCanvasBlock--hero b{font-size:17px!important;line-height:1.25}
.rcCanvasBtn{font-size:13px!important}
}
/* faq mobile accordion */
.rcFm{display:none}
@media (max-width:760px){
.rcFaq__split{display:none!important}
.rcFm{display:block;margin-top:22px;background:#fff;border-radius:18px;box-shadow:0 0 0 1px rgba(40,40,40,.08),0 18px 36px -28px rgba(60,40,20,.4);overflow:hidden}
.rcFm__it{border-top:1px solid rgba(40,40,40,.08)}
.rcFm__it:first-child{border-top:0}
.rcFm__q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 18px;border:0;background:transparent;text-align:left;cursor:pointer;color:var(--ink);font:700 15.5px/1.4 var(--sans)}
.rcFm__q i{position:relative;flex-shrink:0;width:26px;height:26px;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(40,40,40,.18)}
.rcFm__q i::before,.rcFm__q i::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:2px;margin:-1px 0 0 -5px;background:#6B6157;border-radius:2px;transition:transform .2s}
.rcFm__q i::after{transform:rotate(90deg)}
.rcFm__it.is-on .rcFm__q{color:var(--accent)}
.rcFm__it.is-on .rcFm__q i{background:var(--accent);box-shadow:none}
.rcFm__it.is-on .rcFm__q i::before,.rcFm__it.is-on .rcFm__q i::after{background:#fff}
.rcFm__it.is-on .rcFm__q i::after{transform:rotate(0)}
.rcFm__a{padding:0 18px 18px}
.rcFm__a p{margin:0;font-size:15px;line-height:1.7;color:#3D3833}
.rcFm__wa{display:flex;flex-direction:column;gap:3px;padding:16px 18px;background:#1B1A17;color:#fff;text-decoration:none}
.rcFm__wa b{font:700 15px/1.3 var(--sans)}
.rcFm__wa span{font-size:14px;color:#F7A26F;font-weight:600}
}
