/* ==========================================================================
   RoTunneling — site.css  ·  "Produs VPN, semnat cu ie" (2026-10)
   Familiar VPN product site in the ipvanish / hide.me family: light sticky
   header, navy hero, white and soft-grey sections, a dark pricing panel,
   a rich navy footer. The ie motif is a signature only (hero eyebrow and
   footer edge). Green stays reserved for actions.
   Loaded after revamp.css; owns the chrome (header, footer, page bands)
   and the home page (.lp-*). Inner-page components still come from revamp.css.
   ========================================================================== */

:root {
  --s-navy-900: #0B1A33;
  --s-navy-800: #0F2547;
  --s-navy-700: #18335E;
  --s-navy-line: rgba(255, 255, 255, 0.12);
  --s-on-navy: #F4F7FC;
  --s-on-navy-soft: #B4C2D9;     /* 8.9:1 on navy-900 */
  --s-blue: #1F5FBF;             /* links, 5.6:1 on white */
  --s-blue-500: #2D6FE3;
  --s-blue-100: #DDE8FF;
  --s-blue-50: #F1F5FF;
  --s-ink: #101828;
  --s-ink-2: #475467;            /* 7.6:1 on white */
  --s-ink-3: #5D6B82;            /* 5.5:1 on white */
  --s-line: #E4E7EC;
  --s-soft: #F5F7FB;
  --s-action: #2E7D32;
  --s-action-hover: #246428;
  --s-wrap: 1200px;
  --s-r-sm: 8px;
  --s-r: 12px;
  --s-r-lg: 20px;
  --s-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.06);
  --s-shadow: 0 1px 3px rgba(16, 24, 40, 0.06), 0 12px 32px rgba(16, 24, 40, 0.08);
  --s-shadow-lg: 0 4px 8px rgba(11, 26, 51, 0.10), 0 24px 56px rgba(11, 26, 51, 0.22);
  --s-header-h: 72px;
}

html { scroll-behavior: smooth; scroll-padding-top: calc(var(--s-header-h) + 16px); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { background: #fff; color: var(--s-ink); }

/* ---------- header ---------- */
.sh-skip {
  position: absolute; left: 16px; top: -48px; z-index: 1001;
  padding: 10px 16px; border-radius: var(--s-r-sm);
  background: var(--s-ink); color: #fff !important; font-weight: 700;
}
.sh-skip:focus { top: 12px; }
.sh {
  position: sticky; top: 0; z-index: 1000;
  background: rgba(255, 255, 255, 0.96);
  -webkit-backdrop-filter: saturate(160%) blur(10px);
  backdrop-filter: saturate(160%) blur(10px);
  border-bottom: 1px solid var(--s-line);
  transition: box-shadow 0.2s ease;
}
.sh.is-scrolled { box-shadow: 0 6px 24px rgba(16, 24, 40, 0.08); }
.sh__in {
  max-width: var(--s-wrap); margin: 0 auto; padding: 0 24px;
  height: var(--s-header-h);
  display: flex; align-items: center; gap: 32px;
}
.sh__brand { display: flex; align-items: center; flex: 0 0 auto; }
.sh__brand img { height: 38px; width: auto; display: block; }
.sh__nav { flex: 1 1 auto; }
.sh__nav ul { display: flex; align-items: center; gap: 2px; margin: 0; padding: 0; list-style: none; }
.sh__nav a, .sh__account {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 12px; border-radius: var(--s-r-sm);
  color: var(--s-ink-2); font-size: 15px; font-weight: 600; white-space: nowrap;
  text-decoration: none; transition: color 0.15s ease, background-color 0.15s ease;
}
.sh__nav a:hover, .sh__account:hover { color: var(--s-ink); background: var(--s-soft); text-decoration: none; }
.sh__tools { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.sh__lang { display: inline-flex; padding: 3px; border: 1px solid var(--s-line); border-radius: 999px; }
.sh__lang a {
  padding: 4px 10px; border-radius: 999px;
  color: var(--s-ink-3); font-size: 12.5px; font-weight: 700; letter-spacing: 0.04em; text-decoration: none;
}
.sh__lang a:hover { color: var(--s-ink); text-decoration: none; }
.sh__lang a[aria-current="true"] { background: var(--s-ink); color: #fff; }
.sh__cta {
  display: inline-flex; align-items: center; justify-content: center;
  height: 42px; padding: 0 20px; border-radius: 999px;
  background: var(--s-action); color: #fff !important; font-size: 15px; font-weight: 700;
  text-decoration: none !important; white-space: nowrap;
  transition: background-color 0.15s ease, transform 0.15s ease;
}
.sh__cta:hover { background: var(--s-action-hover); }
.sh__toggle {
  display: none; align-items: center; gap: 10px;
  height: 42px; padding: 0 14px; border: 1px solid var(--s-line); border-radius: 999px;
  background: #fff; color: var(--s-ink); font-size: 14px; font-weight: 700; cursor: pointer;
}
.sh__burger, .sh__burger::before, .sh__burger::after {
  display: block; width: 16px; height: 2px; border-radius: 2px; background: currentColor;
  transition: transform 0.2s ease, opacity 0.2s ease;
}
.sh__burger { position: relative; }
.sh__burger::before, .sh__burger::after { content: ""; position: absolute; left: 0; }
.sh__burger::before { top: -5px; }
.sh__burger::after { top: 5px; }
.sh.is-open .sh__burger { background: transparent; }
.sh.is-open .sh__burger::before { transform: translateY(5px) rotate(45deg); }
.sh.is-open .sh__burger::after { transform: translateY(-5px) rotate(-45deg); }
.sh__menu { border-top: 1px solid var(--s-line); background: #fff; padding: 8px 24px 24px; }
.sh__menu[hidden] { display: none; }
.sh__menu ul { list-style: none; margin: 0; padding: 0; }
.sh__menu li a {
  display: block; padding: 14px 4px; border-bottom: 1px solid var(--s-line);
  color: var(--s-ink); font-size: 17px; font-weight: 600; text-decoration: none;
}
.sh__menu-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 20px; }
@media (max-width: 1180px) {
  .sh__in { gap: 20px; }
  .sh__nav a { padding: 8px 9px; font-size: 14.5px; }
}
@media (max-width: 1060px) {
  .sh__nav, .sh__tools > .sh__lang, .sh__account { display: none; }
  .sh__toggle { display: inline-flex; }
  .sh__in { justify-content: space-between; }
}
@media (max-width: 480px) {
  .sh__in { padding: 0 16px; gap: 12px; }
  .sh__brand img { height: 32px; }
  .sh__tools > .sh__cta { display: none; }
  .sh__menu { padding: 8px 16px 20px; }
}
@media (min-width: 1061px) { .sh__menu { display: none !important; } }
#main { position: relative; top: calc(-1 * var(--s-header-h)); }

/* ---------- shared home primitives ---------- */
.lp-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.lp-wrap { max-width: var(--s-wrap); margin: 0 auto; padding: 0 24px; }
@media (max-width: 480px) { .lp-wrap { padding: 0 16px; } }
.lp-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 46px; padding: 0 22px; border-radius: 999px; border: 1.5px solid transparent;
  font-size: 15.5px; font-weight: 700; line-height: 1; white-space: nowrap;
  text-decoration: none !important; cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}
.lp-btn--lg { height: 54px; padding: 0 28px; font-size: 16.5px; }
.lp-btn--primary { background: var(--s-action); color: #fff !important; box-shadow: 0 8px 20px rgba(46, 125, 50, 0.28); }
.lp-btn--primary:hover { background: var(--s-action-hover); transform: translateY(-1px); }
.lp-btn--ghost { border-color: rgba(255, 255, 255, 0.34); color: #fff !important; }
.lp-btn--ghost:hover { border-color: #fff; background: rgba(255, 255, 255, 0.06); }
.lp-btn--outline { border-color: var(--s-ink); color: var(--s-ink) !important; }
.lp-btn--outline:hover { background: var(--s-ink); color: #fff !important; }
.lp-btn:active { transform: translateY(0); }

.lp-ic { width: 56px; height: 56px; flex: 0 0 auto; overflow: visible; }
/* sprite symbols are styled where they are defined; each host svg tunes them with custom properties */
.lp-sprite .d { fill: var(--ic-d, #DDE8FF); stroke: none; }
.lp-sprite .s { fill: none; stroke: var(--ic-s, #18335E); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.lp-sprite .a { fill: none; stroke: var(--ic-a, #2D6FE3); stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; }
.lp-sprite circle.a { fill: var(--ic-a, #2D6FE3); stroke: none; }
.lp-sprite .t { fill: var(--ic-a, #2D6FE3); font: 800 13px "Manrope", system-ui, sans-serif; }
.lp-chk { width: 18px; height: 18px; flex: 0 0 auto; color: var(--s-action); margin-top: 2px; }

.lp-section { padding: clamp(64px, 8vw, 104px) 0; background: #fff; }
.lp-section--soft { background: var(--s-soft); }
.lp-head { max-width: 760px; margin: 0 auto clamp(36px, 4.5vw, 56px); text-align: center; }
.lp-head h2, .lp-platforms h2, .lp-faq__head h2, .lp-end h2 {
  margin: 0; color: var(--s-ink); font-size: clamp(30px, 3.4vw, 42px); font-weight: 800;
  letter-spacing: -0.03em; line-height: 1.12; text-wrap: balance;
}
.lp-head p { margin: 14px auto 0; max-width: 62ch; color: var(--s-ink-2); font-size: 18px; line-height: 1.6; text-wrap: pretty; }
.lp-head--on-dark h2 { color: #fff; }
.lp-head--on-dark p { color: var(--s-on-navy-soft); }
.lp-section h3 { margin: 0; color: var(--s-ink); font-size: 20px; font-weight: 750; letter-spacing: -0.01em; line-height: 1.3; }
.lp-section p { color: var(--s-ink-2); font-size: 16px; line-height: 1.65; }

/* ---------- hero ---------- */
.lp-hero {
  position: relative; overflow: hidden;
  background:
    radial-gradient(42% 60% at 82% 38%, rgba(45, 111, 227, 0.32), transparent 70%),
    radial-gradient(30% 50% at 8% 100%, rgba(45, 111, 227, 0.16), transparent 70%),
    linear-gradient(180deg, var(--s-navy-900) 0%, var(--s-navy-800) 100%);
  color: var(--s-on-navy);
  padding: clamp(56px, 8vw, 112px) 0 clamp(64px, 8vw, 120px);
}
.lp-hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px);
  background-size: 24px 24px;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 55%, #000 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 55%, #000 100%);
}
.lp-hero__grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
.lp-eyebrow {
  display: inline-flex; align-items: center; gap: 10px; margin: 0 0 22px;
  padding: 6px 14px 6px 8px; border: 1px solid var(--s-navy-line); border-radius: 999px;
  background: rgba(255, 255, 255, 0.05);
  color: var(--s-on-navy); font-size: 14px; font-weight: 700; letter-spacing: 0.01em;
}
.lp-eyebrow__ie {
  width: 28px; height: 14px; border-radius: 3px;
  background: var(--rt-ie-tile) 50% 50% / 28px 14px no-repeat;
}
.lp-hero__title {
  margin: 0; color: #fff !important;
  font-size: clamp(40px, 5.4vw, 66px); font-weight: 800; letter-spacing: -0.04em; line-height: 1.03;
  text-wrap: balance;
}
.lp-hero__title span { color: #9CC1FF; }
.lp-hero__lead { margin: 22px 0 0; max-width: 56ch; color: var(--s-on-navy-soft); font-size: clamp(17px, 1.4vw, 19px); line-height: 1.6; }
.lp-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.lp-hero__guarantee { display: flex; align-items: center; gap: 10px; margin: 20px 0 0; color: var(--s-on-navy-soft); font-size: 15px; }
.lp-hero__guarantee svg { color: #7FD486; flex: 0 0 auto; }
.lp-hero__guarantee b { color: #fff; font-weight: 700; }
.lp-hero__avail { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin-top: 36px; padding-top: 28px; border-top: 1px solid var(--s-navy-line); color: var(--s-on-navy-soft); font-size: 14px; font-weight: 600; }
.lp-hero__avail ul { display: flex; gap: 18px; margin: 0; padding: 0; list-style: none; }
.lp-hero__avail li { display: flex; align-items: center; color: #fff; font-size: 22px; opacity: 0.86; }
.lp-hero__avail .lp-plat__ic { width: 24px; height: 24px; --ic-d: rgba(255, 255, 255, 0.16); --ic-s: #fff; --ic-a: #fff; }

.lp-hero__visual { position: relative; display: flex; justify-content: center; padding: 28px 0; }
.lp-app {
  width: min(100%, 380px); margin: 0; overflow: hidden;
  background: #fff; color: var(--s-ink); border-radius: 22px; box-shadow: var(--s-shadow-lg);
}
.lp-app__bar { display: flex; align-items: center; gap: 6px; padding: 14px 18px; border-bottom: 1px solid var(--s-line); background: var(--s-soft); }
.lp-app__bar span { width: 10px; height: 10px; border-radius: 50%; background: #CDD5E0; }
.lp-app__bar b { margin-left: 8px; color: var(--s-ink-2); font-size: 13px; font-weight: 700; }
.lp-app__body { padding: 30px 26px 26px; text-align: center; }
.lp-app__ring {
  position: relative; width: 132px; height: 132px; margin: 0 auto 18px; border-radius: 50%;
  background: radial-gradient(circle, #E9F6EA 0 52%, transparent 53%), conic-gradient(var(--s-action) 0 100%);
  box-shadow: 0 0 0 10px #F1F8F1;
  display: grid; place-items: center;
}
.lp-app__ring::after {
  content: ""; position: absolute; inset: -10px; border-radius: 50%;
  border: 2px solid rgba(46, 125, 50, 0.35);
  animation: lp-pulse 2.6s ease-out infinite;
}
@keyframes lp-pulse { 0% { transform: scale(0.92); opacity: 0.9; } 100% { transform: scale(1.18); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .lp-app__ring::after { animation: none; } }
.lp-app__power {
  position: relative; width: 40px; height: 40px; border: 4px solid var(--s-action); border-top-color: transparent; border-radius: 50%;
}
.lp-app__power::before { content: ""; position: absolute; left: 50%; top: -10px; width: 4px; height: 22px; margin-left: -2px; border-radius: 2px; background: var(--s-action); }
.lp-app__status { margin: 0; color: var(--s-ink); font-size: 24px; font-weight: 800; letter-spacing: -0.02em; }
.lp-app__sub { margin: 4px 0 0; color: var(--s-ink-3); font-size: 14px; }
.lp-app__facts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 24px 0 22px; text-align: left; }
.lp-app__facts div { padding: 12px 14px; border: 1px solid var(--s-line); border-radius: var(--s-r); }
.lp-app__facts dt { color: var(--s-ink-3); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; }
.lp-app__facts dd { margin: 4px 0 0; color: var(--s-ink); font-size: 15.5px; font-weight: 750; }
.lp-app__btn { display: block; padding: 13px; border-radius: 999px; background: var(--s-soft); color: var(--s-ink-2); font-size: 14.5px; font-weight: 700; }
.lp-float {
  position: absolute; display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 16px; border-radius: 14px; background: #fff; color: var(--s-ink);
  font-size: 14.5px; font-weight: 750; box-shadow: var(--s-shadow-lg); white-space: nowrap;
}
.lp-float--a { left: calc(50% - 250px); top: 19%; }
.lp-float--b { right: calc(50% - 262px); top: 31%; }
.lp-float__ic { width: 28px; height: 28px; }
.lp-flag { display: inline-block; width: 24px; height: 16px; border-radius: 3px; background: linear-gradient(90deg, #002B7F 0 33.3%, #FCD116 33.3% 66.6%, #CE1126 66.6%); box-shadow: inset 0 0 0 1px rgba(16, 24, 40, 0.12); }
@media (max-width: 991px) {
  .lp-hero__grid { grid-template-columns: 1fr; }
  .lp-hero__copy { text-align: center; }
  .lp-hero__lead { margin-left: auto; margin-right: auto; }
  .lp-hero__actions, .lp-hero__guarantee, .lp-hero__avail { justify-content: center; }
}
@media (max-width: 560px) {
  .lp-hero__actions .lp-btn { width: 100%; }
  .lp-hero__avail { flex-direction: column; gap: 12px; }
  .lp-float--a { left: -4px; top: 4px; }
  .lp-float--b { right: -4px; top: auto; bottom: 4px; }
  .lp-float { font-size: 13px; padding: 10px 12px; }
}

/* ---------- trust strip ---------- */
.lp-trust { background: #fff; border-bottom: 1px solid var(--s-line); }
.lp-trust__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 auto; list-style: none; }
.lp-trust__list li { display: flex; flex-direction: column; gap: 4px; padding: 26px 24px; border-left: 1px solid var(--s-line); }
.lp-trust__list li:first-child { border-left: 0; padding-left: 0; }
.lp-trust__list b { color: var(--s-ink); font-size: 16px; font-weight: 800; }
.lp-trust__list span { color: var(--s-ink-3); font-size: 14px; line-height: 1.45; }
@media (max-width: 991px) {
  .lp-trust__list { grid-template-columns: 1fr 1fr; }
  .lp-trust__list li { padding: 20px 16px; border-left: 0; border-top: 1px solid var(--s-line); }
  .lp-trust__list li:nth-child(-n+2) { border-top: 0; }
  .lp-trust__list li:nth-child(odd) { padding-left: 0; }
}
@media (max-width: 480px) {
  .lp-trust__list { grid-template-columns: 1fr; }
  .lp-trust__list li { padding: 16px 0 !important; border-top: 1px solid var(--s-line) !important; }
  .lp-trust__list li:first-child { border-top: 0 !important; }
}

/* ---------- features ---------- */
.lp-features { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lp-feature { padding: 8px 36px; border-left: 1px solid var(--s-line); text-align: center; }
.lp-feature:first-child { border-left: 0; }
.lp-feature .lp-ic { margin: 0 auto 20px; display: block; }
.lp-feature p { margin: 12px 0 0; }
@media (max-width: 860px) {
  .lp-features { grid-template-columns: 1fr; gap: 40px; }
  .lp-feature { border-left: 0; padding: 0; max-width: 520px; margin: 0 auto; }
}

/* ---------- use cases ---------- */
.lp-uses { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.lp-use { padding: 36px; background: #fff; border: 1px solid var(--s-line); border-radius: var(--s-r-lg); box-shadow: var(--s-shadow-sm); }
.lp-use__head { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; }
.lp-use__head .lp-ic { width: 48px; height: 48px; }
.lp-use h3 { font-size: 22px; }
.lp-use p { margin: 0; }
.lp-use ul { display: grid; gap: 10px; margin: 22px 0 0; padding: 22px 0 0; border-top: 1px solid var(--s-line); list-style: none; }
.lp-use li { display: flex; gap: 10px; color: var(--s-ink); font-size: 15.5px; font-weight: 600; }
@media (max-width: 860px) { .lp-uses { grid-template-columns: 1fr; } .lp-use { padding: 28px 24px; } }

/* ---------- pricing ---------- */
.lp-pricing-wrap { padding: clamp(56px, 7vw, 96px) 0; background: #fff; }
.lp-pricing {
  position: relative; padding: clamp(40px, 5vw, 64px) clamp(20px, 4vw, 56px);
  border-radius: 28px; overflow: hidden;
  background:
    radial-gradient(60% 50% at 50% 0%, rgba(45, 111, 227, 0.22), transparent 70%),
    var(--s-navy-900);
  color: var(--s-on-navy);
}
.lp-pricing .lp-head { margin-bottom: 32px; }
.lp-tabs {
  display: flex; justify-content: center; gap: 4px; width: max-content; max-width: 100%;
  margin: 0 auto 40px; padding: 5px; border-radius: 999px;
  background: rgba(255, 255, 255, 0.06); border: 1px solid var(--s-navy-line);
  overflow-x: auto; scrollbar-width: none;
}
.lp-tabs::-webkit-scrollbar { display: none; }
.lp-tab {
  display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto;
  height: 42px; padding: 0 18px; border: 0; border-radius: 999px;
  background: transparent; color: var(--s-on-navy-soft); font-size: 15px; font-weight: 700; cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.lp-tab em { font-style: normal; padding: 2px 7px; border-radius: 999px; background: rgba(127, 212, 134, 0.16); color: #9BE3A1; font-size: 12px; }
.lp-tab:hover { color: #fff; }
.lp-tab[aria-selected="true"] { background: #fff; color: var(--s-ink); }
.lp-tab[aria-selected="true"] em { background: #E7F4E8; color: var(--s-action); }

.lp-plans { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; align-items: start; }
.lp-plan {
  position: relative; display: flex; flex-direction: column;
  padding: 28px 24px 26px; border-radius: var(--s-r-lg);
  background: #fff; color: var(--s-ink); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06);
}
.lp-plan--featured { box-shadow: 0 0 0 3px var(--s-blue-500), var(--s-shadow-lg); }
.lp-plan__ribbon {
  position: absolute; top: -13px; left: 24px;
  padding: 5px 12px; border-radius: 999px;
  background: var(--s-ink); color: #fff; font-size: 12.5px; font-weight: 800; letter-spacing: 0.01em;
}
.lp-plan--featured .lp-plan__ribbon { background: var(--s-blue-500); }
.lp-plan__name { margin: 0; color: var(--s-ink) !important; font-size: 26px !important; font-weight: 800 !important; letter-spacing: -0.02em; }
.lp-plan__speed { margin: 2px 0 0; color: var(--s-ink-3); font-size: 15px; font-weight: 600; }
.lp-plan__price { display: flex; align-items: baseline; gap: 6px; margin-top: 18px; }
.lp-plan__amount { color: var(--s-ink); font-size: 40px; font-weight: 800; letter-spacing: -0.035em; line-height: 1; font-variant-numeric: tabular-nums; }
.lp-plan__unit { color: var(--s-ink-3); font-size: 15px; font-weight: 700; }
.lp-plan__save-row { min-height: 26px; margin: 10px 0 0; }
.lp-plan__save { display: inline-block; padding: 3px 10px; border-radius: 999px; background: #E7F4E8; color: var(--s-action); font-size: 13px; font-weight: 800; }
.lp-plan__billed { min-height: 40px; margin: 6px 0 18px; color: var(--s-ink-3); font-size: 13.5px; line-height: 1.45; }
.lp-plan__billed s { color: #98A2B3; }
.lp-btn--buy { width: 100%; height: 48px; background: var(--s-action); color: #fff !important; }
.lp-btn--buy:hover { background: var(--s-action-hover); }
.lp-plan--featured .lp-btn--buy { box-shadow: 0 8px 20px rgba(46, 125, 50, 0.3); }
.lp-plan__mb { display: flex; align-items: center; justify-content: center; gap: 6px; margin: 10px 0 0; color: var(--s-ink-3); font-size: 13px; font-weight: 600; }
.lp-plan__feats { display: grid; gap: 10px; margin: 22px 0 0; padding: 20px 0 0; border-top: 1px solid var(--s-line); list-style: none; }
.lp-plan__feats li { display: flex; gap: 9px; color: var(--s-ink-2); font-size: 14.5px; line-height: 1.4; }
.lp-plan__feats b { color: var(--s-ink); }
.lp-v { display: none; }
.lp-pricing[data-period="1"] .lp-v--1,
.lp-pricing[data-period="12"] .lp-v--12,
.lp-pricing[data-period="24"] .lp-v--24,
.lp-pricing[data-period="36"] .lp-v--36 { display: inline; }
.lp-pricing__note { margin: 28px 0 0; text-align: center; color: var(--s-on-navy-soft); font-size: 15px; }
.lp-pricing__note a, .lp-pricing__foot a { color: #9CC1FF; }
.lp-include { margin-top: 44px; padding-top: 36px; border-top: 1px solid var(--s-navy-line); }
.lp-include h3 { margin: 0 0 20px; color: #fff; font-size: 22px; font-weight: 800; }
.lp-include ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 24px; margin: 0; padding: 0; list-style: none; }
.lp-include li { display: flex; gap: 10px; color: var(--s-on-navy); font-size: 15px; }
.lp-include .lp-chk { color: #7FD486; }
.lp-pricing__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--s-navy-line); }
.lp-pricing__foot p { margin: 0; color: var(--s-on-navy-soft); font-size: 13.5px; }
.lp-pricing__pay { display: flex; align-items: center; gap: 10px; }
.lp-pricing__pay img { height: 24px; width: auto; padding: 4px 8px; box-sizing: content-box; background: #fff; border-radius: 6px; }
@media (max-width: 1100px) { .lp-plans { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 30px; } }
@media (max-width: 860px) { .lp-include ul { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) {
  .lp-pricing { border-radius: 0; margin: 0 -16px; padding-left: 16px; padding-right: 16px; }
  .lp-pricing-wrap { padding: 0; }
  .lp-plans { grid-template-columns: 1fr; }
  .lp-include ul { grid-template-columns: 1fr; }
  .lp-tabs { width: 100%; justify-content: flex-start; }
  .lp-tab { padding: 0 14px; font-size: 14px; }
}

/* ---------- differentiators ---------- */
.lp-diffs { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.lp-diff { display: flex; gap: 22px; padding: 32px; border: 1px solid var(--s-line); border-radius: var(--s-r-lg); background: #fff; transition: box-shadow 0.2s ease, border-color 0.2s ease; }
.lp-diff:hover { border-color: #CBD5E3; box-shadow: var(--s-shadow); }
.lp-diff p { margin: 8px 0 0; }
@media (max-width: 860px) { .lp-diffs { grid-template-columns: 1fr; } .lp-diff { padding: 24px; gap: 16px; } .lp-diff .lp-ic { width: 44px; height: 44px; } }

/* ---------- steps ---------- */
.lp-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; counter-reset: none; }
.lp-step { position: relative; padding: 32px 28px; border-radius: var(--s-r-lg); background: #fff; border: 1px solid var(--s-line); }
.lp-step__n {
  display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 20px; border-radius: 50%;
  background: var(--s-navy-900); color: #fff; font-size: 16px; font-weight: 800;
}
.lp-step p { margin: 10px 0 0; }
@media (min-width: 861px) {
  .lp-step:not(:last-child)::after {
    content: ""; position: absolute; top: 52px; right: -24px; width: 24px; height: 2px;
    background: repeating-linear-gradient(90deg, #B6C2D3 0 4px, transparent 4px 8px);
  }
}
@media (max-width: 860px) { .lp-steps { grid-template-columns: 1fr; } }

/* ---------- platforms ---------- */
.lp-platforms { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
.lp-platforms p { margin: 16px 0 28px; font-size: 17px; }
.lp-plat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.lp-plat {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
  height: 128px; border: 1px solid var(--s-line); border-radius: var(--s-r-lg); background: #fff;
  color: var(--s-ink) !important; font-size: 15.5px; font-weight: 700; text-decoration: none !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.lp-plat i { font-size: 34px; color: var(--s-navy-700); }
.lp-plat .lp-plat__ic { width: 34px; height: 34px; }
.lp-plat:hover { border-color: var(--s-blue-500); box-shadow: var(--s-shadow); transform: translateY(-2px); }
@media (max-width: 860px) { .lp-platforms { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .lp-plat-grid { grid-template-columns: 1fr 1fr; } .lp-plat { height: 104px; } }

/* ---------- faq ---------- */
.lp-faq { display: grid; grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
.lp-faq__head p { margin: 16px 0 0; }
.lp-faq__head a { font-weight: 700; }
.lp-faq__list { border-top: 1px solid var(--s-line); }
.lp-faq__item { border-bottom: 1px solid var(--s-line); }
.lp-faq__item summary {
  position: relative; display: block; padding: 22px 48px 22px 0; cursor: pointer;
  color: var(--s-ink); font-size: 17.5px; font-weight: 750; list-style: none;
}
.lp-faq__item summary::-webkit-details-marker { display: none; }
.lp-faq__item summary::after {
  content: ""; position: absolute; right: 6px; top: 50%; width: 12px; height: 12px; margin-top: -8px;
  border-right: 2.5px solid var(--s-ink-3); border-bottom: 2.5px solid var(--s-ink-3);
  transform: rotate(45deg); transition: transform 0.2s ease;
}
.lp-faq__item[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.lp-faq__item summary:hover { color: var(--s-blue); }
.lp-faq__item p { margin: -6px 0 22px; max-width: 70ch; }
@media (max-width: 860px) { .lp-faq { grid-template-columns: 1fr; } }

/* ---------- closing cta ---------- */
.lp-end {
  padding: clamp(56px, 7vw, 88px) 0;
  background:
    radial-gradient(50% 120% at 100% 0%, rgba(45, 111, 227, 0.35), transparent 70%),
    var(--s-navy-800);
}
.lp-end__in { display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.lp-end h2 { color: #fff; }
.lp-end p { margin: 12px 0 0; color: var(--s-on-navy-soft); font-size: 18px; }
.lp-end__actions { display: flex; gap: 12px; flex-wrap: wrap; }
@media (max-width: 560px) { .lp-end__actions, .lp-end__actions .lp-btn { width: 100%; } }

/* ---------- footer ---------- */
.sf { position: relative; background: var(--s-navy-900); color: var(--s-on-navy-soft); }
.sf__ie { opacity: 0.9; }
.sf__in { max-width: var(--s-wrap); margin: 0 auto; padding: 64px 24px 32px; }
.sf__grid { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr) 1.3fr; gap: 40px; }
.sf__brand img { height: 52px; width: auto; display: block; }
.sf__brand p { margin: 18px 0 0; max-width: 34ch; color: var(--s-on-navy-soft); font-size: 14.5px; line-height: 1.6; }
.sf__brand .sf__support { margin-top: 14px; }
.sf__title { margin: 4px 0 16px; color: #fff; font-size: 14px !important; font-weight: 800 !important; letter-spacing: 0.06em; text-transform: uppercase; }
.sf ul { margin: 0; padding: 0; list-style: none; }
.sf li { margin: 0 0 11px; }
.sf a { color: var(--s-on-navy-soft); font-size: 14.5px; text-decoration: none; }
.sf a:hover { color: #fff; text-decoration: underline; }
.sf__post { display: block; margin-bottom: 16px; color: #fff !important; font-weight: 700; line-height: 1.45; }
.sf__anpc { display: grid; gap: 8px; margin-top: 18px; }
.sf__anpc img { width: 170px; height: auto; border-radius: 6px; display: block; }
.sf__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--s-navy-line); }
.sf__pay { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 13.5px; }
.sf__pay img { height: 22px; width: auto; padding: 4px 8px; box-sizing: content-box; background: #fff; border-radius: 6px; }
.sf__social { display: flex; gap: 8px; }
.sf__social li { margin: 0; }
.sf__social a { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--s-navy-line); border-radius: 50%; font-size: 16px; }
.sf__social a:hover { background: rgba(255, 255, 255, 0.08); text-decoration: none; }
.sf__copy { margin: 20px 0 0; font-size: 13.5px; color: var(--s-on-navy-soft); }
@media (max-width: 991px) { .sf__grid { grid-template-columns: 1fr 1fr 1fr; } .sf__brand { grid-column: 1 / -1; } }
@media (max-width: 560px) { .sf__grid { grid-template-columns: 1fr 1fr; gap: 32px 20px; } .sf__col--blog { grid-column: 1 / -1; } .sf__in { padding: 48px 16px 28px; } }

/* ---------- inner pages: light band under the light header ---------- */
div#pageHeaderWrapper {
  background:
    radial-gradient(40% 140% at 100% 0%, rgba(45, 111, 227, 0.08), transparent 70%),
    var(--s-soft) !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--s-line);
  padding: clamp(36px, 4.5vw, 64px) 0 clamp(32px, 4vw, 56px) !important;
}
div.pageHeader { max-width: var(--s-wrap) !important; padding: 0 24px !important; color: var(--s-ink) !important; }
div.pageHeader .rt-page-title, div.pageHeader .rt-page-title a, div.pageHeader h1 { color: var(--s-ink) !important; }
div.pageHeader .rt-page-lead { color: var(--s-ink-2) !important; }
div#contentWrapper { background: #fff !important; }

/* ---------- refinements ---------- */
.lp-ic { box-sizing: border-box; width: 72px; height: 72px; padding: 14px; border-radius: 18px; background: var(--s-blue-50); box-shadow: inset 0 0 0 1px #E3EBFB; }
.lp-use__head .lp-ic { width: 56px; height: 56px; padding: 10px; border-radius: 14px; }
.lp-diff .lp-ic { width: 64px; height: 64px; padding: 12px; border-radius: 16px; }
.lp-float__ic { width: 28px; height: 28px; padding: 0; background: none; box-shadow: none; }
.lp-hero { padding-bottom: clamp(56px, 6vw, 88px); }
.lp-pricing[data-period="1"] .lp-plan__save-row { display: none; }
@media (max-width: 600px) {
  .lp-tabs { display: grid; grid-template-columns: 1fr 1fr; width: 100%; border-radius: 18px; }
  .lp-tab { justify-content: center; border-radius: 14px; }
  .lp-app { width: min(100%, 330px); }
  .lp-app__ring { width: 104px; height: 104px; }
  .lp-app__body { padding: 22px 18px 18px; }
  .lp-hero__visual { padding: 36px 0 32px; }
}
@media (max-width: 860px) { .lp-diff .lp-ic { width: 52px; height: 52px; padding: 10px; } }
/* the ie motif is a signature (hero, footer): form cards get a plain top edge */
#loginWrapper.rt-card::before, .rt-card::before { display: none !important; }
/* inner-page bullet lists: checks, not the ie stitch (the motif is a signature only) */
:root { --rt-stitch-mark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 20 20'><path d='m4.5 10.5 3.5 3.5 7.5-8' fill='none' stroke='%232E7D32' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/></svg>"); }

/* ---------- advance-payment offer (bootstrap modal) ---------- */
.lp-offer .modal-dialog { width: min(440px, calc(100% - 32px)); margin: 0; position: fixed; left: 24px; bottom: 24px; }
.lp-offer.fade .modal-dialog { transform: translateY(24px); transition: transform 0.3s var(--rt-ease-out, ease), opacity 0.3s ease; }
.lp-offer.in .modal-dialog { transform: none; }
.lp-offer .modal-content { position: relative; overflow: hidden; border: 0; border-radius: var(--s-r-lg); box-shadow: var(--s-shadow-lg); background: #fff; }
.lp-offer__close {
  position: absolute; top: 12px; right: 12px; z-index: 1;
  width: 36px; height: 36px; border: 0; border-radius: 50%;
  background: rgba(255, 255, 255, 0.12); color: #fff; font-size: 22px; line-height: 1; cursor: pointer;
}
.lp-offer__close:hover { background: rgba(255, 255, 255, 0.22); }
.lp-offer__band {
  padding: 28px 28px 24px;
  background: radial-gradient(70% 120% at 100% 0%, rgba(45, 111, 227, 0.4), transparent 70%), var(--s-navy-900);
  color: #fff;
}
.lp-offer__eyebrow { margin: 0; color: var(--s-on-navy-soft); font-size: 13px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.lp-offer__pct { margin: 6px 0 0; color: #fff; font-size: 56px; font-weight: 800; letter-spacing: -0.04em; line-height: 1; }
.lp-offer__per { margin: 6px 0 0; color: #9CC1FF; font-size: 16px; font-weight: 700; }
.lp-offer__body { padding: 24px 28px 28px; }
.lp-offer__title { margin: 0; color: var(--s-ink); font-size: 22px !important; font-weight: 800 !important; letter-spacing: -0.02em; }
.lp-offer__body p { margin: 8px 0 0; color: var(--s-ink-2); font-size: 15.5px; line-height: 1.55; }
.lp-offer__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.lp-offer + .modal-backdrop, body:has(.lp-offer.in) .modal-backdrop { opacity: 0.35; }
@media (max-width: 480px) { .lp-offer .modal-dialog { left: 16px; bottom: 16px; } .lp-offer__actions .lp-btn { flex: 1 1 auto; } }

/* ---------- register: wide form + summary aside ---------- */
.rt-reg { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 32px; align-items: start; margin: 0 !important; }
.rt-reg::before, .rt-reg::after { display: none !important; }
.rt-reg > .rt-form-col { max-width: none; width: auto; margin: 0 !important; padding: 0 15px; }
.rt-reg #loginWrapper.rt-card { padding: 32px 36px 36px !important; }
form[name="register"].rt-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 20px; }
form[name="register"].rt-form > * { grid-column: 1 / -1; }
form[name="register"].rt-form > label:has(#user),
form[name="register"].rt-form > label:has(input[name="mail"]),
form[name="register"].rt-form > label:has(#password),
form[name="register"].rt-form > label:has(#rec) { grid-column: auto; }
form[name="register"] .rt-billing { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 20px; }
form[name="register"] .rt-billing > * { grid-column: 1 / -1; }
form[name="register"] .rt-billing > label:has(#localitate),
form[name="register"] .rt-billing > label:has(#judet),
form[name="register"] .rt-billing > label:has(#adresa_linie2),
form[name="register"] .rt-billing > label:has(#cod_postal) { grid-column: auto; }
form[name="register"] .rt-billing > input[type="hidden"] { display: none; }
.rt-form-section {
  margin: 28px 0 14px !important; padding-top: 22px; border-top: 1px solid var(--s-line);
  color: var(--s-ink) !important; font-size: 17px !important; font-weight: 800; letter-spacing: -0.01em;
}
form[name="register"] > .rt-form-section:first-child { margin-top: 0 !important; padding-top: 0; border-top: 0; }
.rt-form-terms { margin: 18px 0 14px !important; color: var(--s-ink-2) !important; font-size: 14px !important; }
.rt-reg__aside { position: sticky; top: calc(var(--s-header-h) + 24px); }
.rt-reg__card { padding: 28px; border-radius: var(--s-r-lg); background: var(--s-soft); border: 1px solid var(--s-line); }
.rt-reg__card h2 { margin: 0 0 16px; color: var(--s-ink) !important; font-size: 19px !important; font-weight: 800 !important; }
.rt-reg__list { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.rt-reg__list li { position: relative; padding-left: 28px; color: var(--s-ink); font-size: 15px; line-height: 1.45; }
.rt-reg__list li::before { content: ""; position: absolute; left: 0; top: 2px; width: 18px; height: 18px; background: var(--rt-stitch-mark) 50% 50% / 18px 18px no-repeat; }
.rt-reg__mb { margin: 20px 0 0 !important; padding-top: 18px; border-top: 1px solid var(--s-line); color: var(--s-ink-2) !important; font-size: 14.5px !important; }
.rt-reg__links { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0 !important; font-size: 14px !important; }
.rt-reg__links span { color: var(--s-ink-3); }
@media (max-width: 991px) {
  .rt-reg { grid-template-columns: 1fr; }
  .rt-reg__aside { position: static; padding: 0 15px; }
}
@media (max-width: 600px) {
  form[name="register"].rt-form, form[name="register"] .rt-billing { grid-template-columns: 1fr; }
  form[name="register"].rt-form > label, form[name="register"] .rt-billing > label { grid-column: 1 / -1 !important; }
  .rt-reg #loginWrapper.rt-card { padding: 24px 18px 28px !important; }
}
.rt-reg #loginWrapper.rt-card { margin-top: 0 !important; }
.rt-form-section { font-weight: 800 !important; }
.rt-reg__card h2 { margin-top: 0 !important; }
.rt-reg__links { flex-direction: column; gap: 6px; }
.rt-reg__links span { display: none; }
