/* ===== Variabile ===== */
:root {
  --bg: #0a0a0c;
  --bg-2: #111115;
  --bg-3: #18181d;
  --line: #26262d;
  --text: #f4f4f6;
  --muted: #9a9aa6;
  --red: #ff3b3b;
  --red-2: #ff6a3d;
  --red-soft: rgba(255, 59, 59, .12);
  --green: #22c55e;
  --radius: 16px;
  --grad: linear-gradient(135deg, var(--red), var(--red-2));
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body {
  font-family: 'Inter', system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
img, svg { display: block; }
button { font: inherit; cursor: pointer; border: 0; background: none; color: inherit; }

.container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 20px; }
section { padding: 96px 0; }

h1, h2, h3 { line-height: 1.15; letter-spacing: -0.02em; }
h2 { font-size: clamp(28px, 4vw, 42px); font-weight: 800; }
h3 { font-size: 19px; font-weight: 700; }

.grad { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.eyebrow {
  display: inline-block; font-size: 13px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .12em; color: var(--red); margin-bottom: 12px;
}

.section-head { text-align: center; max-width: 640px; margin: 0 auto 48px; }
.section-head p { color: var(--muted); margin-top: 12px; font-size: 17px; }
.section-head--row { display: flex; justify-content: space-between; align-items: end; max-width: none; text-align: left; gap: 16px; flex-wrap: wrap; margin-bottom: 28px; }
.section-head--row h2 { font-size: 28px; }
.section-head--row p { margin: 0; font-size: 14px; }
.section-head--left { text-align: left; margin: 0; }
.section-head--left .btn { margin-top: 24px; }

/* ===== Butoane ===== */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 22px; border-radius: 999px; font-weight: 600; font-size: 15px;
  transition: transform .2s, box-shadow .2s, background .2s, border-color .2s;
  white-space: nowrap;
}
.btn--sm { padding: 9px 18px; font-size: 14px; }
.btn--lg { padding: 15px 30px; font-size: 16px; }
.btn--primary { background: var(--grad); color: #fff; box-shadow: 0 8px 24px rgba(255, 59, 59, .3); }
.btn--primary:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(255, 59, 59, .45); }
.btn--ghost { border: 1px solid var(--line); background: rgba(255,255,255,.03); }
.btn--ghost:hover { border-color: var(--red); background: var(--red-soft); }
.btn--light { background: #fff; color: #111; }
.btn--light:hover { transform: translateY(-2px); }

/* ===== Header ===== */
.header {
  position: fixed; inset: 0 0 auto; z-index: 100;
  transition: background .3s, border-color .3s;
  border-bottom: 1px solid transparent;
}
.header.scrolled { background: rgba(10, 10, 12, .85); backdrop-filter: blur(14px); border-color: var(--line); }
.header__inner { display: flex; align-items: center; justify-content: space-between; height: 72px; gap: 24px; }

.logo { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 20px; }
.logo__mark {
  width: 36px; height: 36px; border-radius: 10px; background: var(--grad);
  display: grid; place-items: center; font-size: 14px; color: #fff; letter-spacing: -.5px;
}


.burger { display: none; width: 40px; height: 40px; flex-direction: column; justify-content: center; gap: 5px; padding: 10px; }
.burger span { height: 2px; background: var(--text); border-radius: 2px; transition: .3s; }
.burger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger.open span:nth-child(2) { opacity: 0; }
.burger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ===== Hero ===== */
.hero { position: relative; padding: 160px 0 110px; overflow: hidden; }
.hero__bg { position: absolute; inset: 0; pointer-events: none; }
.hero__grid {
  position: absolute; inset: 0;
  background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse at 70% 40%, #000 10%, transparent 65%);
  -webkit-mask-image: radial-gradient(ellipse at 70% 40%, #000 10%, transparent 65%);
  opacity: .5;
}
.hero__glow { position: absolute; border-radius: 50%; filter: blur(110px); }
.hero__glow--1 { width: 520px; height: 520px; background: rgba(255, 59, 59, .28); top: -160px; right: -60px; animation: float 9s ease-in-out infinite; }
.hero__glow--2 { width: 380px; height: 380px; background: rgba(255, 106, 61, .16); bottom: -160px; left: -100px; animation: float 11s ease-in-out infinite reverse; }
@keyframes float { 50% { transform: translate(30px, 40px); } }

.hero__inner { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; gap: 56px; align-items: center; }
.badge {
  display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px;
  background: rgba(34, 197, 94, .1); border: 1px solid rgba(34, 197, 94, .25); color: #86efac; font-size: 13px; font-weight: 500;
}
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 0 rgba(34,197,94,.6); animation: pulse 2s infinite; }
@keyframes pulse { 70% { box-shadow: 0 0 0 8px rgba(34,197,94,0); } 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); } }

.hero h1 { font-size: clamp(38px, 6vw, 68px); font-weight: 900; margin: 22px 0 20px; text-transform: uppercase; letter-spacing: -0.03em; }
.hero__lead { font-size: 18px; color: var(--muted); max-width: 540px; }
.hero__cta { display: flex; gap: 14px; margin: 34px 0 28px; flex-wrap: wrap; }
.hero__checks { list-style: none; display: flex; gap: 22px; flex-wrap: wrap; color: var(--muted); font-size: 14px; }

.server-card {
  background: linear-gradient(180deg, var(--bg-3), var(--bg-2)); border: 1px solid var(--line); border-radius: 20px;
  box-shadow: 0 30px 80px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.02) inset;
  transform: perspective(1200px) rotateY(-8deg) rotateX(4deg); transition: transform .5s;
}
.server-card:hover { transform: none; }
.server-card__head { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-bottom: 1px solid var(--line); font-size: 13px; color: var(--muted); font-family: ui-monospace, monospace; }
.dots { display: flex; gap: 6px; }
.dots i { width: 10px; height: 10px; border-radius: 50%; background: #3a3a42; }
.dots i:first-child { background: var(--red); }
.server-card__body { padding: 22px; }
.metric { display: grid; grid-template-columns: 44px 1fr 40px; gap: 12px; align-items: center; font-size: 13px; margin-bottom: 14px; color: var(--muted); }
.metric em { font-style: normal; text-align: right; color: var(--text); }
.bar { height: 8px; background: var(--line); border-radius: 99px; overflow: hidden; }
.bar b { display: block; height: 100%; width: var(--w); background: var(--grad); border-radius: 99px; animation: grow 1.6s ease-out; }
@keyframes grow { from { width: 0; } }
.server-card__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 22px 0 18px; }
.server-card__stats div { background: var(--bg); border: 1px solid var(--line); border-radius: 12px; padding: 12px; text-align: center; }
.server-card__stats strong { display: block; font-size: 17px; }
.server-card__stats small { color: var(--muted); font-size: 12px; }
.terminal { background: #050506; border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; font-size: 12.5px; line-height: 1.8; overflow-x: auto; font-family: ui-monospace, Consolas, monospace; }
.t-green { color: #4ade80; } .t-dim { color: #6b6b76; } .t-red { color: var(--red-2); }
.caret { animation: blink 1s steps(1) infinite; }
@keyframes blink { 50% { opacity: 0; } }

/* ===== Locații ===== */
.locations { padding: 40px 0 20px; }
.loc-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; }
.loc {
  display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 14px;
  background: var(--bg-2); border: 1px solid var(--line); text-align: left; transition: .2s;
}
.loc:hover { border-color: #3a3a44; }
.loc.active { border-color: var(--red); background: var(--red-soft); }
.loc__flag { font-size: 24px; line-height: 1; }
.loc__info { display: flex; flex-direction: column; font-size: 13px; }
.loc__info b { font-size: 14px; }
.loc__status { color: var(--green); display: flex; align-items: center; gap: 5px; }
.loc__status::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.loc__ping { color: var(--muted); }

/* ===== Prețuri ===== */
.pricing__controls { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 32px; }
.tabs { display: inline-flex; padding: 5px; background: var(--bg-2); border: 1px solid var(--line); border-radius: 999px; gap: 4px; flex-wrap: wrap; }
.tab { padding: 10px 20px; border-radius: 999px; font-weight: 600; font-size: 14px; color: var(--muted); transition: .2s; }
.tab:hover { color: var(--text); }
.tab.active { background: var(--grad); color: #fff; }
.tab small { font-size: 11px; opacity: .8; margin-left: 2px; }
.tabs--small .tab { padding: 9px 16px; }

.plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; }
.pricing__note { text-align: center; color: var(--muted); font-size: 13px; margin-top: 28px; }
@keyframes fadeUp { from { opacity: 0; transform: translateY(16px); } }

/* ===== De ce noi ===== */
.why { background: var(--bg-2); border-block: 1px solid var(--line); }
.features { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.feature { padding: 30px; border-radius: var(--radius); background: var(--bg); border: 1px solid var(--line); transition: border-color .25s, transform .25s; }
.feature:hover { border-color: rgba(255,59,59,.5); transform: translateY(-4px); }
.feature__icon { width: 50px; height: 50px; border-radius: 14px; background: var(--red-soft); display: grid; place-items: center; margin-bottom: 20px; }
.feature__icon svg { width: 24px; height: 24px; fill: none; stroke: var(--red); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.feature p { color: var(--muted); font-size: 15px; margin-top: 8px; }

/* ===== Data center ===== */
.dc__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.dc__text p { color: var(--muted); font-size: 17px; margin: 16px 0 28px; }
.stats { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.stat { padding: 28px; border-radius: var(--radius); background: var(--bg-2); border: 1px solid var(--line); position: relative; overflow: hidden; }
.stat::after { content: ''; position: absolute; width: 120px; height: 120px; right: -40px; top: -40px; background: var(--red); filter: blur(60px); opacity: .18; }
.stat strong { display: block; font-size: 34px; font-weight: 900; letter-spacing: -.03em; }
.stat span { color: var(--muted); font-size: 14px; }
.stat strong span { color: var(--text); font-size: inherit; }

/* ===== Servicii ===== */
.service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.service { padding: 30px; border-radius: var(--radius); background: var(--bg-2); border: 1px solid var(--line); transition: .25s; display: flex; flex-direction: column; }
.service:hover { border-color: var(--red); transform: translateY(-4px); }
.service p { color: var(--muted); font-size: 15px; margin: 10px 0 20px; flex: 1; }
.service__link { color: var(--red); font-weight: 600; font-size: 14px; }

/* ===== Domenii ===== */
.domains { padding-top: 0; }
.domain-box {
  text-align: center; padding: 56px 32px; border-radius: 24px;
  background: radial-gradient(ellipse at top, rgba(255,59,59,.18), transparent 60%), var(--bg-2);
  border: 1px solid var(--line);
}
.domain-box > p { color: var(--muted); margin: 10px 0 28px; }
.domain-form { display: flex; gap: 10px; max-width: 620px; margin: 0 auto; padding: 6px; background: var(--bg); border: 1px solid var(--line); border-radius: 999px; }
.domain-form input { flex: 1; min-width: 0; background: none; border: 0; outline: 0; color: var(--text); font: inherit; font-size: 16px; padding: 0 20px; }
.domain-result { min-height: 28px; margin: 16px 0 8px; font-weight: 600; }
.domain-result.ok { color: #4ade80; }
.domain-result.taken { color: var(--red-2); }
.tlds { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; }
.tld { padding: 12px 20px; border-radius: 12px; background: var(--bg); border: 1px solid var(--line); display: flex; flex-direction: column; min-width: 110px; }
.tld b { font-size: 20px; }
.tld span { color: var(--muted); font-size: 13px; }

/* ===== FAQ ===== */
.faq { background: var(--bg-2); border-block: 1px solid var(--line); }
.faq__inner { display: grid; grid-template-columns: .8fr 1.2fr; gap: 56px; align-items: start; }
.accordion { display: grid; gap: 12px; }
.accordion details { background: var(--bg); border: 1px solid var(--line); border-radius: 14px; padding: 0 22px; transition: border-color .2s; }
.accordion details[open] { border-color: rgba(255,59,59,.5); }
.accordion summary { list-style: none; cursor: pointer; padding: 20px 0; font-weight: 600; display: flex; justify-content: space-between; gap: 16px; }
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary::after { content: '+'; color: var(--red); font-size: 22px; line-height: 1; transition: transform .2s; }
.accordion details[open] summary::after { transform: rotate(45deg); }
.accordion p { color: var(--muted); padding-bottom: 20px; font-size: 15px; }

/* ===== Plăți ===== */
.payments { padding: 56px 0; }
.payments__title { text-align: center; color: var(--muted); font-size: 14px; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 22px; }
.payments__list { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; }
.payments__list span { padding: 12px 22px; border: 1px solid var(--line); border-radius: 12px; font-weight: 700; color: #c9c9d1; background: var(--bg-2); }

/* ===== CTA ===== */
.cta { padding: 0 0 96px; }
.cta__inner { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; padding: 48px; border-radius: 24px; background: var(--grad); }
.cta h2 { font-size: clamp(24px, 3vw, 34px); }
.cta p { opacity: .9; margin-top: 6px; }

/* ===== Footer ===== */
.footer { border-top: 1px solid var(--line); padding-top: 64px; background: var(--bg-2); }
.footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 40px; }
.footer__brand p { color: var(--muted); margin: 16px 0 20px; max-width: 280px; font-size: 15px; }
.footer h4 { font-size: 15px; margin-bottom: 16px; }
.footer__grid > div:not(.footer__brand) { display: flex; flex-direction: column; gap: 10px; }
.footer__grid a, .footer__grid span { color: var(--muted); font-size: 14px; transition: color .2s; }
.footer__grid a:hover { color: var(--text); }
.socials { display: flex; gap: 10px; }
.socials a { width: 38px; height: 38px; border-radius: 10px; border: 1px solid var(--line); display: grid; place-items: center; font-size: 12px; font-weight: 700; }
.socials a:hover { border-color: var(--red); color: var(--red); }
.footer__bottom { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-top: 1px solid var(--line); margin-top: 48px; padding: 24px 20px; color: var(--muted); font-size: 13px; }

/* ===== Animație la scroll ===== */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s, transform .7s; }
.reveal.visible { opacity: 1; transform: none; }

/* ===== Responsive ===== */
@media (max-width: 1024px) {
  .hero__inner, .dc__inner, .faq__inner { grid-template-columns: 1fr; }
  .server-card { transform: none; }
  .features, .service-grid { grid-template-columns: 1fr 1fr; }
  .footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  section { padding: 64px 0; }
  .hero { padding: 120px 0 64px; }
  .features, .service-grid, .stats { grid-template-columns: 1fr; }
  .pricing__controls { flex-direction: column; }
  .tabs { width: 100%; justify-content: center; border-radius: 16px; }
  .domain-form { flex-direction: column; border-radius: 16px; }
  .domain-form input { padding: 12px 14px; }
  .cta__inner { padding: 32px 24px; }
  .footer__grid { grid-template-columns: 1fr; }
}

/* =====================================================================
   Componente pentru paginile interne
   ===================================================================== */
.badge { cursor: pointer; }
.pricing__note a, .accordion a, .legal a, .checkbox a, .footer__bottom a { color: var(--red-2); }

/* Hero pagini interne */
.page-hero { position: relative; padding: 150px 0 72px; overflow: hidden; text-align: center; }
.page-hero .container { position: relative; }
.page-hero h1 { font-size: clamp(34px, 5vw, 56px); font-weight: 900; margin-bottom: 16px; }
.page-hero p { color: var(--muted); font-size: 18px; max-width: 640px; margin: 0 auto 30px; }
.page-hero--small { padding: 130px 0 32px; }
.page-hero--small p { margin-bottom: 0; font-size: 14px; }
.page-hero--center { min-height: 70vh; display: grid; place-items: center; }
.big-404 { font-size: clamp(90px, 18vw, 180px) !important; line-height: 1; margin-bottom: 8px !important; }

/* Domeniu rapid pe homepage */
.quick-domain { padding: 0 0 24px; }
.quick-domain__box {
  display: grid; grid-template-columns: auto 1fr; gap: 32px; align-items: center;
  padding: 28px 32px; border-radius: 20px; border: 1px solid var(--line);
  background: radial-gradient(ellipse at left, rgba(255,59,59,.14), transparent 60%), var(--bg-2);
}
.quick-domain__box h2 { font-size: 24px; }
.quick-domain__box p { color: var(--muted); font-size: 14px; }
.quick-domain__form .domain-form { max-width: none; }
.quick-domain__form .domain-result { margin: 8px 0 0; min-height: 0; font-size: 14px; }

.domain-box--plain { background: none; border: 0; padding: 0; }
.domain-form--big { max-width: 720px; }
.domain-form--big input { font-size: 18px; }
.domain-type { display: flex; justify-content: center; gap: 24px; margin-top: 16px; color: var(--muted); font-size: 15px; }
.domain-type label { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.domain-type input { accent-color: var(--red); }

/* Locații */
.loc__code { width: 40px; height: 40px; border-radius: 10px; background: var(--bg-3); border: 1px solid var(--line); display: grid; place-items: center; font-weight: 800; font-size: 13px; flex-shrink: 0; }

.plan__na { font-size: 22px !important; color: var(--muted); }

/* Tabel prețuri */
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); }
.price-table { width: 100%; border-collapse: collapse; min-width: 520px; }
.price-table th, .price-table td { padding: 16px 22px; text-align: left; border-bottom: 1px solid var(--line); }
.price-table th { background: var(--bg-2); color: var(--muted); font-size: 13px; text-transform: uppercase; letter-spacing: .06em; }
.price-table tr:last-child td { border-bottom: 0; }
.price-table tbody tr:hover { background: var(--bg-2); }

/* Card generic */
.card { background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--radius); padding: 30px; }
.card h3 { margin-bottom: 10px; }
.card > p { color: var(--muted); margin-bottom: 20px; }

/* Date firmă */
.company-card { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.company-card div { background: var(--bg-2); padding: 22px; display: flex; flex-direction: column; gap: 4px; }
.company-card span { color: var(--muted); font-size: 13px; }
.company-card a { color: var(--red-2); font-weight: 700; }

/* Contact */
.contact { padding-top: 0; }
.contact__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 24px; align-items: start; }
.contact__info { display: grid; gap: 24px; }
.contact__list { list-style: none; display: grid; gap: 14px; }
.contact__list li { display: flex; flex-direction: column; font-size: 15px; }
.contact__list span { color: var(--muted); font-size: 13px; }
.contact__list a { color: var(--red-2); font-weight: 600; }
.contact-form { display: grid; gap: 18px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.contact-form label { display: grid; gap: 8px; font-size: 14px; font-weight: 600; }
.contact-form input, .contact-form select, .contact-form textarea {
  width: 100%; background: var(--bg); border: 1px solid var(--line); border-radius: 12px;
  padding: 13px 15px; color: var(--text); font: inherit; font-weight: 400; transition: border-color .2s;
}
.contact-form textarea { resize: vertical; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { outline: 0; border-color: var(--red); }
.contact-form .checkbox { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; color: var(--muted); }
.contact-form .checkbox input { width: auto; margin-top: 4px; accent-color: var(--red); }
.contact-form button { justify-self: start; }
.contact-form button:disabled { opacity: .6; cursor: wait; }
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-status { min-height: 24px; font-weight: 600; font-size: 15px; }
.form-status.ok { color: #4ade80; }
.form-status.err { color: var(--red-2); }

/* Pagini legale */
.legal { padding-top: 24px; }
.legal__body { max-width: 820px; }
.legal__body h2 { font-size: 22px; margin: 36px 0 12px; }
.legal__body h2:first-child { margin-top: 0; }
.legal__body p, .legal__body li { color: #c9c9d1; font-size: 16px; }
.legal__body ul { padding-left: 22px; display: grid; gap: 8px; }
.legal__note { margin-top: 40px; padding: 16px 20px; border-left: 3px solid var(--red); background: var(--bg-2); border-radius: 8px; font-size: 14px !important; color: var(--muted) !important; }

/* Banner cookie */
.cookie-bar {
  position: fixed; left: 20px; right: 20px; bottom: 20px; z-index: 200; max-width: 560px;
  display: flex; align-items: center; gap: 18px; padding: 16px 20px;
  background: var(--bg-3); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 20px 50px rgba(0,0,0,.5);
  animation: fadeUp .4s both;
}
.cookie-bar p { font-size: 14px; color: var(--muted); }
.cookie-bar a { color: var(--red-2); }

@media (max-width: 1024px) {
  .contact__grid { grid-template-columns: 1fr; }
  .company-card { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .page-hero { padding: 120px 0 48px; }
  .quick-domain__box { grid-template-columns: 1fr; gap: 16px; padding: 24px 20px; }
  .form-row, .company-card { grid-template-columns: 1fr; }
  .cookie-bar { flex-direction: column; align-items: stretch; text-align: center; }
}

/* =====================================================================
   v2 – Header cu bară de sus și submeniuri
   ===================================================================== */
.icon { width: 18px; height: 18px; flex-shrink: 0; }

.topbar { max-height: 64px; overflow: hidden; transition: max-height .3s, opacity .3s; }
.header.scrolled .topbar { max-height: 0; opacity: 0; }
.topbar__inner { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-top: 10px; }
.topbar__news { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #d8d8de; min-width: 0; }
.topbar__news span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar__news a { color: #ffd34d; text-decoration: underline; white-space: nowrap; }
.topbar__fire { color: #ff8a3d; width: 20px; height: 20px; }
.topbar__actions { display: flex; align-items: center; gap: 8px; }
.pill {
  display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 12px;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.06); font-size: 14px; font-weight: 600; color: #ececf0;
  transition: background .2s;
}
.pill:hover { background: rgba(255,255,255,.13); }
.pill--primary { background: var(--red); border-color: var(--red); color: #fff; }
.pill--primary:hover { background: #ff5252; }
.pill__chev { width: 14px; height: 14px; transition: transform .2s; }
.pill-drop { position: relative; }
.pill-drop.open .pill__chev { transform: rotate(180deg); }
.flag { font-size: 11px; font-weight: 800; padding: 2px 5px; border-radius: 4px; background: var(--red); color: #fff; letter-spacing: .02em; }

.header__inner { height: 76px; }
.logo { font-size: 24px; font-weight: 700; }
.logo__mark { width: 42px; height: 42px; border-radius: 12px; font-size: 16px; }

.nav { display: flex; align-items: center; gap: 4px; }
.nav__link {
  display: inline-flex; align-items: center; gap: 6px; padding: 10px 12px; border-radius: 10px;
  font-size: 16px; font-weight: 500; color: #ececf0; transition: color .2s, background .2s;
}
.nav__link:hover, .nav__item.open > .nav__link { color: #fff; background: rgba(255,255,255,.06); }
.nav__link.active { color: #fff; box-shadow: inset 0 -2px 0 var(--red); border-radius: 10px 10px 0 0; }
.nav__chev { width: 15px; height: 15px; transition: transform .2s; }
.nav__item { position: relative; }
.nav__item.open .nav__chev { transform: rotate(180deg); }
.nav__badge {
  font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 6px; letter-spacing: .03em;
  color: var(--red-2); background: rgba(255,59,59,.14); border: 1px solid rgba(255,59,59,.25);
}
.nav__mobile-only { display: none; }

.dropdown {
  position: absolute; top: calc(100% + 10px); left: 0; min-width: 300px; padding: 8px; z-index: 50;
  background: #141418; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 24px 60px rgba(0,0,0,.55);
  opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .2s, transform .2s, visibility .2s;
}
.dropdown::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.dropdown--right { left: auto; right: 0; }
.dropdown--small { min-width: 200px; }
.nav__item.open > .dropdown, .pill-drop.open > .dropdown { opacity: 1; visibility: visible; transform: none; }
@media (hover: hover) and (min-width: 1025px) {
  .nav__item:hover > .dropdown, .pill-drop:hover > .dropdown { opacity: 1; visibility: visible; transform: none; }
  .nav__item:hover .nav__chev, .pill-drop:hover .pill__chev { transform: rotate(180deg); }
}
.dropdown__item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; color: var(--text); transition: background .15s; }
.dropdown__item:hover, .dropdown__item.is-active { background: rgba(255,255,255,.05); }
.dropdown__item b { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; }
.dropdown__item small { display: block; color: var(--muted); font-size: 13px; }
.dropdown__item.is-disabled { opacity: .5; cursor: default; }
.dropdown__icon { width: 38px; height: 38px; border-radius: 10px; background: var(--red-soft); color: var(--red); display: grid; place-items: center; flex-shrink: 0; }
.dropdown__icon .icon { width: 20px; height: 20px; }

/* Butoane noi */
.btn .icon { width: 18px; height: 18px; }
.btn--dark { background: #3a1513; color: #ff6b5b; }
.btn--dark:hover { background: #4a1a17; transform: translateY(-2px); }
.btn--soft { background: #fde6e3; color: #e2402f; padding: 13px 28px; font-weight: 700; }
.btn--soft:hover { background: var(--red); color: #fff; transform: translateY(-2px); }

/* Butoane flotante */
.fab {
  position: fixed; bottom: 24px; z-index: 150; width: 58px; height: 58px; border-radius: 50%;
  display: grid; place-items: center; background: var(--red); color: #fff; box-shadow: 0 10px 30px rgba(255,59,59,.4);
  transition: transform .2s, opacity .3s, visibility .3s;
}
.fab .icon { width: 24px; height: 24px; }
.fab:hover { transform: translateY(-3px); }
.fab--left { left: 24px; opacity: 0; visibility: hidden; }
.fab--left.show { opacity: 1; visibility: visible; }
.fab--right { right: 24px; }
.cookie-bar { left: 96px; }

.toast {
  position: fixed; left: 50%; bottom: 100px; transform: translateX(-50%); z-index: 300;
  background: #1b1b20; color: #fff; padding: 12px 20px; border-radius: 12px; font-weight: 600; font-size: 14px;
  box-shadow: 0 10px 30px rgba(0,0,0,.4);
}

/* =====================================================================
   Hero cu fundal „foto” + carduri
   ===================================================================== */
.hero--photo { padding: 210px 0 70px; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; }
.hero__photo {
  position: absolute; inset: 0;
  background:
    linear-gradient(90deg, #000 0%, rgba(0,0,0,.92) 30%, rgba(0,0,0,.45) 65%, rgba(0,0,0,.6) 100%),
    linear-gradient(0deg, #0a0a0c 0%, transparent 25%),
    var(--img-hero, none) center/cover no-repeat,
    url("../img/racks.svg") right center/cover no-repeat;
}
.hero__inner--single { grid-template-columns: 1fr; }
.hero--photo h1 { font-size: clamp(40px, 6.2vw, 78px); line-height: 1.04; margin: 0 0 22px; }
.hero--photo .hero__cta { margin-bottom: 0; }
.hero__stats { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 80px; }
.hstat {
  display: flex; align-items: center; gap: 16px; padding: 26px 24px; border-radius: 22px;
  background: rgba(20, 20, 24, .72); border: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(10px);
}
.hstat__icon { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,59,59,.12); color: var(--red); flex-shrink: 0; }
.hstat__icon .icon { width: 24px; height: 24px; }
.hstat b { display: block; font-size: 20px; font-weight: 700; line-height: 1.25; }
.hstat a, .hstat span { display: inline-flex; align-items: center; gap: 8px; color: var(--red-2); font-size: 15px; margin-top: 4px; }
.hstat a { text-decoration: underline; text-underline-offset: 3px; }
.hstat a .icon { width: 16px; height: 16px; }

/* =====================================================================
   Secțiuni deschise la culoare
   ===================================================================== */
.section--light {
  --l-text: #1b1b20; --l-muted: #6c6c76; --l-line: #ebe7e3;
  background: #f5f4f2; color: var(--l-text);
}
.section--light .section-head p, .section--light .pricing__note { color: var(--l-muted); }
.section--light .tabs { background: #fff; border-color: var(--l-line); box-shadow: 0 2px 10px rgba(0,0,0,.03); }
.section--light .tab { color: var(--l-muted); }
.section--light .tab:hover { color: var(--l-text); }
.section--light .tab.active { color: #fff; }

/* Carduri de preț */
.plans { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; }
.plan {
  position: relative; display: flex; flex-direction: column; padding: 28px; border-radius: 24px;
  background: #fff; color: #1b1b20; border: 1px solid #efebe7; box-shadow: 0 2px 14px rgba(20,10,10,.04);
  transition: transform .25s, box-shadow .25s, border-color .25s; animation: fadeUp .45s both;
}
.plan:hover { transform: translateY(-6px); box-shadow: 0 22px 50px rgba(20,10,10,.1); }
.plan--popular { border-color: rgba(255,59,59,.45); box-shadow: 0 10px 40px rgba(255,59,59,.12); }
.plan__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding-bottom: 20px; border-bottom: 1px solid #efebe7; }
.plan__name { font-size: 24px; font-weight: 800; }
.plan__desc { color: #7a7a84; font-size: 14px; margin-top: 2px; }
.plan__tag { font-size: 12px; font-weight: 700; padding: 5px 12px; border-radius: 999px; background: var(--grad); color: #fff; white-space: nowrap; }
.plan__specs { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 16px; padding: 24px 0; flex: 1; }
.spec { display: flex; align-items: flex-start; gap: 12px; min-width: 0; }
.spec__icon { color: #ef4637; padding-top: 2px; }
.spec__icon .icon { width: 28px; height: 28px; stroke-width: 1.5; }
.spec__text { display: flex; flex-direction: column; min-width: 0; }
.spec__text b { font-size: 16px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.spec__text small { color: #8a8a93; font-size: 13.5px; }
.plan__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 20px; border-top: 1px solid #efebe7; }
.plan__amount { display: flex; align-items: baseline; gap: 8px; }
.plan__amount strong { font-size: 30px; font-weight: 800; color: #ef4637; letter-spacing: -.02em; }
.plan__amount s { color: #8a8a93; font-size: 17px; }
.plan__price small { color: #8a8a93; font-size: 14px; }
.plan__na { font-size: 20px !important; color: #8a8a93 !important; }
.plan .btn { width: auto; flex-shrink: 0; }

/* =====================================================================
   Glob + locații
   ===================================================================== */
.globe-section {
  position: relative; overflow: hidden;
  background: radial-gradient(ellipse at 70% 50%, rgba(255,59,59,.22), transparent 60%), linear-gradient(180deg, #0a0a0c, #1c0d0c 60%, #0a0a0c);
}
.globe-section__inner { display: grid; grid-template-columns: .8fr 1.2fr; gap: 48px; align-items: center; }
.globe-section__text h2 { margin-bottom: 14px; }
.globe-section__text > p { color: var(--muted); margin-bottom: 28px; font-size: 17px; }
.loc-list--stack { grid-template-columns: 1fr 1fr; }
.loc { background: rgba(20,20,24,.7); backdrop-filter: blur(6px); }
.globe-wrap { position: relative; aspect-ratio: 1; width: 100%; max-width: 640px; justify-self: center; }
#globe { width: 100%; height: 100%; cursor: grab; opacity: 0; transition: opacity 1.2s; contain: layout paint size; }
#globe.ready { opacity: 1; }
.globe-ring { position: absolute; border-radius: 50%; border: 2px solid transparent; pointer-events: none; }
.globe-ring--1 { inset: -2%; border-top-color: rgba(255,59,59,.7); border-left-color: rgba(255,59,59,.25); animation: spin 14s linear infinite; }
.globe-ring--2 { inset: 6%; border-bottom-color: rgba(255,59,59,.5); animation: spin 22s linear infinite reverse; }
@keyframes spin { to { transform: rotate(360deg); } }
.globe-wrap--fallback { display: none; }

/* =====================================================================
   Data center
   ===================================================================== */
.dc-section__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.dc-section h2 { font-size: clamp(32px, 4.4vw, 52px); }
.dc-section__lead { color: var(--l-muted); font-size: 19px; margin: 16px 0 36px; line-height: 1.5; }
.dstats { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.dstat { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 28px 24px; background: #fff; border-radius: 24px; box-shadow: 0 2px 14px rgba(20,10,10,.04); }
.dstat strong { display: block; font-size: 30px; font-weight: 600; letter-spacing: -.02em; }
.dstat span { color: var(--l-muted); font-size: 15px; }
.dstat__icon { color: #ef4637; }
.dstat__icon .icon { width: 40px; height: 40px; stroke-width: 1.4; }
.dc-gallery { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1.6fr 1fr; gap: 20px; aspect-ratio: 1 / .95; }
.dc-photo { border-radius: 24px; overflow: hidden; background-color: #111; background-size: cover; background-position: center; display: grid; place-items: center; }
.dc-photo--1 { grid-column: 1 / -1; background-image: linear-gradient(120deg, rgba(255,140,40,.25), transparent 60%), var(--img-dc1, none), url("../img/racks.svg"); background-position: center, center, 80% 30%; background-size: cover, cover, 220%; }
.dc-photo--2 { background-image: var(--img-dc2, none), url("../img/racks.svg"); background-position: center, 60% 70%; background-size: cover, 300%; }
.dc-photo--3 { background-image: linear-gradient(rgba(0,0,0,.35), rgba(0,0,0,.35)), var(--img-dc3, none), url("../img/racks.svg"); background-position: center, center, 95% 40%; background-size: cover, cover, 320%; }
.dc-photo--3 .btn { box-shadow: none; }

/* =====================================================================
   Noutăți
   ===================================================================== */
.news .section-head h2 { font-size: clamp(36px, 5vw, 56px); color: #2b3240; }
.news-list { display: grid; gap: 40px; }
.news-card { display: grid; grid-template-columns: 1.05fr 1fr; gap: 32px; align-items: center; padding: 20px; background: #fff; border-radius: 26px; box-shadow: 0 2px 14px rgba(20,10,10,.04); }
.news-card--rev .news-card__cover { order: 2; }
.news-card__cover { display: block; border-radius: 18px; overflow: hidden; }
.news-card__cover:hover .cover { transform: scale(1.02); }
.news-card__body { padding: 8px 12px; }
.news-card__cats { display: flex; flex-wrap: wrap; margin-bottom: 10px; }
.news-card__cats span { color: #7a7a84; font-size: 15px; padding: 0 12px; border-left: 1px solid #ddd; }
.news-card__cats span:first-child { padding-left: 0; border-left: 0; }
.news-card h3 { font-size: clamp(22px, 2.3vw, 30px); line-height: 1.25; margin-bottom: 14px; }
.news-card h3 a:hover { color: #ef4637; }
.news-card p { color: #6c6c76; font-size: 17px; line-height: 1.65; }
.news-card__foot { display: flex; align-items: center; gap: 20px; margin-top: 22px; padding-top: 20px; border-top: 1px solid #efebe7; }
.read-more { display: inline-flex; align-items: center; gap: 8px; color: #ef4637; font-weight: 600; margin-right: auto; transition: gap .2s; }
.read-more:hover { gap: 12px; }
.news-card__date { display: inline-flex; align-items: center; gap: 6px; color: #7a7a84; font-size: 15px; }
.icon-btn { display: inline-flex; align-items: center; gap: 6px; color: #7a7a84; padding: 6px; border-radius: 8px; font-size: 14px; }
.icon-btn:hover { color: #ef4637; background: #fde6e3; }
.news__all { text-align: center; margin-top: 40px; }

/* Copertă generată */
.cover {
  position: relative; aspect-ratio: 16 / 8.5; padding: 28px 32px; color: #fff; overflow: hidden;
  display: flex; flex-direction: column; justify-content: center; transition: transform .4s;
  background:
    radial-gradient(circle at 85% 40%, rgba(255,59,59,.35), transparent 45%),
    linear-gradient(135deg, #1a0d0c, #0b0b0d 60%);
  background-size: cover; background-position: center;
}
.cover::after {
  content: ""; position: absolute; right: -6%; top: 10%; width: 46%; aspect-ratio: 1; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.12); box-shadow: inset 0 0 60px rgba(255,59,59,.25);
  background: repeating-linear-gradient(60deg, transparent 0 14px, rgba(255,255,255,.04) 14px 15px);
}
.cover--img::after { display: none; }
.cover__top { position: absolute; top: 22px; left: 28px; right: 22px; display: flex; justify-content: space-between; align-items: center; z-index: 1; }
.cover__logo { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 17px; }
.cover__logo .logo__mark { width: 30px; height: 30px; border-radius: 8px; font-size: 11px; }
.cover__meta { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 10px; border: 1px solid rgba(255,255,255,.2); background: rgba(0,0,0,.4); font-family: ui-monospace, Consolas, monospace; font-size: 13px; }
.cover__meta .icon { width: 15px; height: 15px; }
.cover__title { position: relative; z-index: 1; font-size: clamp(26px, 3.4vw, 42px); font-weight: 900; line-height: 1.05; letter-spacing: -.02em; margin-top: 30px; }
.cover__title span { color: #ff4a3d; }
.cover__sub { position: relative; z-index: 1; margin-top: 14px; color: #d6d6dc; font-size: 15px; }
.cover--big { border-radius: 22px; aspect-ratio: 16 / 7; }
.cover--big .cover__title { font-size: clamp(32px, 5vw, 60px); }

/* Pagina articol */
.article-page { padding: 170px 0 96px; }
.article { max-width: 860px; margin: 0 auto; }
.article__back { display: inline-block; color: #ef4637; font-weight: 600; margin-bottom: 24px; }
.article h1 { font-size: clamp(30px, 4.4vw, 48px); line-height: 1.15; margin: 4px 0 18px; }
.article__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; color: #7a7a84; font-size: 15px; margin-bottom: 28px; }
.article__meta > span { display: inline-flex; align-items: center; gap: 6px; }
.article__content { margin-top: 36px; font-size: 18px; line-height: 1.75; color: #34343c; }
.article__content h2 { font-size: 26px; margin: 36px 0 12px; color: #1b1b20; }
.article__content p { margin-bottom: 16px; }
.article__content ul { padding-left: 22px; margin-bottom: 16px; display: grid; gap: 6px; }
.article__more { margin-top: 56px; padding-top: 32px; border-top: 1px solid #e6e2de; }
.article__more h2 { font-size: 26px; margin-bottom: 20px; }
.article__others { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.mini-card { display: grid; gap: 12px; padding: 12px; background: #fff; border-radius: 20px; }
.mini-card .cover { border-radius: 14px; padding: 20px; }
.mini-card .cover__title { font-size: 24px; }
.mini-card .cover__sub { display: none; }
.mini-card b { padding: 0 6px 6px; line-height: 1.35; }
.mini-card:hover b { color: #ef4637; }
.article__missing { text-align: center; padding: 60px 0; }
.article__missing p { color: #7a7a84; margin: 10px 0 24px; }

.page-hero { padding-top: 200px; }
.page-hero--small { padding-top: 180px; }

/* =====================================================================
   Responsive v2
   ===================================================================== */
@media (max-width: 1200px) {
  .nav__link { padding: 10px 8px; font-size: 15px; }
  .topbar__news span { display: none; }
}
@media (max-width: 1024px) {
  .topbar { display: none; }
  .burger { display: flex; }
  .nav {
    position: fixed; top: 76px; left: 0; right: 0; max-height: calc(100vh - 76px); overflow-y: auto;
    flex-direction: column; align-items: stretch; gap: 0; padding: 12px 20px 24px;
    background: #0a0a0c; border-bottom: 1px solid var(--line);
    transform: translateY(-110%); visibility: hidden; transition: transform .35s, visibility .35s;
  }
  .nav.open { transform: none; visibility: visible; }
  .header { background: rgba(10,10,12,.92); }
  .nav__link { width: 100%; justify-content: space-between; padding: 15px 4px; border-bottom: 1px solid var(--line); border-radius: 0; font-size: 17px; }
  .nav__link.active { box-shadow: none; color: var(--red-2); }
  .nav__link .nav__badge { margin-left: auto; margin-right: 8px; }
  .nav__item .dropdown {
    position: static; min-width: 0; box-shadow: none; border: 0; background: transparent; padding: 0;
    opacity: 1; visibility: visible; transform: none; display: none;
  }
  .nav__item.open .dropdown { display: block; padding: 6px 0; }
  .nav__mobile-only { display: grid; gap: 10px; margin-top: 20px; }
  .hero__stats { grid-template-columns: 1fr 1fr; margin-top: 56px; }
  .globe-section__inner, .dc-section__inner { grid-template-columns: 1fr; }
  .globe-wrap { max-width: 520px; order: -1; }
  .news-card, .news-card--rev { grid-template-columns: 1fr; }
  .news-card--rev .news-card__cover { order: 0; }
  .page-hero { padding-top: 140px; }
  .page-hero--small { padding-top: 120px; }
  .article-page { padding-top: 120px; }
}
@media (max-width: 640px) {
  .hero--photo { padding: 130px 0 48px; min-height: 0; }
  .hero__stats { grid-template-columns: 1fr; gap: 12px; margin-top: 40px; }
  .hstat { padding: 18px; }
  .plans { grid-template-columns: 1fr; }
  .plan { padding: 22px; }
  .plan__foot { flex-wrap: wrap; }
  .loc-list--stack, .dstats { grid-template-columns: 1fr; }
  .dc-gallery { aspect-ratio: auto; grid-template-rows: 220px 150px; }
  .news-card { padding: 12px; }
  .news-card__foot { gap: 12px; flex-wrap: wrap; }
  .cover { padding: 20px; }
  .cover__top { top: 14px; left: 16px; right: 14px; }
  .article__others { grid-template-columns: 1fr; }
  .fab { width: 50px; height: 50px; bottom: 16px; }
  .fab--left { left: 16px; }
  .fab--right { right: 16px; }
  .cookie-bar { left: 12px; right: 12px; bottom: 76px; }
}

/* Header opac pe paginile care încep cu fundal deschis */
body[data-header="solid"] .header { background: rgba(10,10,12,.96); border-color: var(--line); }

/* File de prețuri pe mobil: un singur rând, egale */
@media (max-width: 640px) {
  .pricing__controls .tabs { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; width: 100%; border-radius: 16px; }
  .pricing__controls .tab { padding: 10px 4px; font-size: 13px; line-height: 1.25; text-align: center; }
  .pricing__controls .tab small { display: block; margin: 2px 0 0; }
}

/* =====================================================================
   v3 – Fonturi titluri, hero cu panou, carduri hero
   ===================================================================== */
h1, h2, h3, .logo__text, .plan__name, .dstat strong, .hstat b, .cover__title {
  font-family: 'Outfit', 'Inter', system-ui, sans-serif;
}
h1, h2 { letter-spacing: -0.025em; }

/* Hero */
.hero2 { position: relative; overflow: hidden; padding: 190px 0 80px; background: #121419; }
.hero2__bg {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 50% 60% at 85% 35%, rgba(255,59,59,.16), transparent 70%),
    radial-gradient(ellipse 40% 50% at 5% 100%, rgba(255,106,61,.10), transparent 70%),
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px) 0 0 / 48px 48px,
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px) 0 0 / 48px 48px;
  mask-image: linear-gradient(180deg, #000 70%, transparent);
  -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent);
}
.hero2__inner { position: relative; display: grid; grid-template-columns: 1.12fr .88fr; gap: 64px; align-items: center; }
.hero2__kicker {
  display: inline-flex; align-items: center; gap: 8px; margin-bottom: 22px; padding: 7px 14px; border-radius: 999px;
  font-size: 13px; font-weight: 600; letter-spacing: .04em; color: #ff8a7a;
  background: rgba(255,59,59,.1); border: 1px solid rgba(255,59,59,.25);
}
.hero2 h1 { font-size: clamp(40px, 4.9vw, 70px); font-weight: 700; line-height: 1.04; letter-spacing: -.035em; color: #fff; }
.hero2__dot { color: var(--red); }
.hero2__lead { margin-top: 26px; max-width: 640px; font-size: 19px; line-height: 1.6; color: #b9bcc6; }
.checklist { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 28px; margin-top: 28px; max-width: 640px; }
.checklist li { position: relative; padding-left: 32px; font-size: 17px; font-weight: 500; color: #e8e9ee; }
.checklist li::before {
  content: ""; position: absolute; left: 0; top: 3px; width: 20px; height: 20px; border-radius: 6px;
  background: rgba(255,59,59,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff5a4a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/13px no-repeat;
}
.hero2__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 44px; }
.btn--xl { padding: 19px 34px; font-size: 17px; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; }
.btn--xl .icon { width: 20px; height: 20px; transition: transform .2s; }
.btn--xl:hover .icon { transform: translateX(4px); }
.btn--outline { border: 1.5px solid rgba(255,255,255,.18); color: #fff; }
.btn--outline:hover { border-color: var(--red); background: rgba(255,59,59,.08); }
.hero2--page { padding-bottom: 96px; }

/* Panoul */
.hero2__visual { position: relative; }
.hero2__visual::before {
  content: ""; position: absolute; inset: 10% -6% 0; border-radius: 40px; z-index: 0;
  background: radial-gradient(closest-side, rgba(255,59,59,.22), transparent); filter: blur(30px);
}
.panel {
  position: relative; z-index: 1; border-radius: 22px; overflow: hidden;
  background: linear-gradient(180deg, #23262e, #1c1e25); border: 1px solid rgba(255,255,255,.09);
  box-shadow: 0 40px 90px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.05);
  animation: panelIn .8s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes panelIn { from { opacity: 0; transform: translateY(24px) scale(.98); } }
.panel__bar { display: flex; align-items: center; gap: 18px; padding: 14px 18px; border-bottom: 1px solid rgba(255,255,255,.07); background: rgba(0,0,0,.12); }
.panel__bar .dots i { background: #4a4d57; }
.panel__bar .dots i:first-child { background: #4a4d57; }
.panel__url { flex: 1; padding: 6px 12px; border-radius: 8px; background: rgba(255,255,255,.06); font-family: ui-monospace, Consolas, monospace; font-size: 13px; color: #9a9da8; }
.panel__body { padding: 26px 28px 28px; }
.panel__status { display: flex; align-items: center; gap: 10px; font-size: 15px; color: #c9ccd4; }
.panel__status .dot { width: 9px; height: 9px; }
.panel__uptime { display: flex; align-items: baseline; gap: 6px; margin-top: 18px; }
.panel__uptime strong { font-family: 'Inter', sans-serif; font-size: 46px; font-weight: 700; letter-spacing: -.03em; line-height: 1; color: #fff; }
.panel__uptime em { font-style: normal; font-size: 22px; font-weight: 700; color: #2fd27a; }
.panel__muted { display: block; margin-top: 6px; color: #8d909b; font-size: 14px; }
.spark { display: block; width: 100%; height: 70px; margin: 14px 0 20px; overflow: visible; }
.spark__line { stroke-dasharray: 1; stroke-dashoffset: 1; animation: draw 1.8s .3s ease-out forwards; }
.spark__fill { opacity: 0; animation: fadeIn 1s 1.2s forwards; }
.spark__dot { opacity: 0; animation: fadeIn .4s 1.9s forwards, blinkDot 2s 2.3s infinite; }
@keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes fadeIn { to { opacity: 1; } }
@keyframes blinkDot { 50% { opacity: .35; } }
.panel__row { display: flex; align-items: center; gap: 10px; padding: 13px 16px; border-radius: 12px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07); font-size: 15px; color: #d6d8de; }
.panel__row .icon { color: var(--red); width: 18px; height: 18px; }
.panel__ddos {
  display: flex; align-items: center; gap: 14px; margin-top: 16px; padding: 16px; border-radius: 14px;
  background: linear-gradient(135deg, rgba(47,210,122,.12), rgba(47,210,122,.03)); border: 1px solid rgba(47,210,122,.3);
}
.panel__shield { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: rgba(255,255,255,.07); color: #fff; flex-shrink: 0; }
.panel__shield .icon { width: 22px; height: 22px; }
.panel__ddos b { display: flex; align-items: center; gap: 10px; font-size: 16px; color: #fff; }
.panel__ddos small { display: block; margin-top: 2px; color: #a5d9bd; font-size: 14px; }
.panel__live { font-size: 11px; font-weight: 700; letter-spacing: .06em; padding: 3px 8px; border-radius: 6px; background: rgba(47,210,122,.18); color: #2fd27a; }
.panel__bars { display: grid; gap: 18px; margin-top: 22px; }
.pbar__top { display: flex; justify-content: space-between; font-size: 15px; color: #e3e5ea; margin-bottom: 9px; }
.pbar__track { height: 7px; border-radius: 99px; background: rgba(255,255,255,.08); overflow: hidden; }
.pbar__fill { display: block; height: 100%; width: var(--v); border-radius: 99px; animation: grow 1.4s .4s ease-out both; }
.pbar__fill--green { background: linear-gradient(90deg, #1fb46a, #2fd27a); }
.pbar__fill--red { background: linear-gradient(90deg, #e2402f, #ff5a4a); }
.pbar__fill--blue { background: linear-gradient(90deg, #2563eb, #3d8bff); }

.panel-note {
  position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 22px;
  margin-top: 18px; padding: 14px 16px; border-radius: 16px; gap: 6px 16px; font-size: 14px !important;
  background: rgba(35,38,46,.7); border: 1px solid rgba(255,255,255,.08); font-size: 15px; color: #d6d8de;
}
.panel-note > span { display: inline-flex; align-items: center; gap: 8px; }
.panel-note .icon { color: #2fd27a; width: 18px; height: 18px; }
.panel-note__rating { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.panel-note__rating > span:last-child { color: #9a9da8; }
.stars { display: inline-flex; gap: 2px; }
.star { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 1.6; stroke-linejoin: round; }
.star--on { fill: #fff; }
.star--half { fill: rgba(255,255,255,.45); }

/* Carduri sub hero (reparat + aspect nou) */
.hero2 .hero__stats { margin-top: 72px; }
.hero__stats { gap: 18px; }
.hstat {
  position: relative; display: flex; align-items: center; gap: 16px; min-height: 112px; padding: 22px 24px; border-radius: 22px;
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(12px);
  transition: border-color .25s, transform .25s;
}
.hstat:hover { border-color: rgba(255,59,59,.45); transform: translateY(-3px); }
.hstat .hstat__icon {
  display: grid; place-items: center; width: 50px; height: 50px; margin: 0; border-radius: 14px; flex-shrink: 0;
  background: linear-gradient(135deg, rgba(255,59,59,.22), rgba(255,59,59,.06)); border: 1px solid rgba(255,59,59,.3); color: #ff6a5a;
}
.hstat .hstat__icon .icon { width: 24px; height: 24px; }
.hstat b { display: block; font-size: 20px; font-weight: 600; line-height: 1.2; color: #fff; }
.hstat div > a, .hstat div > span { display: inline-flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 15px; color: #ff6a5a; }
.hstat div > a { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.hstat div > a .icon { width: 16px; height: 16px; transition: transform .2s; }
.hstat div > a:hover .icon { transform: translateX(3px); }

@media (max-width: 1100px) {
  .hero2__inner { grid-template-columns: 1fr; gap: 48px; }
  .hero2__visual { max-width: 560px; }
}
@media (max-width: 1024px) {
  .hero2 { padding-top: 130px; }
}
@media (max-width: 640px) {
  .hero2 { padding: 110px 0 56px; }
  .hero2__lead { font-size: 17px; }
  .checklist { grid-template-columns: 1fr; gap: 12px; }
  .checklist li { font-size: 16px; }
  .hero2__cta .btn { width: 100%; }
  .btn--xl { padding: 17px 24px; font-size: 16px; }
  .panel__body { padding: 20px; }
  .panel__uptime strong { font-size: 38px; }
  .hero2 .hero__stats { margin-top: 40px; }
  .hstat { min-height: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .panel, .spark__line, .spark__fill, .spark__dot, .pbar__fill { animation: none; stroke-dashoffset: 0; opacity: 1; }
}

/* =====================================================================
   v4 – Glob din puncte
   ===================================================================== */
.globe-section { padding: 110px 0; background: radial-gradient(ellipse 60% 70% at 72% 55%, rgba(255,59,59,.18), transparent 70%), linear-gradient(180deg, #0a0a0c 0%, #1a0c0c 55%, #2a1110 100%); }
.globe-section__inner { grid-template-columns: .75fr 1.25fr; gap: 24px; }
.globe-wrap { width: 118%; max-width: 820px; margin-right: -12%; justify-self: end; touch-action: pan-y; }
#globe { contain: none; }
.loc-list--stack { grid-template-columns: 1fr; gap: 10px; max-width: 420px; }
.loc { padding: 12px 16px; border-color: rgba(255,255,255,.08); background: rgba(18,18,22,.65); }
.loc--main { border-color: rgba(255,59,59,.55); background: linear-gradient(90deg, rgba(255,59,59,.16), rgba(18,18,22,.65)); }
.loc__code { background: rgba(255,59,59,.12); border-color: rgba(255,59,59,.3); color: #ff7a6a; }
.loc__info b { display: flex; align-items: center; gap: 8px; }
.loc__country { color: var(--muted); font-size: 13px; }
.loc__tag { font-style: normal; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 6px; background: var(--red); color: #fff; }
.loc__info { flex: 1; display: grid; grid-template-columns: 1fr auto; column-gap: 12px; align-items: center; }
.loc__info b, .loc__country { grid-column: 1; }
.loc__status { grid-column: 2; grid-row: 1 / span 2; }
@media (max-width: 1024px) {
  .globe-section__inner { grid-template-columns: 1fr; gap: 32px; }
  .globe-wrap { width: 100%; margin: 0 auto; max-width: 600px; justify-self: center; }
  .loc-list--stack { max-width: none; grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .globe-section { padding: 64px 0; }
  .loc-list--stack { grid-template-columns: 1fr; }
}

/* =====================================================================
   v5 – Anti-DDoS lângă glob, plăți în footer, file de produse pe mobil
   ===================================================================== */
.ddos-card {
  margin-top: 18px; max-width: 420px; padding: 20px; border-radius: 18px;
  background: linear-gradient(135deg, rgba(255,59,59,.14), rgba(18,18,22,.75) 60%);
  border: 1px solid rgba(255,59,59,.35); backdrop-filter: blur(6px);
}
.ddos-card__head { display: flex; align-items: center; gap: 14px; }
.ddos-card__icon {
  width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; flex-shrink: 0;
  background: var(--grad); color: #fff; box-shadow: 0 8px 24px rgba(255,59,59,.35);
}
.ddos-card__icon .icon { width: 24px; height: 24px; }
.ddos-card__head b { display: block; font-family: 'Outfit', 'Inter', sans-serif; font-size: 18px; }
.ddos-card__live { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #4ade80; }
.ddos-card__live i { width: 7px; height: 7px; border-radius: 50%; background: #4ade80; animation: pulse 2s infinite; }
.ddos-card p { margin: 12px 0 16px; color: #c4c4cc; font-size: 14.5px; line-height: 1.55; }
.ddos-card__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.ddos-card__stats div { padding: 10px; border-radius: 12px; background: rgba(0,0,0,.3); border: 1px solid rgba(255,255,255,.06); text-align: center; }
.ddos-card__stats strong { display: block; font-size: 15px; font-weight: 800; color: #fff; white-space: nowrap; }
.ddos-card__stats small { display: block; margin-top: 2px; font-size: 11.5px; color: var(--muted); line-height: 1.3; }

.globe-badge {
  position: absolute; left: 50%; bottom: 7%; transform: translateX(-50%); z-index: 2;
  display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px; border-radius: 999px; white-space: nowrap;
  background: rgba(14,14,18,.82); border: 1px solid rgba(255,59,59,.4); backdrop-filter: blur(8px);
  font-size: 14px; font-weight: 600; color: #fff; box-shadow: 0 10px 30px rgba(0,0,0,.4);
}
.globe-badge__dot { width: 9px; height: 9px; border-radius: 50%; background: #4ade80; box-shadow: 0 0 0 0 rgba(74,222,128,.6); animation: pulse 2s infinite; }
.globe-wrap--fallback + .globe-badge, .globe-wrap--fallback .globe-badge { display: none; }

/* Plăți în footer */
.footer__pay {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px;
  width: calc(100% - 40px); max-width: 1160px; margin: 40px auto 0; padding: 18px 20px; border-radius: 16px; background: rgba(255,255,255,.03); border: 1px solid var(--line);
}
.footer__pay-title { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; color: #d8d8de; }
.footer__pay-title .icon { color: var(--red); }
.footer__pay-list { display: flex; flex-wrap: wrap; gap: 8px; }
.footer__pay-list span { padding: 7px 14px; border-radius: 10px; border: 1px solid var(--line); background: var(--bg); font-size: 13px; font-weight: 700; color: #c9c9d1; }
.footer__bottom { margin-top: 20px; }

/* File de produse pe mobil: derulare orizontală când sunt multe */
@media (max-width: 640px) {
  .pricing__controls [data-role="products"] {
    display: flex; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .pricing__controls [data-role="products"]::-webkit-scrollbar { display: none; }
  .pricing__controls [data-role="products"] .tab { flex: 0 0 auto; padding: 10px 14px; }
  .ddos-card, .loc-list--stack { max-width: none; }
  .globe-badge { font-size: 12.5px; padding: 8px 14px; bottom: 3%; }
  .footer__pay { flex-direction: column; align-items: flex-start; }
}

/* =====================================================================
   v6 – Footer aranjat
   ===================================================================== */
.footer { position: relative; padding-top: 72px; background: linear-gradient(180deg, #111115, #0b0b0e); border-top: 1px solid var(--line); }
.footer::before { content: ""; position: absolute; top: -1px; left: 50%; transform: translateX(-50%); width: min(600px, 80%); height: 1px; background: linear-gradient(90deg, transparent, rgba(255,59,59,.7), transparent); }
.footer__grid { grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 48px; padding-bottom: 48px; }
.footer__brand p { max-width: 340px; margin: 18px 0 24px; font-size: 15px; line-height: 1.65; color: var(--muted); }
.footer__col { display: flex; flex-direction: column; gap: 12px; }
.footer__col h4 { margin-bottom: 6px; font-family: "Outfit", "Inter", sans-serif; font-size: 16px; font-weight: 600; letter-spacing: .02em; color: #fff; }
.footer__col a { width: fit-content; font-size: 14.5px; color: var(--muted); transition: color .2s, transform .2s; }
.footer__col a:hover { color: #fff; transform: translateX(3px); }
.socials { display: flex; gap: 10px; }
.socials a { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; color: #d6d6dc; background: rgba(255,255,255,.04); border: 1px solid var(--line); transition: color .2s, background .2s, border-color .2s, transform .2s; }
.socials a:hover { color: #fff; background: var(--red); border-color: var(--red); transform: translateY(-2px); }
.socials svg { width: 19px; height: 19px; }
.footer__pay { width: auto; max-width: none; margin: 0; padding: 20px 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: none; }
.footer__bottom { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0; padding: 22px 0 28px; border-top: 1px solid var(--line); font-size: 13px; color: #7d7d88; }
.footer__legal { display: flex; gap: 18px; }
.footer__legal a { color: #9a9aa6; }
.footer__legal a:hover { color: var(--red-2); }
@media (max-width: 1024px) {
  .footer__grid { grid-template-columns: repeat(3, 1fr); gap: 36px 24px; }
  .footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .footer { padding-top: 52px; }
  .footer__grid { grid-template-columns: 1fr 1fr; }
  .footer__col:last-child { grid-column: 1 / -1; }
  .footer__bottom { flex-direction: column; align-items: flex-start; padding-bottom: 90px; }
}
.footer { padding-bottom: 72px; }
@media (max-width: 640px) { .footer { padding-bottom: 0; } }

/* =====================================================================
   v7 – Hero radio cu card trial
   ===================================================================== */
:root { --warm: #ff5a1f; --warm-2: #ff7a3d; }
.hero2--radio { background: radial-gradient(ellipse 60% 70% at 85% 40%, rgba(120,60,200,.16), transparent 70%), linear-gradient(135deg, #0f1220 0%, #131527 55%, #1a1328 100%); }
.hero2--radio .hero2__bg { opacity: .6; }
.hero2__inner--radio { grid-template-columns: 1.35fr .65fr; gap: 72px; }
.hero2__inner--single { grid-template-columns: 1fr; }

.rpills { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 26px; }
.rpill {
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 999px;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); font-size: 14px; font-weight: 600; color: #e8e8f0;
}
.rpill[hidden] { display: none; }
.rpill b { color: #4ade80; }
.rpill__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--warm); box-shadow: 0 0 10px var(--warm); }
.rpill__stars { display: inline-flex; gap: 2px; }
.rpill__stars svg { width: 17px; height: 17px; fill: none; stroke: #4ade80; stroke-width: 1.8; stroke-linejoin: round; }
.rpill__stars svg.on { fill: #4ade80; }
.rpill__stars svg.half { fill: rgba(74,222,128,.45); }
.rpill--trial { color: #4ade80; border-color: rgba(74,222,128,.3); background: rgba(74,222,128,.08); }

.hero2--radio h1 { font-size: clamp(38px, 4.6vw, 64px); line-height: 1.08; }
.grad-warm { background: linear-gradient(90deg, #ff7a4d, #ff5a1f); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero2--radio .hero2__lead { color: #d4d6e2; font-size: 18.5px; max-width: 680px; }
.checklist--warm { max-width: 560px; }
.checklist--warm li::before {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff5a1f' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 12.5l5 5L19.5 7'/%3E%3C/svg%3E") center/18px no-repeat;
}

.btn--warm { background: linear-gradient(90deg, #ff6a2b, #ff4d12); color: #fff; font-weight: 700; box-shadow: 0 10px 30px rgba(255,90,31,.35); }
.btn--warm:hover { transform: translateY(-2px); box-shadow: 0 14px 38px rgba(255,90,31,.5); }
.btn--warm-outline { border: 1.5px solid rgba(255,90,31,.5); color: #ff8a5c; }
.btn--warm-outline:hover { background: rgba(255,90,31,.1); border-color: var(--warm); }
.btn--block { width: 100%; }
.btn--warm .icon { width: 20px; height: 20px; }

/* Card trial */
.trial-card {
  position: relative; padding: 48px 36px 36px; border-radius: 18px; text-align: center;
  background: linear-gradient(180deg, rgba(22,20,40,.9), rgba(16,15,30,.95));
  border: 1px solid rgba(190,120,255,.45);
  box-shadow: 0 0 0 1px rgba(255,255,255,.02), 0 30px 80px rgba(0,0,0,.45), 0 0 60px rgba(150,80,255,.12);
  animation: panelIn .8s cubic-bezier(.2,.8,.2,1) both;
}
.trial-card h2 { font-size: clamp(28px, 2.6vw, 38px); font-weight: 700; color: #fff; }
.trial-card__text { margin: 14px auto 0; max-width: 340px; color: #a9abbd; font-size: 16px; line-height: 1.6; }
.trial-card__price { display: flex; justify-content: center; align-items: center; gap: 8px; margin: 34px 0 40px; }
.trial-card__price sup { align-self: flex-start; margin-top: 14px; font-size: 26px; font-weight: 600; color: #fff; }
.trial-card__price strong { font-family: 'Outfit', 'Inter', sans-serif; font-size: 84px; font-weight: 700; line-height: .9; color: #fff; }
.trial-card__price > span { color: #a9abbd; font-size: 17px; }
.trial-card__btn { padding: 18px 24px; font-size: 16px; text-transform: uppercase; letter-spacing: .01em; }
.trial-card__btn .icon { transition: transform .2s; }
.trial-card__btn:hover .icon { transform: translateX(4px); }
.trial-card__nocard { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 40px; font-size: 19px; color: #a9abbd; }
.trial-card__nocard svg { width: 22px; height: 22px; }
.trial-card__terms { margin-top: 8px; font-size: 14.5px; color: #c4c6d4; }
.trial-card__terms a { color: #fff; font-weight: 700; text-decoration: underline; }

@media (max-width: 1100px) {
  .hero2__inner--radio { grid-template-columns: 1fr; }
  .trial-card { max-width: 480px; }
}
@media (max-width: 640px) {
  .trial-card { padding: 36px 22px 28px; }
  .trial-card__price strong { font-size: 68px; }
  .trial-card__nocard { margin-top: 28px; font-size: 17px; }
}

/* Cardul trial plutește ușor sus-jos */
.trial-card { animation: panelIn .8s cubic-bezier(.2,.8,.2,1) both, floatY 4s ease-in-out .8s infinite; }
@keyframes floatY { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-16px); } }
.nav__item .dropdown { min-width: 350px; }
.dropdown__item b { white-space: nowrap; }
@media (max-width: 1024px) { .nav__item .dropdown { min-width: 0; } .dropdown__item b { white-space: normal; } }

/* =====================================================================
   v8 – Hero „Hosting Web SSD” cu ilustrație (pagina partajată)
   ===================================================================== */
.hero2--warm { background: radial-gradient(ellipse 55% 70% at 80% 45%, rgba(120,60,200,.18), transparent 70%), linear-gradient(135deg, #0f1220 0%, #131527 55%, #19132a 100%); }
.hero2--warm .hero2__bg { opacity: .55; }
.hero2--warm h1 { font-size: clamp(38px, 4.8vw, 66px); line-height: 1.08; }
.hero2--warm .hero2__lead { color: #d4d6e2; font-size: 18.5px; max-width: 640px; }
.hero2__inner--illu { grid-template-columns: 1fr 1.05fr; gap: 40px; }

/* Ilustrația */
.hx { position: relative; aspect-ratio: 1.12; width: 100%; max-width: 680px; justify-self: end; }
.hx__orbit { position: absolute; inset: 2% 6%; border-radius: 50%; border: 1.5px dashed rgba(255,255,255,.14); animation: spin 60s linear infinite; }
.hx__tri { position: absolute; width: 0; height: 0; border-style: solid; filter: drop-shadow(0 6px 14px rgba(0,0,0,.4)); }
.hx__tri--purple { top: 8%; left: 10%; border-width: 26px 46px 26px 0; border-color: transparent #8b5cf6 transparent transparent; animation: floatY 5s ease-in-out infinite; }
.hx__tri--orange { bottom: 2%; right: 4%; border-width: 24px 42px 24px 0; border-color: transparent #ff6b3d transparent transparent; animation: floatY 6s ease-in-out .8s infinite; }

.hx__browser {
  position: absolute; left: 8%; right: 2%; top: 17%; bottom: 10%;
  border-radius: 14px; overflow: hidden; background: #1c1b33;
  border: 2px solid rgba(160,140,255,.35); box-shadow: 0 30px 80px rgba(0,0,0,.5), 0 0 60px rgba(139,92,246,.15);
  display: flex; flex-direction: column;
}
.hx__bar { display: flex; align-items: center; gap: 6px; padding: 10px 14px; background: #24233f; }
.hx__bar i { width: 9px; height: 9px; border-radius: 50%; background: #ff5f57; }
.hx__bar i:nth-child(2) { background: #febc2e; }
.hx__bar i:nth-child(3) { background: #28c840; }
.hx__bar span { flex: 0 0 45%; height: 12px; margin-left: auto; margin-right: auto; border-radius: 6px; background: #14132a; }
.hx__site { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.hx__nav { display: flex; align-items: center; gap: 8%; padding: 4% 6% 0; background: linear-gradient(100deg, #2b1f5c, #6d3fb8 45%, #ff7a45); }
.hx__nav b { width: 14%; height: 5px; border-radius: 3px; background: #fff; margin-right: auto; }
.hx__nav span { width: 5%; height: 3px; border-radius: 2px; background: rgba(255,255,255,.75); }
.hx__nav em { width: 9%; height: 12px; border-radius: 99px; border: 1.5px solid rgba(255,255,255,.85); }
.hx__main {
  position: relative; display: grid; grid-template-columns: 1.05fr 1fr; gap: 6%; align-items: center;
  padding: 6% 6% 8%; background: linear-gradient(100deg, #2b1f5c, #6d3fb8 45%, #ff7a45);
}
.hx__copy strong { display: block; font-family: 'Outfit', 'Inter', sans-serif; font-size: clamp(12px, 1.35vw, 19px); line-height: 1.2; color: #fff; }
.hx__copy span { display: block; height: 4px; margin-top: 9px; border-radius: 2px; background: rgba(255,255,255,.45); width: 90%; }
.hx__copy .hx__short { width: 60%; }
.hx__cta { display: inline-block; margin-top: 14px; padding: 5px 12px; border-radius: 99px; background: linear-gradient(90deg, #a855f7, #ff7a45); font-style: normal; font-size: clamp(8px, .75vw, 11px); font-weight: 700; color: #fff; }
.hx__glass { padding: 10% 9%; border-radius: 10px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.25); backdrop-filter: blur(8px); }
.hx__dots { display: flex; gap: 4px; margin-bottom: 14%; }
.hx__dots i { width: 5px; height: 5px; border-radius: 50%; background: rgba(255,255,255,.6); }
.hx__glass span { display: block; height: 4px; margin-top: 8px; border-radius: 2px; background: rgba(255,255,255,.55); width: 80%; }
.hx__glass .hx__short { width: 50%; }
.hx__glass b { display: block; width: 32%; height: 10px; margin-top: 16%; border-radius: 6px; background: #1c1b33; }
.hx__mini {
  position: absolute; right: 3%; display: flex; align-items: center; gap: 8px; width: 30%; padding: 3% 4%;
  border-radius: 10px; background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.3); backdrop-filter: blur(10px);
  font-size: clamp(8px, .8vw, 12px); line-height: 1.15; color: #fff; box-shadow: 0 10px 24px rgba(0,0,0,.2);
}
.hx__mini svg { width: 26%; max-width: 26px; flex-shrink: 0; }
.hx__mini--ssl { top: 14%; }
.hx__mini--speed { top: 52%; }
.hx__cards { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 4%; padding: 5% 6% 6% 38%; background: #1c1b33; }
.hx__cards div { padding: 12% 10%; border-radius: 8px; background: #26254a; }
.hx__cards svg { width: 26%; margin-bottom: 14%; }
.hx__cards span { display: block; height: 3px; margin-top: 8px; border-radius: 2px; background: rgba(255,255,255,.25); width: 85%; }
.hx__cards .hx__short { width: 55%; }
.hx__cards i { display: block; width: 45%; height: 7px; margin-top: 14%; border-radius: 99px; background: linear-gradient(90deg, #a855f7, #ff7a45); }

.hx__pill {
  position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 12px; padding: 14px 24px; border-radius: 999px;
  background: rgba(40,38,58,.88); border: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(10px);
  font-family: 'Outfit', 'Inter', sans-serif; font-size: clamp(16px, 1.6vw, 24px); font-weight: 600; color: #f0eff6; white-space: nowrap;
  box-shadow: 0 18px 40px rgba(0,0,0,.45);
}
.hx__pill svg { width: 1.3em; height: 1.3em; }
.hx__pill--cpanel { top: 2%; right: 6%; animation: floatY 4.5s ease-in-out infinite; }
.hx__pill--ls { top: 56%; left: 0; color: #ffe066; animation: floatY 5s ease-in-out 1s infinite; box-shadow: 0 18px 40px rgba(0,0,0,.45), 0 0 30px rgba(168,85,247,.35); }
.hx__pill--ssl { bottom: 3%; right: 18%; animation: floatY 5.5s ease-in-out .5s infinite; }
.hx__pill--ssl { background: rgba(28,30,40,.92); }
.hx__pill--ssl { color: #e8e8f0; }

@media (max-width: 1100px) {
  .hero2__inner--illu { grid-template-columns: 1fr; }
  .hx { justify-self: center; max-width: 620px; }
}
@media (max-width: 640px) {
  .hx__pill { padding: 9px 14px; gap: 8px; }
  .hx__mini { display: none; }
  .hx__tri--purple { border-width: 16px 28px 16px 0; }
  .hx__tri--orange { border-width: 15px 26px 15px 0; }
}
.hero2__inner--illu .checklist { grid-template-columns: auto auto; justify-content: start; column-gap: 36px; max-width: none; }
@media (max-width: 640px) { .hero2__inner--illu .checklist { grid-template-columns: 1fr; } }

/* =====================================================================
   v9 – Ilustrația WordPress (pagina wordpress.html)
   ===================================================================== */
.hx--wp .hx__browser { left: 6%; right: 6%; top: 16%; bottom: 12%; background: #17152b; border-color: rgba(160,140,255,.3); }
.hx__bar--dim { background: #1d1b35; }
.hx__bar--dim i { background: #4a4766 !important; }
.wps { flex: 1; display: flex; flex-direction: column; min-height: 0; background: radial-gradient(ellipse at 50% 30%, #2a2050, #17152b 70%); }
.wps__nav { display: flex; align-items: center; gap: 3.5%; padding: 3.5% 5%; font-size: clamp(6px, .62vw, 9px); font-weight: 600; color: #d8d6ee; white-space: nowrap; }
.wps__nav b { width: 4.5%; aspect-ratio: 1; border-radius: 50%; background: linear-gradient(135deg, #c084fc, #f472b6); margin-right: auto; }
.wps__login { margin-left: 4%; }
.wps__nav em { font-style: normal; padding: 3px 8px; border-radius: 4px; background: linear-gradient(90deg, #a855f7, #ec4899); color: #fff; }
.wps__hero { flex: 1; display: flex; flex-direction: column; align-items: center; padding: 2% 6% 0; text-align: center; }
.wps__hero strong { font-family: 'Outfit', 'Inter', sans-serif; font-size: clamp(11px, 1.4vw, 20px); font-weight: 700; line-height: 1.2; letter-spacing: .02em; color: #fff; padding-left: 14%; }
.wps__hero strong span { color: #ff7a45; }
.wps__hero small { margin-top: 3%; padding-left: 14%; font-size: clamp(7px, .85vw, 12px); font-weight: 700; letter-spacing: .08em; color: #a9a6c6; }
.wps__media {
  position: relative; display: grid; place-items: center; width: 40%; aspect-ratio: 1.75; margin-top: 4%;
  border-radius: 6px; background: linear-gradient(180deg, #3a3560, #2a2648); border: 1px solid rgba(255,255,255,.08);
}
.wps__media svg { width: 30%; }
.wps__media i {
  position: absolute; bottom: -10%; left: 50%; transform: translateX(-50%); white-space: nowrap;
  padding: 5px 12px; border-radius: 99px; background: linear-gradient(90deg, #ff6a2b, #ec4899);
  font-style: normal; font-size: clamp(6px, .6vw, 9px); font-weight: 700; letter-spacing: .06em; color: #fff;
  box-shadow: 0 6px 18px rgba(255,90,60,.4);
}
.wps__tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3%; padding: 6% 10% 0; }
.wps__tabs div { padding: 8% 8% 10%; border-radius: 6px 6px 0 0; background: #24213f; font-size: clamp(6px, .66vw, 10px); font-weight: 700; letter-spacing: .05em; color: #d8d6ee; }
.wps__tabs span { display: block; height: 3px; margin-top: 9%; border-radius: 2px; background: rgba(255,255,255,.2); width: 85%; }
.wps__tabs .hx__short { width: 55%; }

.hx__wplogo {
  position: absolute; z-index: 2; top: 25%; left: 1%; width: 19%; aspect-ratio: 1; display: grid; place-items: center;
  border-radius: 18%; background: rgba(48,46,70,.92); border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 18px 40px rgba(0,0,0,.45); animation: floatY 5s ease-in-out .3s infinite;
}
.hx__wplogo svg { width: 76%; }
.hx__pill--ls-wp { top: 58%; left: -1%; }
.hx__pill--ssl-wp { top: 54%; bottom: auto; right: -1%; }
.hx--wp .hx__tri--purple { top: 7%; left: 8%; }
.hx--wp .hx__tri--orange { bottom: 4%; right: 10%; }

@media (max-width: 640px) {
  .wps__nav span:not(.wps__login) { display: none; }
  .hx__wplogo { width: 17%; }
}

/* =====================================================================
   v10 – Ilustrația Business (pagina business.html)
   ===================================================================== */
.checklist--circle li::before {
  width: 20px; height: 20px; border-radius: 50%; top: 3px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff5a1f' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='m8 12.3 2.8 2.8L16.2 9.6'/%3E%3C/svg%3E") center/20px no-repeat;
}
.biz { position: relative; width: 100%; max-width: 680px; justify-self: end; }
.biz__svg { display: block; width: 100%; height: auto; overflow: visible; }
.biz__card { transform-box: fill-box; transform-origin: center; filter: drop-shadow(0 12px 22px rgba(0,0,0,.35)); }
.biz__card--1 { animation: floatY 5s ease-in-out infinite; }
.biz__card--2 { animation: floatY 6s ease-in-out .7s infinite; }
.biz__card--3 { animation: floatY 5.5s ease-in-out 1.4s infinite; }
.biz__cart {
  position: absolute; left: 1%; top: 36%; width: 17%; aspect-ratio: 1; display: grid; place-items: center;
  border-radius: 20%; background: linear-gradient(145deg, rgba(90,90,120,.85), rgba(45,45,70,.9));
  border: 1px solid rgba(255,255,255,.16); backdrop-filter: blur(8px);
  box-shadow: 0 18px 40px rgba(0,0,0,.45); animation: floatY 4.5s ease-in-out .3s infinite;
}
.biz__cart svg { width: 62%; }
@media (max-width: 1100px) { .biz { justify-self: center; max-width: 600px; } }

/* =====================================================================
   v11 – Logo imagine (header + footer)
   ===================================================================== */
.logo--img { display: inline-flex; align-items: center; flex-shrink: 0; transition: opacity .2s, transform .2s; }
.logo--img:hover { opacity: .9; transform: translateY(-1px); }
.logo--img img { display: block; width: auto; height: 46px; }
.header.scrolled .logo--header img { height: 40px; }
.logo--header img { transition: height .3s; }
.logo--footer img { height: 64px; }
.footer__brand { display: flex; flex-direction: column; align-items: flex-start; }
.footer__brand p { margin-top: 22px; }
@media (max-width: 1024px) { .logo--header img, .header.scrolled .logo--header img { height: 38px; } }
@media (max-width: 640px) { .logo--header img, .header.scrolled .logo--header img { height: 34px; } .logo--footer img { height: 54px; } }

/* Logo mai mare în bara de meniu */
.header__inner { height: 88px; }
.logo--header img { height: 62px; }
.header.scrolled .logo--header img { height: 54px; }
@media (max-width: 1024px) { .header__inner { height: 76px; } .nav { top: 76px; } .logo--header img, .header.scrolled .logo--header img { height: 52px; } }
@media (max-width: 640px) { .logo--header img, .header.scrolled .logo--header img { height: 46px; } }

/* =====================================================================
   v12 – Panoul „VPS OVERVIEW” (pagina vps.html)
   ===================================================================== */
.hero2__inner--vps { grid-template-columns: 1.25fr .75fr; }
.vpo {
  width: 100%; max-width: 500px; justify-self: end; border-radius: 16px; overflow: hidden;
  background: linear-gradient(180deg, rgba(20,20,34,.95), rgba(14,14,24,.97));
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: 0 30px 80px rgba(0,0,0,.5), 0 0 60px rgba(120,60,200,.1);
  animation: panelIn .8s cubic-bezier(.2,.8,.2,1) both, floatY 5s ease-in-out .8s infinite;
}
.vpo__head { display: flex; justify-content: space-between; align-items: center; padding: 28px 26px; border-bottom: 1px solid rgba(255,255,255,.08); }
.vpo__title { display: inline-flex; align-items: center; gap: 12px; font-family: 'Outfit', 'Inter', sans-serif; font-size: 17px; font-weight: 700; letter-spacing: .08em; color: #fff; }
.vpo__title svg { width: 20px; height: 20px; }
.vpo__live { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; letter-spacing: .06em; color: #8d90a3; }
.vpo__live i { width: 12px; height: 12px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 4px rgba(34,197,94,.18), 0 0 12px #22c55e; animation: pulse 2s infinite; }
.vpo__body { display: grid; gap: 14px; padding: 26px; }
.vpo__row {
  display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 18px 22px; border-radius: 12px;
  background: rgba(255,255,255,.025); border: 1px solid rgba(255,255,255,.08);
}
.vpo__row > span, .vpo__line > span { font-size: 13px; font-weight: 700; letter-spacing: .05em; color: #8d90a3; white-space: nowrap; }
.vpo__row b { font-size: 16px; font-weight: 600; color: #fff; white-space: nowrap; }
.vpo__mono { font-family: ui-monospace, Consolas, monospace; letter-spacing: .1em; }
.vpo__online { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 999px; border: 1px solid rgba(34,197,94,.5); background: rgba(34,197,94,.08); color: #22c55e !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: .04em; }
.vpo__online svg { width: 16px; height: 16px; }
.vpo__row--bar { display: block; }
.vpo__line { display: flex; justify-content: space-between; align-items: center; }
.vpo__track { height: 4px; margin-top: 14px; border-radius: 99px; background: rgba(255,255,255,.08); overflow: hidden; }
.vpo__track i { display: block; height: 100%; width: 98%; border-radius: 99px; background: linear-gradient(90deg, #7c3aed, #3b82f6 45%, #22c55e); animation: grow 1.6s .4s ease-out both; }
.vpo__os { display: inline-flex; align-items: center; gap: 8px; }
.vpo__os svg { width: 22px; height: 22px; }
.vpo__loc { display: inline-flex; align-items: center; gap: 10px; }
.vpo__flag { display: inline-flex; width: 30px; height: 20px; border-radius: 3px; overflow: hidden; }
.vpo__flag i { flex: 1; }
.vpo__flag i:nth-child(1) { background: #002b7f; }
.vpo__flag i:nth-child(2) { background: #fcd116; }
.vpo__flag i:nth-child(3) { background: #ce1126; }
.vpo__signal { display: inline-flex; align-items: flex-end; gap: 2px; height: 14px; margin-left: 4px; }
.vpo__signal i { width: 3px; border-radius: 1px; background: #22c55e; animation: sig 1.4s ease-in-out infinite; }
.vpo__signal i:nth-child(1) { height: 35%; }
.vpo__signal i:nth-child(2) { height: 60%; animation-delay: .2s; }
.vpo__signal i:nth-child(3) { height: 85%; animation-delay: .4s; }
.vpo__signal i:nth-child(4) { height: 50%; animation-delay: .6s; }
@keyframes sig { 50% { opacity: .35; } }

@media (max-width: 1100px) { .hero2__inner--vps { grid-template-columns: 1fr; } .vpo { justify-self: center; } }
@media (max-width: 640px) {
  .vpo__head { padding: 20px 18px; }
  .vpo__body { padding: 18px; gap: 10px; }
  .vpo__row { padding: 14px 16px; }
  .vpo__row b { font-size: 14px; }
  .vpo__live { font-size: 11px; }
}
.hero2__inner--vps { grid-template-columns: 1.45fr .8fr; gap: 48px; }
.hero2__inner--vps h1 { font-size: clamp(36px, 4.3vw, 60px); }
@media (max-width: 1100px) { .hero2__inner--vps { grid-template-columns: 1fr; } }

/* Titlu pe 2 rânduri (pagina WordPress) */
.hero2__inner--wp { grid-template-columns: 1.15fr .95fr; }
.h1-2rows { font-size: clamp(32px, 3.9vw, 56px) !important; }
.h1-2rows span { white-space: nowrap; }
@media (max-width: 1100px) { .hero2__inner--wp { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .h1-2rows span { white-space: normal; } }

/* =====================================================================
   v13 – Hero Contact cu ilustrație de chat
   ===================================================================== */
.hero2--contact { background: radial-gradient(ellipse 60% 80% at 75% 40%, rgba(150,60,170,.22), transparent 70%), linear-gradient(120deg, #1a1430 0%, #2a1834 55%, #1d1528 100%); }
.hero2--contact h1 { font-size: clamp(40px, 5vw, 72px); }

.cx { position: relative; width: 100%; max-width: 560px; aspect-ratio: 1 / .95; justify-self: center; }
.cx__orbit { position: absolute; inset: 0 4%; border-radius: 50%; border: 1.5px dashed rgba(255,255,255,.14); animation: spin 70s linear infinite; }
.cx__tri1 { top: 4% !important; left: 6% !important; }
.cx__tri2 { bottom: 6% !important; right: 2% !important; }

.cx__chat {
  position: absolute; left: 14%; right: 14%; top: 10%; bottom: 8%; display: flex; flex-direction: column; overflow: hidden;
  border-radius: 22px; background: linear-gradient(180deg, #221d38, #1a1630);
  border: 1px solid rgba(190,140,255,.3); box-shadow: 0 30px 80px rgba(0,0,0,.5), 0 0 60px rgba(160,80,255,.12);
  animation: panelIn .8s cubic-bezier(.2,.8,.2,1) both;
}
.cx__head { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-bottom: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); }
.cx__avatar { position: relative; width: 46px; height: 46px; flex-shrink: 0; }
.cx__avatar svg { width: 100%; height: 100%; border-radius: 50%; }
.cx__avatar i { position: absolute; right: 0; bottom: 1px; width: 12px; height: 12px; border-radius: 50%; background: #22c55e; border: 2px solid #221d38; }
.cx__head b { display: block; font-family: 'Outfit', 'Inter', sans-serif; font-size: 16px; color: #fff; }
.cx__head small { color: #4ade80; font-size: 12.5px; }
.cx__msgs { flex: 1; display: flex; flex-direction: column; gap: 10px; padding: 18px; overflow: hidden; }
.cx__msg { max-width: 82%; padding: 10px 14px; border-radius: 16px; font-size: 13.5px; line-height: 1.45; opacity: 0; animation: msgIn .5s ease-out forwards; }
.cx__msg--in { align-self: flex-start; background: rgba(255,255,255,.08); color: #e6e4f0; border-bottom-left-radius: 4px; }
.cx__msg--out { align-self: flex-end; background: linear-gradient(135deg, #ff6a2b, #ff4d12); color: #fff; border-bottom-right-radius: 4px; }
.cx__msg:nth-child(1) { animation-delay: .5s; }
.cx__msg:nth-child(2) { animation-delay: 1.3s; }
.cx__msg:nth-child(3) { animation-delay: 2.1s; }
@keyframes msgIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.cx__typing { align-self: flex-end; display: inline-flex; gap: 4px; padding: 10px 14px; border-radius: 16px; background: rgba(255,90,31,.15); opacity: 0; animation: msgIn .4s 2.8s forwards; }
.cx__typing i { width: 6px; height: 6px; border-radius: 50%; background: #ff8a5c; animation: dot 1.2s infinite; }
.cx__typing i:nth-child(2) { animation-delay: .15s; }
.cx__typing i:nth-child(3) { animation-delay: .3s; }
@keyframes dot { 0%, 60%, 100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-4px); opacity: 1; } }
.cx__input { display: flex; align-items: center; gap: 10px; margin: 0 14px 14px; padding: 8px 8px 8px 16px; border-radius: 14px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.08); }
.cx__input span { flex: 1; color: #8d8aa3; font-size: 13px; }
.cx__input b { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: linear-gradient(135deg, #ff6a2b, #ff4d12); }
.cx__input svg { width: 16px; height: 16px; }

.cx__pill {
  position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 12px; padding: 12px 18px 12px 12px; border-radius: 18px;
  background: rgba(36,32,56,.92); border: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(10px);
  box-shadow: 0 18px 40px rgba(0,0,0,.45); white-space: nowrap;
}
.cx__pill b { display: block; font-family: 'Outfit', 'Inter', sans-serif; font-size: 16px; color: #fff; }
.cx__pill small { display: block; font-size: 12px; color: #a9a6c6; }
.cx__ico { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; flex-shrink: 0; }
.cx__ico svg { width: 22px; height: 22px; }
.cx__ico--mail { background: linear-gradient(135deg, #ff6a2b, #ff4d12); }
.cx__ico--wa { background: #25d366; }
.cx__ico--ticket { background: #22c55e; }
.cx__pill--mail { top: 2%; right: 0; animation: floatY 4.5s ease-in-out infinite; }
.cx__pill--wa { top: 44%; left: -4%; animation: floatY 5s ease-in-out .8s infinite; }
.cx__pill--ticket { bottom: 2%; right: 4%; animation: floatY 5.5s ease-in-out 1.5s infinite; }

@media (max-width: 1100px) { .cx { max-width: 520px; } }
@media (max-width: 640px) {
  .cx { aspect-ratio: 1 / 1.15; }
  .cx__chat { left: 4%; right: 4%; top: 12%; bottom: 12%; }
  .cx__pill { padding: 8px 12px 8px 8px; gap: 8px; }
  .cx__ico { width: 34px; height: 34px; }
  .cx__pill b { font-size: 14px; }
  .cx__pill--wa { left: -2%; top: 46%; }
  .hero2--contact .hero2__cta .btn { width: 100%; }
}
.hero2--contact + .contact { padding-top: 96px; }
.hero2__inner--contact { grid-template-columns: 1.25fr .85fr; gap: 32px; }
.hero2--contact .hero2__cta { gap: 12px; flex-wrap: wrap; }
.hero2--contact .hero2__cta .btn { padding: 14px 22px; font-size: 15px; }
@media (max-width: 1100px) { .hero2__inner--contact { grid-template-columns: 1fr; } }

/* =====================================================================
   v14 – Footer: logo-uri de plată + insigne ANPC (SAL / SOL)
   ===================================================================== */
.footer__trust {
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 24px 40px;
  padding: 26px 0; border-top: 1px solid var(--line);
}
.footer__trust .footer__pay { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; padding: 0; border: 0; }
.paylogos { display: flex; flex-wrap: wrap; gap: 10px; }
.paylogo {
  width: 86px; height: 52px; padding: 6px 10px; border-radius: 10px; display: grid; place-items: center;
  background: #fff; box-shadow: 0 0 0 5px rgba(255,255,255,.04), 0 6px 16px rgba(0,0,0,.35);
  transition: transform .2s;
}
.paylogo:hover { transform: translateY(-3px); }
.paylogo svg { width: 100%; height: 100%; }
.paylogo--text { width: auto; color: #1d2a6b; font-size: 12px; font-weight: 800; }

.footer__anpc { display: flex; flex-wrap: wrap; gap: 12px; }
.anpc {
  display: flex; align-items: stretch; height: 56px; border-radius: 12px; overflow: hidden;
  background: #fff; border: 2px solid #1d3a8a; color: #1d3a8a; text-decoration: none;
  box-shadow: 0 6px 16px rgba(0,0,0,.3); transition: transform .2s;
}
.anpc:hover { transform: translateY(-3px); }
.anpc__brand { display: flex; align-items: center; gap: 6px; padding: 0 10px; border-right: 2px solid #1d3a8a; }
.anpc__brand svg { width: 24px; height: 24px; }
.anpc__brand span { display: flex; flex-direction: column; line-height: 1; }
.anpc__brand b { font-size: 14px; font-weight: 900; letter-spacing: .02em; color: #1d3a8a; }
.anpc__brand em { margin-top: 3px; font-family: 'Brush Script MT', 'Segoe Script', cursive; font-size: 11px; color: #d12b2b; }
.anpc__txt { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 0 14px; text-align: center; }
.anpc__txt b { max-width: 170px; font-size: 10.5px; font-weight: 800; line-height: 1.15; text-transform: uppercase; color: #1d3a8a; }
.anpc__txt--solo b { max-width: 190px; font-size: 12px; }
.anpc__txt i { padding: 2px 10px; border-radius: 99px; background: #1d3a8a; font-style: normal; font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #fff; }

@media (max-width: 1024px) { .footer__trust { flex-direction: column; align-items: flex-start; } }
@media (max-width: 640px) {
  .paylogo { width: 72px; height: 46px; }
  .footer__anpc { flex-direction: column; width: 100%; }
  .anpc { width: 100%; max-width: 340px; }
  .anpc__txt { flex: 1; }
}

/* Logo-uri plată și insigne ANPC mai mici */
.paylogos { gap: 8px; }
.paylogo { width: 62px; height: 38px; padding: 4px 7px; border-radius: 7px; box-shadow: 0 4px 10px rgba(0,0,0,.3); }
.footer__trust .footer__pay { gap: 10px; }
.footer__pay-title { font-size: 13px; }
.anpc { height: 44px; border-radius: 9px; border-width: 1.5px; }
.anpc__brand { padding: 0 8px; gap: 5px; border-right-width: 1.5px; }
.anpc__brand svg { width: 18px; height: 18px; }
.anpc__brand b { font-size: 11.5px; }
.anpc__brand em { font-size: 9px; margin-top: 2px; }
.anpc__txt { padding: 0 10px; gap: 3px; }
.anpc__txt b { max-width: 140px; font-size: 8.5px; }
.anpc__txt--solo b { max-width: 150px; font-size: 9.5px; }
.anpc__txt i { padding: 1px 8px; font-size: 7.5px; }
@media (max-width: 640px) { .paylogo { width: 58px; height: 36px; } .anpc { max-width: 280px; } }

/* Butonul „Protecție Anti-DDoS” care pulsează (footer) */
.footer__anpc { align-items: center; }
.ddos-btn {
  display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0 22px; border-radius: 999px;
  background: linear-gradient(90deg, #ff3b1f, #c8180f); color: #fff; font-size: 15px; font-weight: 700; white-space: nowrap;
  box-shadow: 0 0 0 0 rgba(255,59,31,.6); animation: ddosPulse 2s ease-out infinite; transition: transform .2s, filter .2s;
}
.ddos-btn svg { width: 18px; height: 18px; flex-shrink: 0; }
.ddos-btn:hover { transform: translateY(-2px) scale(1.03); filter: brightness(1.08); }
@keyframes ddosPulse {
  0% { box-shadow: 0 0 0 0 rgba(255,59,31,.65), 0 8px 22px rgba(255,40,20,.35); }
  70% { box-shadow: 0 0 0 14px rgba(255,59,31,0), 0 8px 22px rgba(255,40,20,.35); }
  100% { box-shadow: 0 0 0 0 rgba(255,59,31,0), 0 8px 22px rgba(255,40,20,.35); }
}
@media (max-width: 640px) { .ddos-btn { width: 100%; max-width: 280px; justify-content: center; } }

/* Insigne ANPC și buton Anti-DDoS și mai mici */
.footer__anpc { gap: 10px; }
.anpc { height: 36px; border-radius: 8px; }
.anpc__brand { padding: 0 7px; gap: 4px; }
.anpc__brand svg { width: 15px; height: 15px; }
.anpc__brand b { font-size: 9.5px; }
.anpc__brand em { font-size: 7.5px; margin-top: 1px; }
.anpc__txt { padding: 0 8px; gap: 2px; }
.anpc__txt b { max-width: 118px; font-size: 7px; }
.anpc__txt--solo b { max-width: 120px; font-size: 7.8px; }
.anpc__txt i { padding: 0 6px; font-size: 6.5px; }
.ddos-btn { height: 36px; padding: 0 16px; gap: 7px; font-size: 13px; }
.ddos-btn svg { width: 15px; height: 15px; }
@media (max-width: 640px) { .anpc { max-width: 240px; } .ddos-btn { max-width: 240px; } }

/* =====================================================================
   v15 – Parteneri Protecție Anti-DDoS
   ===================================================================== */
.partners { padding: 72px 0 80px; background: #0b0f1a; }
.partners__title { text-align: center; font-size: clamp(28px, 3.6vw, 46px); font-weight: 700; color: #fff; margin-bottom: 44px; }
.partners__title span { position: relative; display: inline-block; color: #ffc107; }
.partners__title span svg { position: absolute; left: 0; right: 0; bottom: -14px; width: 100%; height: 14px; color: #ffc107; }
.partners__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 22px; }
.partner {
  display: grid; place-items: center; aspect-ratio: 1.75; padding: 18px; border-radius: 8px;
  background: #c4c5c9; color: #3a3b40; filter: grayscale(1);
  box-shadow: 0 10px 26px rgba(0,0,0,.35); transition: transform .25s, background .25s, filter .25s;
}
.partner:hover { transform: translateY(-4px); background: #d6d7db; filter: grayscale(0); }
.partner img { max-width: 85%; max-height: 70%; object-fit: contain; }

/* Variante text pentru logo-uri (până se pun logo-urile oficiale) */
.pw { display: inline-flex; align-items: center; gap: 10px; font-family: 'Outfit', 'Inter', sans-serif; color: #3a3b40; white-space: nowrap; }
.pw--gcore { font-size: clamp(22px, 2.3vw, 34px); font-weight: 800; letter-spacing: .02em; }
.pw--gcore i { display: grid; place-items: center; width: 1.35em; height: 1.35em; border-radius: 50%; background: #3a3b40; color: #c4c5c9; font-style: normal; font-size: .9em; }
.pw--corero { flex-direction: column; gap: 6px; }
.pw--corero b { font-family: 'Inter', sans-serif; font-size: clamp(24px, 2.6vw, 38px); font-weight: 300; letter-spacing: .01em; }
.pw--corero small { font-size: clamp(6px, .55vw, 8px); font-weight: 700; letter-spacing: .08em; }
.pw--dataforest { gap: 4px; font-size: clamp(14px, 1.4vw, 20px); font-weight: 700; }
.pw--dataforest i { display: inline-flex; align-items: center; font-style: normal; font-weight: 700; }
.pw--dataforest i svg { width: .7em; height: .95em; fill: #3a3b40; margin: 0 1px; }
.pw--sucuri { font-size: clamp(20px, 2.2vw, 32px); font-weight: 900; letter-spacing: .04em; }
.pw--sucuri svg { width: 1.3em; height: 1.3em; fill: #3a3b40; }
.pw--equinix { flex-direction: column; gap: 10px; }
.pw--equinix svg { width: clamp(46px, 4.6vw, 66px); fill: #3a3b40; }
.pw--equinix b { font-family: 'Inter', sans-serif; font-size: clamp(14px, 1.5vw, 22px); font-weight: 500; letter-spacing: .45em; margin-right: -.45em; }

@media (max-width: 1024px) { .partners__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) {
  .partners { padding: 56px 0 64px; }
  .partners__grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .partner { padding: 12px; }
}
.partners + .cta { background: #0b0f1a; }

/* =====================================================================
   v16 – Fundal colorat pentru „Parteneri Protecție Anti-DDoS”
   ===================================================================== */
.partners {
  position: relative; overflow: hidden; isolation: isolate;
  background: linear-gradient(120deg, #ff6a2b 0%, #ff3b3b 28%, #e0246f 55%, #8a2be2 82%, #5b2bd6 100%);
  background-size: 220% 220%;
  animation: partnersBg 16s ease-in-out infinite;
}
@keyframes partnersBg { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }

/* Pete de lumină care plutesc */
.partners::before, .partners::after {
  content: ""; position: absolute; z-index: -1; border-radius: 50%; filter: blur(70px); pointer-events: none;
}
.partners::before { width: 460px; height: 460px; top: -180px; left: -120px; background: rgba(255,214,90,.55); animation: blobA 14s ease-in-out infinite; }
.partners::after { width: 520px; height: 520px; bottom: -240px; right: -140px; background: rgba(80,120,255,.55); animation: blobB 18s ease-in-out infinite; }
@keyframes blobA { 50% { transform: translate(120px, 60px) scale(1.1); } }
@keyframes blobB { 50% { transform: translate(-140px, -40px) scale(1.15); } }

/* Model fin de puncte */
.partners > .container { position: relative; }
.partners > .container::before {
  content: ""; position: absolute; inset: -72px -50vw -80px; z-index: -1; pointer-events: none;
  background-image: radial-gradient(rgba(255,255,255,.18) 1.2px, transparent 1.2px);
  background-size: 22px 22px;
  mask-image: radial-gradient(ellipse at center, #000 30%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 75%);
}

.partners__title { color: #fff; text-shadow: 0 4px 24px rgba(0,0,0,.25); }
.partners__title span, .partners__title span svg { color: #ffe14d; }

/* Carduri albe pe fundalul colorat */
.partner {
  background: rgba(255,255,255,.94); border: 1px solid rgba(255,255,255,.7);
  box-shadow: 0 14px 34px rgba(60,10,60,.28); filter: none;
}
.partner:hover { background: #fff; transform: translateY(-6px); box-shadow: 0 20px 44px rgba(60,10,60,.36); }
.partner .pw, .partner .pw svg, .partner .pw i svg { color: #2b2d36; fill: #2b2d36; }
.partner .pw--gcore i { background: #2b2d36; color: #fff; }


/* =====================================================================
   v17 – Pagina Anti-DDoS
   ===================================================================== */
/* Hero */
.dd-hero { background: radial-gradient(ellipse 50% 70% at 82% 40%, rgba(255,40,60,.16), transparent 70%), linear-gradient(135deg, #0f1220 0%, #161426 55%, #24122a 100%); padding-bottom: 64px; }
.dd-hero__inner { grid-template-columns: 1.15fr .85fr; gap: 48px; }
.dd-hero .rpill .icon { width: 16px; height: 16px; }
.dd-hero__title { font-size: clamp(44px, 6vw, 86px) !important; font-weight: 800; line-height: 1 !important; letter-spacing: -.02em; }
.dd-hero__title span { color: #ff3b1f; }
.dd-hero__title b { font-weight: 800; }
.dd-hero__stats { display: flex; flex-wrap: wrap; gap: 14px 28px; margin-top: 34px; padding-top: 26px; border-top: 1px solid rgba(255,255,255,.1); }
.dd-hero__stats span { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: #e3e4ec; }
.dd-hero__stats svg { width: 20px; height: 20px; }
.dd-hero__note { display: flex; gap: 12px; margin-top: 44px; max-width: 820px; font-size: 16px; line-height: 1.65; color: #dadbe4; }
.dd-hero__note svg { width: 20px; height: 20px; flex-shrink: 0; margin-top: 3px; color: #c4c5d0; }
.dd-hero__note span { color: #ff4d2e; }

.dd-shield { position: relative; width: 100%; max-width: 440px; aspect-ratio: 1; justify-self: center; }
.dd-shield__grid { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .7; }
.dd-shield__streaks { position: absolute; inset: 0; width: 100%; height: 100%; }
.dd-shield__streaks .st { stroke-dasharray: 60; animation: streak 2.4s ease-in infinite; opacity: 0; }
.dd-shield__streaks .st2 { animation-delay: .3s; } .dd-shield__streaks .st3 { animation-delay: .6s; }
.dd-shield__streaks .st4 { animation-delay: .9s; } .dd-shield__streaks .st5 { animation-delay: 1.2s; }
.dd-shield__streaks .st6 { animation-delay: 1.5s; } .dd-shield__streaks .st7 { animation-delay: 1.8s; }
.dd-shield__streaks .st8 { animation-delay: 2.1s; }
@keyframes streak { 0% { stroke-dashoffset: 60; opacity: 0; } 20% { opacity: 1; } 70% { stroke-dashoffset: 0; opacity: 1; } 100% { stroke-dashoffset: -60; opacity: 0; } }
.dd-shield__ring { position: absolute; inset: 22%; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.08), transparent 70%); box-shadow: 0 0 0 1px rgba(255,255,255,.06), 0 0 0 40px rgba(255,255,255,.02); animation: pulseRing 3s ease-in-out infinite; }
@keyframes pulseRing { 50% { transform: scale(1.06); box-shadow: 0 0 0 1px rgba(255,120,80,.25), 0 0 0 54px rgba(255,90,60,.04); } }
.dd-shield__tile {
  position: absolute; inset: 30%; display: grid; place-items: center; border-radius: 28%;
  background: #fff; border: 1px solid #ffd4bf; box-shadow: 0 30px 60px rgba(0,0,0,.45), 0 0 0 10px rgba(255,255,255,.04);
  animation: floatY 5s ease-in-out infinite;
}
.dd-shield__tile svg { width: 46%; }
.dd-shield__badge {
  position: absolute; left: 50%; bottom: 8%; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 16px; border-radius: 999px; background: #fde4d6; border: 1px solid #f6c3a8; color: #c2410c;
  font-size: 12px; font-weight: 800; letter-spacing: .12em; white-space: nowrap;
}
.dd-shield__badge i { width: 8px; height: 8px; border-radius: 50%; background: #ff7a1a; animation: pulse 1.6s infinite; }
.dd-rating {
  position: absolute; left: -12%; bottom: -6%; width: 300px; padding: 18px 20px; border-radius: 16px; text-align: center;
  background: rgba(30,28,44,.9); border: 1px solid rgba(255,255,255,.14); backdrop-filter: blur(10px); box-shadow: 0 20px 50px rgba(0,0,0,.45);
}
.dd-rating[hidden] { display: none; }
.dd-rating__src { display: block; color: #fff; font-size: 18px; }
.dd-rating__stars { display: inline-flex; gap: 3px; margin: 6px 0; }
.dd-rating__stars i { width: 24px; height: 24px; display: grid; place-items: center; background: #dcdce6; color: #fff; font-style: normal; font-size: 16px; }
.dd-rating__stars i.on { background: #00b67a; }
.dd-rating__stars i.half { background: linear-gradient(90deg, #00b67a 50%, #dcdce6 50%); }
.dd-rating p { font-size: 13.5px; color: #dadbe4; }

/* Secțiuni deschise */
.dd-light { background: #eceef2; color: #16181d; padding: 88px 0; }
.dd-light--alt { background: #e6e8ee; }
.dd-head { max-width: 860px; margin: 0 auto 44px; text-align: center; }
.dd-head h2 { font-family: 'Inter', sans-serif; font-size: clamp(30px, 3.8vw, 50px); font-weight: 800; letter-spacing: -.03em; color: #16181d; }
.dd-head p { margin-top: 14px; font-size: 18px; line-height: 1.6; color: #4b4f5c; }
.dd-head--sub { margin-top: 88px; }
.dd-kicker {
  display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px; padding: 7px 16px; border-radius: 999px;
  background: #fbe3d5; border: 1px solid #f3c4a8; color: #c2410c; font-size: 12.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase;
}
.dd-kicker svg { width: 16px; height: 16px; }
.dd-kicker--red { background: #fde2e7; border-color: #f7bcc8; color: #e8435f; }
.dd-card { background: #fff; border: 1px solid #e4e6ec; border-radius: 22px; box-shadow: 0 2px 10px rgba(20,20,40,.03); }
.dd-light .red { color: #ff4d6d; }
.dd-light .orange { color: #c2410c; }
.dd-light .accent { color: #c2410c; }

/* Monitor */
.dd-monitor { padding: 26px 32px 22px; }
.dd-monitor__top { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; }
.dd-monitor__title { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; font-size: 17px; }
.dd-monitor__title svg { width: 20px; height: 20px; }
.dd-live { display: inline-flex; align-items: center; gap: 6px; margin-left: 6px; padding: 4px 12px; border-radius: 999px; background: #fde2e7; border: 1px solid #f7bcc8; color: #e8435f; font-style: normal; font-size: 12px; font-weight: 800; letter-spacing: .1em; }
.dd-live::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #ff4d6d; animation: pulse 1.4s infinite; }
.dd-legend { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: #2b2d36; }
.dd-legend i { width: 16px; height: 3px; border-radius: 2px; margin-left: 10px; }
.dd-legend i.red { background: #ff5a78; } .dd-legend i.orange { background: #ff7a1a; }
.dd-chart { display: block; width: 100%; height: 260px; }
.dd-monitor__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 18px; }
.dd-monitor__stats div { padding: 18px 20px; border-radius: 14px; border: 1px solid #e4e6ec; }
.dd-monitor__stats strong { display: block; font-size: 24px; font-weight: 700; }
.dd-monitor__stats span { font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #4b4f5c; }
.dd-sim { margin-top: 12px; font-size: 12.5px; color: #8a8e9b; }

/* Dosar AISURU */
.dd-dossier { position: relative; padding: 34px 38px; border-left: 4px solid #ff5a78; }
.dd-dossier__head { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.dd-dossier__head h3 { font-family: 'Inter', sans-serif; font-size: 26px; font-weight: 700; flex: 1; }
.dd-ico { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; flex-shrink: 0; background: #fdeee6; border: 1px solid #f6d3c0; color: #c2410c; }
.dd-ico svg { width: 26px; height: 26px; }
.dd-ico--red { width: 66px; height: 66px; background: #fde7ec; border-color: #f7c6d1; color: #ff4d6d; }
.dd-pill-red { display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px; border-radius: 999px; background: #ff4d6d; color: #fff; font-size: 12.5px; font-weight: 800; letter-spacing: .1em; }
.dd-pill-red svg { width: 14px; height: 14px; }
.dd-chips { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 20px; }
.dd-chips div { padding: 18px 20px; border-radius: 14px; border: 1px solid #e4e6ec; }
.dd-chips strong { display: block; font-size: 26px; font-weight: 700; color: #ff4d6d; }
.dd-chips span { font-size: 14px; font-weight: 600; color: #4b4f5c; }
.dd-dossier p { font-size: 16.5px; line-height: 1.75; color: #3b3e49; margin-top: 12px; }

.dd-grid3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 26px; }
.dd-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 22px; align-items: start; }
.dd-feat { padding: 32px; }
.dd-feat h3 { margin: 22px 0 10px; font-family: 'Inter', sans-serif; font-size: 20px; font-weight: 700; color: #16181d; }
.dd-feat p { font-size: 15.5px; line-height: 1.7; color: #4b4f5c; }
.dd-feat p span { color: #c2410c; font-weight: 600; }
a.dd-feat { transition: transform .2s, box-shadow .2s; }
a.dd-feat:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(20,20,40,.1); }
.dd-list { padding: 32px 36px; }
.dd-list h3 { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; font-family: 'Inter', sans-serif; font-size: 22px; font-weight: 700; }
.dd-list h3 svg { width: 26px; height: 26px; flex-shrink: 0; }
.dd-list ul { list-style: none; display: grid; gap: 16px; }
.dd-list li { position: relative; padding-left: 38px; font-size: 15.5px; line-height: 1.65; color: #3b3e49; }
.dd-list li::before { content: "✓"; position: absolute; left: 0; top: 1px; width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center; background: #fdeee6; border: 1px solid #f6c3a8; color: #c2410c; font-size: 13px; font-weight: 800; }
.dd-list p { font-size: 15.5px; line-height: 1.75; color: #3b3e49; margin-top: 12px; }

.dd-timeline { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; margin-top: 56px; }
.dd-timeline li { position: relative; padding-top: 34px; }
.dd-timeline li::before { content: ""; position: absolute; top: 5px; left: 0; width: 14px; height: 14px; border-radius: 50%; border: 2px solid #4b4f5c; background: #e6e8ee; }
.dd-timeline li::after { content: ""; position: absolute; top: 11px; left: 22px; right: -10px; height: 2px; background: #c9ccd5; }
.dd-timeline li.now::before { background: #ff4d6d; border-color: #ff4d6d; box-shadow: 0 0 0 5px rgba(255,77,109,.18); }
.dd-timeline b { font-size: 17px; color: #c2410c; }
.dd-timeline li.now b { color: #ff4d6d; }
.dd-timeline p { margin-top: 8px; font-size: 15px; line-height: 1.6; color: #3b3e49; }

/* Hartă */
.dd-map { padding: 20px; }
.dd-map svg { display: block; width: 100%; height: auto; }

/* Etape */
.dd-stages { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.dd-stages .dd-card { position: relative; padding: 30px 28px; }
.dd-stages .dd-card:not(:last-child)::after { content: ""; position: absolute; right: -18px; top: 50%; width: 14px; height: 2px; background: #ffb48a; }
.dd-stage { display: block; font-size: 13px; font-weight: 800; letter-spacing: .16em; color: #c2410c; }
.dd-stages svg { width: 26px; height: 26px; margin: 18px 0 14px; }
.dd-stages h3 { font-family: 'Inter', sans-serif; font-size: 19px; font-weight: 700; margin-bottom: 8px; }
.dd-stages p { font-size: 15px; line-height: 1.65; color: #4b4f5c; }
.dd-sum { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 18px 30px; margin-top: 26px; padding: 30px; }
.dd-sum__item { display: flex; align-items: center; gap: 12px; }
.dd-sum__item svg { width: 30px; height: 30px; }
.dd-sum__item strong { display: block; font-size: 28px; font-weight: 800; line-height: 1; }
.dd-sum__item small { font-size: 14px; color: #4b4f5c; }
.dd-sum__item--total strong { font-size: 36px; color: #e8590c; }
.dd-sum__op { font-size: 28px; font-weight: 700; color: #6b6f7c; }

/* Vectori */
.dd-filter { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; padding: 34px; margin-bottom: 26px; text-align: center; }
.dd-filter strong { display: block; font-size: clamp(30px, 3.4vw, 44px); font-weight: 800; }
.dd-filter span { font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: #4b4f5c; }
.dd-filter__mid { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.dd-filter__mid > span:last-child { color: #c2410c; }
.dd-bars { display: inline-flex; align-items: flex-end; gap: 5px; height: 54px; }
.dd-bars i { width: 9px; border-radius: 5px; background: linear-gradient(180deg, #ff9a3d, #ff6a1a); animation: bars 1.2s ease-in-out infinite; }
.dd-bars i:nth-child(1) { height: 60%; } .dd-bars i:nth-child(2) { height: 100%; animation-delay: .15s; }
.dd-bars i:nth-child(3) { height: 75%; animation-delay: .3s; } .dd-bars i:nth-child(4) { height: 90%; animation-delay: .45s; }
.dd-bars i:nth-child(5) { height: 45%; animation-delay: .6s; }
@keyframes bars { 50% { transform: scaleY(.55); } }
.dd-bars i { transform-origin: bottom; }
.dd-vectors { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.dd-vec { position: relative; display: flex; align-items: center; gap: 14px; padding: 16px; border-radius: 16px; background: #fff; border: 1px solid #e4e6ec; }
.dd-vec__ico { width: 42px; height: 42px; flex-shrink: 0; border-radius: 12px; display: grid; place-items: center; background: #fdeef1; border: 1px solid #f9d2da; color: #ff5a78; }
.dd-vec__ico svg { width: 20px; height: 20px; }
.dd-vec b { display: block; font-size: 15px; font-weight: 700; color: #16181d; line-height: 1.3; }
.dd-vec small { font-size: 13px; color: #6b6f7c; }
.dd-vec em { position: absolute; top: 10px; right: 10px; padding: 2px 8px; border-radius: 6px; background: #fdeee6; border: 1px solid #f6c3a8; color: #c2410c; font-style: normal; font-size: 10px; font-weight: 800; letter-spacing: .08em; }

/* XDP + straturi */
.dd-xdp { padding: 34px 38px; }
.dd-xdp h3 { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; font-family: 'Inter', sans-serif; font-size: 22px; font-weight: 700; }
.dd-xdp h3 svg { width: 26px; height: 26px; }
.dd-xdp p { font-size: 16px; line-height: 1.75; color: #3b3e49; margin-top: 10px; }
.dd-layers { display: grid; gap: 16px; max-width: 1080px; margin: 0 auto; }
.dd-layers .dd-card { display: grid; grid-template-columns: 160px 1fr; align-items: center; gap: 20px; padding: 26px 30px; }
.dd-layers b { display: inline-flex; align-items: center; gap: 10px; font-size: 21px; font-weight: 800; color: #c2410c; }
.dd-layers b svg { width: 22px; height: 22px; }
.dd-layers h3 { font-family: 'Inter', sans-serif; font-size: 18px; font-weight: 700; margin-bottom: 6px; }
.dd-layers p { font-size: 15.5px; line-height: 1.65; color: #4b4f5c; }

/* Responsive */
@media (max-width: 1100px) {
  .dd-hero__inner { grid-template-columns: 1fr; }
  .dd-shield { max-width: 380px; }
  .dd-rating { left: 50%; transform: translateX(-50%); bottom: -14%; }
  .dd-stages, .dd-vectors { grid-template-columns: repeat(2, 1fr); }
  .dd-stages .dd-card::after { display: none; }
  .dd-chips { grid-template-columns: repeat(2, 1fr); }
  .dd-grid3 { grid-template-columns: 1fr 1fr; }
  .dd-timeline { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .dd-light { padding: 60px 0; }
  .dd-monitor, .dd-dossier, .dd-list, .dd-xdp { padding: 22px 18px; }
  .dd-monitor__stats, .dd-grid2, .dd-grid3, .dd-stages, .dd-vectors, .dd-timeline { grid-template-columns: 1fr; }
  .dd-chart { height: 180px; }
  .dd-filter { grid-template-columns: 1fr; }
  .dd-layers .dd-card { grid-template-columns: 1fr; gap: 8px; }
  .dd-timeline li::after { display: none; }
  .dd-rating { width: 260px; }
}
.dd-hero__inner { grid-template-columns: 1.3fr .7fr; }
.dd-hero__title { font-size: clamp(36px, 4.6vw, 64px) !important; }
.dd-hero__title span { white-space: nowrap; text-transform: uppercase; }
@media (max-width: 1100px) { .dd-hero__inner { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .dd-hero__title span { white-space: normal; } }
.dd-vec { align-items: flex-start; padding: 32px 16px 16px; }
.dd-vec > div { min-width: 0; }
.dd-vec em { top: 10px; right: 12px; }
.dd-vec__ico { margin-top: 2px; }

/* =====================================================================
   v18 – Pagina „IP-ul meu”
   ===================================================================== */
body[data-page="ip"] { background: #f3f5fa; }
.ipx { padding: 150px 0 40px; background: #f3f5fa; }
.ipx__card {
  position: relative; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 24px; overflow: hidden;
  min-height: 340px; padding: 48px 0 0 44px; border-radius: 20px;
  background: radial-gradient(ellipse 60% 90% at 85% 30%, rgba(80,100,255,.18), transparent 70%), linear-gradient(120deg, #241a3a 0%, #2c1a36 55%, #201634 100%);
  box-shadow: 0 30px 70px rgba(30,20,60,.25);
}
.ipx__text { position: relative; z-index: 2; padding-bottom: 48px; }
.ipx__text h1 { margin: 18px 0 14px; font-size: clamp(28px, 3.6vw, 46px); font-weight: 700; color: #fff; line-height: 1.15; }
.ipx__ip { color: #fff; word-break: break-all; }
.ipx__loading { font-size: .6em; font-weight: 500; color: #a9a6c6; animation: blinkTxt 1.2s ease-in-out infinite; }
@keyframes blinkTxt { 50% { opacity: .4; } }
.ipx__where { max-width: 520px; font-family: 'Outfit', 'Inter', sans-serif; font-size: 18px; font-weight: 600; line-height: 1.45; color: #4fd6e6; }
.ipx__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.ipx__actions .btn:disabled { opacity: .5; cursor: wait; }

.ipx__art { position: relative; align-self: stretch; min-height: 340px; }
.ipx__city { position: absolute; right: 2%; bottom: 0; width: 88%; max-width: 440px; height: auto; }
.ipx__beam { animation: beam 3s ease-in-out infinite; transform-box: fill-box; transform-origin: bottom; }
.ipx__beam--2 { animation-delay: .7s; } .ipx__beam--3 { animation-delay: 1.4s; } .ipx__beam--4 { animation-delay: 2.1s; }
@keyframes beam { 50% { opacity: .45; transform: scaleY(.85); } }
.ipx__dots { position: absolute; left: 4%; bottom: 14%; width: 90px; opacity: .85; }
.ipx__pill { position: absolute; left: -2%; top: 8%; width: 170px; height: 46px; border-radius: 999px; background: linear-gradient(90deg, rgba(60,80,255,0), #3651ff); transform: rotate(35deg); }
.ipx__ring { position: absolute; right: -60px; top: -80px; width: 220px; height: 220px; border-radius: 50%; border: 34px solid rgba(70,90,200,.35); }

/* Detalii */
.ipd { padding: 40px 0 72px; background: #f3f5fa; }
.ipd__head { margin-bottom: 26px; }
.ipd__head h2 { font-size: clamp(24px, 2.6vw, 32px); color: #16181d; }
.ipd__head p { margin-top: 6px; color: #5b5f6d; font-size: 15px; }
.ipd__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.ipd__item {
  display: flex; align-items: center; gap: 14px; min-height: 84px; padding: 18px; border-radius: 16px;
  background: #fff; border: 1px solid #e6e8ef; box-shadow: 0 2px 10px rgba(20,20,40,.03);
}
.ipd__item--hl { border-color: #ffd3bf; background: linear-gradient(135deg, #fff, #fff6f1); }
.ipd__item--skeleton { background: linear-gradient(90deg, #eef0f5 25%, #f8f9fc 50%, #eef0f5 75%); background-size: 200% 100%; animation: skel 1.2s linear infinite; }
@keyframes skel { to { background-position: -200% 0; } }
.ipd__ico { width: 44px; height: 44px; flex-shrink: 0; border-radius: 12px; display: grid; place-items: center; background: #ecebff; color: #ff6b3d; }
.ipd__ico .icon { width: 22px; height: 22px; }
.ipd__item > div { min-width: 0; }
.ipd__item small { display: block; font-size: 12.5px; font-weight: 600; color: #6b6f7c; }
.ipd__item b { display: block; font-size: 15.5px; font-weight: 700; color: #16181d; overflow-wrap: anywhere; }
.ipd__item b em { margin-left: 4px; padding: 1px 6px; border-radius: 5px; background: #ecebff; font-style: normal; font-size: 11px; color: #4b4fc4; }
.ipd__item b a { margin-left: 6px; font-size: 13px; font-weight: 600; color: #ff6b3d; }
.ipd__note { margin-top: 18px; font-size: 13.5px; color: #6b6f7c; }
.ipd__note a { color: #ff6b3d; }

/* Banda „Care este IP-ul meu?” */
.ipq { padding: 90px 0; text-align: center; background: linear-gradient(120deg, #26193a, #2e1a36 50%, #241834); }
.ipq h2 { font-size: clamp(28px, 3.2vw, 42px); color: #fff; }
.ipq p { max-width: 900px; margin: 16px auto 0; font-size: 17px; line-height: 1.6; color: #e3e1ee; }

/* Carduri explicative */
.ipi { padding: 70px 0 90px; background: #f3f5fa; }
.ipi__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.ipi__card { padding: 24px 22px 28px; border-radius: 6px; background: #fff; box-shadow: 0 6px 24px rgba(30,30,60,.06); transition: transform .2s, box-shadow .2s; }
.ipi__card:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(30,30,60,.1); }
.ipi__ico { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: #ecebff; color: #ff6b3d; margin-bottom: 30px; }
.ipi__ico svg { width: 26px; height: 26px; }
.ipi__card h3 { font-size: 21px; color: #16181d; margin-bottom: 8px; }
.ipi__card p { font-size: 15.5px; line-height: 1.6; color: #2d3040; }

@media (max-width: 1100px) {
  .ipd__grid, .ipi__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .ipx__card { grid-template-columns: 1fr; padding: 34px 26px 0; }
  .ipx__text { padding-bottom: 0; }
  .ipx__art { min-height: 260px; }
  .ipx__city { right: 50%; transform: translateX(50%); width: 80%; }
}
@media (max-width: 640px) {
  .ipx { padding-top: 110px; }
  .ipd__grid, .ipi__grid { grid-template-columns: 1fr; }
}
.ipd__flag { display: inline-block; width: 22px; height: 16px; margin-right: 6px; border-radius: 2px; vertical-align: -2px; object-fit: cover; box-shadow: 0 0 0 1px rgba(0,0,0,.08); }
.ipx__ip { word-break: normal; overflow-wrap: anywhere; }
@media (max-width: 640px) { .ipx__ip { display: block; margin-top: 4px; } .ipx__text h1 { font-size: 26px; } }
.pricing__controls { justify-content: center; }

/* 4 planuri pe un rând */
.plans--4 { grid-template-columns: repeat(4, 1fr); gap: 18px; }
.plans--4 .plan { padding: 22px 20px; border-radius: 20px; }
.plans--4 .plan__name { font-size: 21px; }
.plans--4 .plan__specs { gap: 18px 10px; padding: 20px 0; }
.plans--4 .spec { gap: 9px; }
.plans--4 .spec__icon .icon { width: 23px; height: 23px; }
.plans--4 .spec__text b { font-size: 14.5px; }
.plans--4 .spec__text small { font-size: 12.5px; }
.plans--4 .plan__foot { flex-wrap: wrap; gap: 12px; }
.plans--4 .plan__amount strong { font-size: 27px; }
.plans--4 .btn--soft { padding: 11px 22px; }
@media (max-width: 1200px) { .plans--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .plans--4 { grid-template-columns: 1fr; } }
.plan__price > small:first-child { display: block; margin-bottom: -2px; }

/* Hero prima pagină: degrade bleumarin → mov */
.hero2--home { background: linear-gradient(90deg, #121520 0%, #131624 40%, #18172a 58%, #221a31 75%, #2b1a34 88%, #251a2f 100%); }
.hero2--home .hero2__bg {
  background:
    linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px) 0 0 / 60px 60px,
    linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px) 0 0 / 60px 60px;
}

/* Hero prima pagină: fără pete — fără lumina roșie din spatele panoului, degrade netezit */
.hero2--home .hero2__visual::before { display: none; }
.hero2--home { isolation: isolate; }
.hero2--home::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: .045; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%27160%27 height=%27160%27%3E%3Cfilter id=%27n%27%3E%3CfeTurbulence type=%27fractalNoise%27 baseFrequency=%27.9%27 numOctaves=%272%27 stitchTiles=%27stitch%27/%3E%3C/filter%3E%3Crect width=%27100%25%27 height=%27100%25%27 filter=%27url(%23n)%27/%3E%3C/svg%3E");
}
.hero2--home > .container { position: relative; z-index: 1; }
.hero2--home .hero2__bg { z-index: 0; mask-image: none; -webkit-mask-image: none; }

/* =====================================================================
   v19 – Panou hero mai compact + efect pe cardul Anti-DDoS
   ===================================================================== */
.hero2__visual[data-hero-panel] { width: 100%; max-width: 450px; justify-self: end; }
.panel { border-radius: 18px; }
.panel__bar { padding: 11px 15px; }
.panel__url { font-size: 12px; padding: 5px 10px; }
.panel__body { padding: 20px 22px 22px; }
.panel__status { font-size: 14px; }
.panel__uptime { margin-top: 12px; }
.panel__uptime strong { font-size: 38px; }
.panel__uptime em { font-size: 19px; }
.panel__muted { font-size: 13px; }
.spark { height: 54px; margin: 10px 0 14px; }
.panel__row { padding: 10px 14px; font-size: 14px; }
.panel__ddos { margin-top: 12px; padding: 13px 14px; gap: 12px; }
.panel__shield { width: 40px; height: 40px; }
.panel__ddos b { font-size: 15px; }
.panel__ddos small { font-size: 13px; }
.panel__bars { gap: 13px; margin-top: 16px; }
.pbar__top { font-size: 14px; margin-bottom: 7px; }
.pbar__track { height: 6px; }
.panel-note { margin-top: 14px; padding: 12px 14px; font-size: 13px !important; }

/* Efect Anti-DDoS: lumină care trece peste card + inel care pulsează în jurul scutului */
.panel__ddos { position: relative; overflow: hidden; isolation: isolate; animation: ddosGlow 3s ease-in-out infinite; }
.panel__ddos::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(105deg, transparent 30%, rgba(47,210,122,.28) 50%, transparent 70%);
  transform: translateX(-100%); animation: ddosSweep 3.2s ease-in-out infinite;
}
@keyframes ddosSweep { 0%, 15% { transform: translateX(-100%); } 60%, 100% { transform: translateX(100%); } }
@keyframes ddosGlow { 50% { border-color: rgba(47,210,122,.6); box-shadow: 0 0 22px rgba(47,210,122,.18), inset 0 0 18px rgba(47,210,122,.08); } }
.panel__shield { position: relative; color: #2fd27a; background: rgba(47,210,122,.14); }
.panel__shield::before, .panel__shield::after {
  content: ""; position: absolute; inset: 0; border-radius: 12px; border: 2px solid rgba(47,210,122,.55);
  animation: shieldRing 2.4s ease-out infinite;
}
.panel__shield::after { animation-delay: 1.2s; }
@keyframes shieldRing { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(1.7); opacity: 0; } }
.panel__live { animation: liveBlink 1.6s ease-in-out infinite; }
@keyframes liveBlink { 50% { background: rgba(47,210,122,.32); box-shadow: 0 0 10px rgba(47,210,122,.45); } }
@media (max-width: 1100px) { .hero2__visual[data-hero-panel] { justify-self: center; } }

/* Pagina VPS: mai multe locații, fiecare cu steag */
.vpo__row--locs { align-items: flex-start; }
.vpo__row--locs > span { padding-top: 3px; }
.vpo__locs { display: grid; gap: 10px; justify-items: end; }
.vpo__loc { gap: 9px; }
.vpo__flag { width: 28px; height: 19px; box-shadow: 0 0 0 1px rgba(255,255,255,.12); }
.vpo__flag--ro { flex-direction: row; }
.vpo__flag--de { flex-direction: column; }
.vpo__flag--de i:nth-child(1) { background: #000; }
.vpo__flag--de i:nth-child(2) { background: #dd0000; }
.vpo__flag--de i:nth-child(3) { background: #ffce00; }
.vpo__flag--nl { flex-direction: column; }
.vpo__flag--nl i:nth-child(1) { background: #ae1c28; } .vpo__flag--nl i:nth-child(2) { background: #fff; } .vpo__flag--nl i:nth-child(3) { background: #21468b; }
.vpo__flag--fr i:nth-child(1) { background: #002395; } .vpo__flag--fr i:nth-child(2) { background: #fff; } .vpo__flag--fr i:nth-child(3) { background: #ed2939; }
.vpo__flag--md i:nth-child(1) { background: #0046ae; } .vpo__flag--md i:nth-child(2) { background: #ffd200; } .vpo__flag--md i:nth-child(3) { background: #cc092f; }
.vpo__flag--us i { background: repeating-linear-gradient(180deg, #b22234 0 2px, #fff 2px 4px); }
.vpo__flag--us i:first-child { background: #3c3b6e; flex: .9; }
.vpo__flag--de i, .vpo__flag--nl i { flex: 1; }
@media (max-width: 640px) { .vpo__row--locs { flex-direction: column; gap: 10px; } .vpo__locs { justify-items: start; } }

/* Buton flotant WhatsApp (deasupra chatului) */
.fab--wa {
  right: 24px; bottom: 96px; background: #25d366; box-shadow: 0 10px 30px rgba(37,211,102,.45);
  overflow: visible; animation: waPulse 2.2s ease-out infinite;
}
.fab--wa svg { width: 30px; height: 30px; }
.fab__label {
  position: absolute; right: calc(100% + 12px); top: 50%; transform: translateY(-50%);
  padding: 8px 14px; border-radius: 12px; white-space: nowrap;
  background: #fff; color: #128c4b; font-size: 14px; font-weight: 700; box-shadow: 0 8px 24px rgba(0,0,0,.3);
  opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s, transform .2s;
}
.fab__label::after { content: ""; position: absolute; right: -6px; top: 50%; transform: translateY(-50%); border: 6px solid transparent; border-right: 0; border-left-color: #fff; }
.fab--wa:hover .fab__label, .fab--wa:focus-visible .fab__label { opacity: 1; visibility: visible; transform: translateY(-50%) translateX(-4px); }
@keyframes waPulse { 0% { box-shadow: 0 0 0 0 rgba(37,211,102,.55), 0 10px 30px rgba(37,211,102,.4); } 70% { box-shadow: 0 0 0 16px rgba(37,211,102,0), 0 10px 30px rgba(37,211,102,.4); } 100% { box-shadow: 0 0 0 0 rgba(37,211,102,0), 0 10px 30px rgba(37,211,102,.4); } }
@media (max-width: 640px) { .fab--wa { right: 16px; bottom: 76px; } .fab--wa svg { width: 26px; height: 26px; } .cookie-bar { bottom: 136px; } }
.pill--phone { font-variant-numeric: tabular-nums; letter-spacing: .01em; }

/* Butonul Anti-DDoS din meniu (portocaliu, cu scut) */
.nav__cta {
  margin-left: 6px; padding: 9px 16px; border-radius: 999px; gap: 7px;
  background: linear-gradient(90deg, #ff7a1a, #ff4d12); color: #fff !important; font-weight: 700;
  box-shadow: 0 6px 18px rgba(255,100,30,.35); transition: transform .2s, box-shadow .2s, filter .2s;
}
.nav__cta:hover { background: linear-gradient(90deg, #ff8a2e, #ff5a1f); transform: translateY(-1px); box-shadow: 0 10px 24px rgba(255,100,30,.5); }
.nav__cta.active { box-shadow: 0 0 0 2px rgba(255,255,255,.85), 0 6px 18px rgba(255,100,30,.4); border-radius: 999px; }
.nav__cta-ico { width: 17px; height: 17px; }
@media (max-width: 1024px) {
  .nav__cta { justify-content: center; margin: 14px 0 0; padding: 13px 16px; border-bottom: 0; border-radius: 999px; }
  .nav__cta.active { color: #fff; }
}

/* Butonul Anti-DDoS din meniu: roșul site-ului */
.nav__cta { background: #ff3b3b; box-shadow: 0 6px 18px rgba(255,59,59,.35); }
.nav__cta:hover { background: #ff5252; box-shadow: 0 10px 24px rgba(255,59,59,.5); }
.nav__cta.active { box-shadow: 0 0 0 2px rgba(255,255,255,.85), 0 6px 18px rgba(255,59,59,.4); }

/* Butonul Anti-DDoS din meniu: verde (ca graficul de uptime) */
.nav__cta { background: linear-gradient(90deg, #22c55e, #16a34a); text-shadow: 0 1px 2px rgba(0,60,20,.35); box-shadow: 0 6px 18px rgba(34,197,94,.35); }
.nav__cta:hover { background: linear-gradient(90deg, #2fd27a, #1fb85a); box-shadow: 0 10px 24px rgba(34,197,94,.5); }
.nav__cta.active { box-shadow: 0 0 0 2px rgba(255,255,255,.85), 0 6px 18px rgba(34,197,94,.4); }

/* =====================================================================
   v20 – Carduri hero moderne (fără linkuri subliniate)
   ===================================================================== */
.hstat {
  --ac: #ff4d4d; --ac2: #ff8a5c; --acg: rgba(255,77,77,.35);
  position: relative; isolation: isolate; display: flex; align-items: center; gap: 16px;
  min-height: 104px; padding: 20px 22px; border-radius: 20px; overflow: hidden;
  background: linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.015) 60%);
  border: 1px solid rgba(255,255,255,.08); backdrop-filter: blur(12px);
  color: inherit; text-decoration: none;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s, border-color .3s;
}
.hstat--green  { --ac: #22c55e; --ac2: #5eead4; --acg: rgba(34,197,94,.32); }
.hstat--blue   { --ac: #3b82f6; --ac2: #60a5fa; --acg: rgba(59,130,246,.32); }
.hstat--purple { --ac: #a855f7; --ac2: #e879f9; --acg: rgba(168,85,247,.32); }

/* Chenar în degrade care se aprinde la hover */
.hstat::before {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; padding: 1px;
  background: linear-gradient(135deg, var(--ac), transparent 45%, transparent 60%, var(--ac2));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: .35; transition: opacity .3s;
}
/* Lumină colorată discretă în colț */
.hstat::after {
  content: ""; position: absolute; z-index: -2; width: 160px; height: 160px; right: -60px; top: -70px; border-radius: 50%;
  background: radial-gradient(circle, var(--acg), transparent 70%); opacity: .55; transition: opacity .3s, transform .4s;
}
.hstat:hover { transform: translateY(-5px); border-color: transparent; box-shadow: 0 18px 40px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.02); }
.hstat:hover::before { opacity: 1; }
.hstat:hover::after { opacity: 1; transform: scale(1.2); }

.hstat .hstat__icon {
  position: relative; width: 52px; height: 52px; flex-shrink: 0; margin: 0; display: grid; place-items: center; border-radius: 15px;
  background: linear-gradient(135deg, var(--ac), var(--ac2)); color: #fff; border: 0;
  box-shadow: 0 8px 22px var(--acg), inset 0 1px 0 rgba(255,255,255,.3);
}
.hstat .hstat__icon .icon { width: 24px; height: 24px; stroke-width: 2; }
.hstat__body { flex: 1; min-width: 0; }
.hstat .hstat__body b { display: block; font-size: 18.5px; font-weight: 700; line-height: 1.2; color: #fff; }
.hstat .hstat__sub {
  display: block; margin-top: 5px; font-size: 14px; font-weight: 500; color: #a9abb8;
  text-decoration: none; transition: color .25s;
}
.hstat:hover .hstat__sub { color: #e6e7ee; }
.hstat__go {
  width: 34px; height: 34px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); color: #d4d5de;
  transition: background .25s, color .25s, transform .25s, border-color .25s;
}
.hstat__go .icon { width: 16px; height: 16px; }
.hstat:hover .hstat__go { background: var(--ac); border-color: var(--ac); color: #fff; transform: translateX(3px) rotate(-45deg); }

@media (max-width: 640px) {
  .hstat { min-height: 0; padding: 16px; }
  .hstat .hstat__icon { width: 46px; height: 46px; border-radius: 13px; }
}
.hstat .hstat__go { display: grid; margin: 0; color: #d4d5de; font-size: 0; }
.hstat:hover .hstat__go { color: #fff; }

/* =====================================================================
   v21 – „O rețea protejată, nu un slogan de marketing” (fundal alb)
   ===================================================================== */
.infra { padding: 100px 0; background: #fff; color: #14161c; }
.infra__inner { display: grid; grid-template-columns: 1.05fr .95fr; gap: 64px; align-items: center; }
.infra__badge {
  display: inline-flex; align-items: center; gap: 9px; padding: 9px 18px; border-radius: 999px;
  background: #fff1ee; border: 1px solid #ffc9bf; color: #e8341f;
  font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
}
.infra__badge svg { width: 17px; height: 17px; }
.infra h2 { margin: 24px 0 22px; font-size: clamp(32px, 4vw, 54px); font-weight: 700; line-height: 1.1; letter-spacing: -.03em; color: #0f1117; }
.infra__text > p { max-width: 600px; font-size: 18px; line-height: 1.75; color: #555a68; }
.infra__list { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 22px 28px; margin-top: 36px; }
.infra__list li { display: flex; align-items: center; gap: 14px; font-size: 16.5px; font-weight: 600; line-height: 1.4; color: #1c1f27; }
.infra__list li > span {
  width: 42px; height: 42px; flex-shrink: 0; display: grid; place-items: center; border-radius: 11px;
  background: #fff1ee; border: 1px solid #ffd6cd; color: #ff3b1f; transition: transform .25s, background .25s, color .25s;
}
.infra__list li:hover > span { transform: translateY(-2px) rotate(-4deg); background: #ff3b1f; color: #fff; }
.infra__list svg { width: 21px; height: 21px; }
.infra__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 44px; }
.infra__btn { border-radius: 12px; background: #ff3b1f; box-shadow: 0 10px 26px rgba(255,59,31,.3); }
.infra__btn:hover { background: #ff5235; }
.infra__btn2 { border-radius: 12px; background: #fff; border: 1.5px solid #d9dce4; color: #14161c; }
.infra__btn2:hover { border-color: #14161c; transform: translateY(-2px); }

.infra__media {
  position: relative; border-radius: 24px; overflow: hidden; aspect-ratio: 1;
  box-shadow: 0 30px 70px rgba(20,30,40,.18), 0 0 0 1px rgba(20,30,40,.06);
}
.infra__svg, .infra__photo { display: block; width: 100%; height: 100%; object-fit: cover; }
.infra__media::after {
  content: "Online"; position: absolute; left: 18px; bottom: 18px; display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px 8px 30px; border-radius: 999px; background: rgba(255,255,255,.92); backdrop-filter: blur(6px);
  font-size: 13px; font-weight: 700; color: #15803d; box-shadow: 0 6px 18px rgba(0,0,0,.12);
  background-image: radial-gradient(circle at 16px 50%, #22c55e 4px, transparent 5px);
}
.dc-led { animation: pulse 1.8s infinite; }

@media (max-width: 1024px) {
  .infra__inner { grid-template-columns: 1fr; gap: 48px; }
  .infra__media { max-width: 560px; }
}
@media (max-width: 640px) {
  .infra { padding: 64px 0; }
  .infra__list { grid-template-columns: 1fr; gap: 16px; }
  .infra__cta .btn { width: 100%; }
}
.infra h2 { font-size: clamp(30px, 3.4vw, 46px); }
.infra__media--photo { aspect-ratio: 4 / 3; }
.infra__media--photo .infra__photo { transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.infra__media--photo:hover .infra__photo { transform: scale(1.03); }
.infra__media::after { content: none; display: none; }
.fab--wa { animation: none; box-shadow: 0 10px 30px rgba(37,211,102,.4); }

/* =====================================================================
   v22 – Pagina „Status servicii”
   ===================================================================== */
.st-hero { padding-bottom: 70px; text-align: center; }
.st-hero h1 { margin: 18px 0 14px; font-size: clamp(38px, 5vw, 64px); color: #fff; }
.st-hero .hero2__lead { margin: 0 auto; }

.st-banner {
  display: flex; align-items: center; gap: 18px; max-width: 760px; margin: 40px auto 0; padding: 22px 24px; border-radius: 20px; text-align: left;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(10px);
  --c: #8d90a3; --cbg: rgba(141,144,163,.15);
}
.st-banner--up { --c: #22c55e; --cbg: rgba(34,197,94,.15); border-color: rgba(34,197,94,.4); background: linear-gradient(90deg, rgba(34,197,94,.14), rgba(255,255,255,.03)); }
.st-banner--degraded { --c: #f59e0b; --cbg: rgba(245,158,11,.15); border-color: rgba(245,158,11,.45); background: linear-gradient(90deg, rgba(245,158,11,.14), rgba(255,255,255,.03)); }
.st-banner--down { --c: #ef4444; --cbg: rgba(239,68,68,.15); border-color: rgba(239,68,68,.5); background: linear-gradient(90deg, rgba(239,68,68,.16), rgba(255,255,255,.03)); }
.st-banner__icon { width: 50px; height: 50px; flex-shrink: 0; border-radius: 50%; display: grid; place-items: center; background: var(--c); color: #fff; box-shadow: 0 0 0 8px var(--cbg); }
.st-banner__icon svg { width: 24px; height: 24px; }
.st-banner--loading .st-banner__icon { background: transparent; border: 3px solid rgba(255,255,255,.15); border-top-color: #fff; animation: spin 1s linear infinite; box-shadow: none; }
.st-banner > div { flex: 1; min-width: 0; }
.st-banner b { display: block; font-family: 'Outfit', 'Inter', sans-serif; font-size: 21px; color: #fff; }
.st-banner small { display: block; margin-top: 3px; font-size: 14.5px; color: #b9bbc8; }
.st-refresh { width: 42px; height: 42px; flex-shrink: 0; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); color: #e3e4ec; transition: background .2s; }
.st-refresh:hover { background: rgba(255,255,255,.14); }
.st-refresh svg { width: 18px; height: 18px; }
.st-refresh.spin svg { animation: spin .8s linear infinite; }

.st-main { padding: 60px 0 90px; background: #f3f5fa; color: #16181d; }
.st-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; margin-bottom: 22px; font-size: 14px; font-weight: 600; color: #4b4f5c; }
.st-legend span { display: inline-flex; align-items: center; gap: 7px; }
.st-legend i { width: 12px; height: 12px; border-radius: 3px; }
.st-legend em { margin-left: auto; font-style: normal; font-weight: 500; color: #6b6f7c; }
.st-legend i.up, .st-bars i.up { background: #22c55e; }
.st-legend i.degraded, .st-bars i.degraded { background: #f59e0b; }
.st-legend i.down, .st-bars i.down { background: #ef4444; }
.st-legend i.none, .st-bars i.none { background: #d6d9e1; }

.st-groups { display: grid; gap: 20px; }
.st-group { padding: 24px 26px; border-radius: 20px; background: #fff; border: 1px solid #e6e8ef; box-shadow: 0 2px 12px rgba(20,20,40,.04); }
.st-group__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-bottom: 16px; margin-bottom: 8px; border-bottom: 1px solid #eef0f4; }
.st-group__head h3 { font-size: 19px; color: #16181d; }
.st-pill { padding: 5px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 700; }
.st-pill--up { background: #dcfce7; color: #15803d; }
.st-pill--degraded { background: #fef3c7; color: #b45309; }
.st-pill--down { background: #fee2e2; color: #b91c1c; }
.st-row { padding: 16px 0; }
.st-row + .st-row { border-top: 1px dashed #eceef3; }
.st-row__top { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.st-row__top b { font-size: 15.5px; font-weight: 700; }
.st-row__meta { margin-left: auto; font-size: 13.5px; color: #6b6f7c; }
.st-row__meta em { font-style: normal; font-weight: 700; }
.st-txt--up { color: #15803d; } .st-txt--degraded { color: #b45309; } .st-txt--down { color: #b91c1c; }
.st-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.st-dot--up { background: #22c55e; box-shadow: 0 0 0 4px rgba(34,197,94,.18); }
.st-dot--degraded { background: #f59e0b; box-shadow: 0 0 0 4px rgba(245,158,11,.2); }
.st-dot--down { background: #ef4444; box-shadow: 0 0 0 4px rgba(239,68,68,.2); animation: pulse 1.4s infinite; }
.st-bars { display: grid; grid-template-columns: repeat(90, 1fr); gap: 2px; height: 32px; }
.st-bars i { border-radius: 2px; transition: transform .15s, filter .15s; }
.st-bars i:hover { transform: scaleY(1.15); filter: brightness(.9); }
.st-row__foot { display: flex; justify-content: space-between; margin-top: 7px; font-size: 12px; color: #8a8e9b; }

.st-two { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 28px; }
.st-panel { padding: 24px 26px; border-radius: 20px; background: #fff; border: 1px solid #e6e8ef; }
.st-panel h2 { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; font-size: 19px; color: #16181d; }
.st-panel h2 svg { width: 22px; height: 22px; color: #ff3b1f; }
.st-note { padding: 14px 0; border-top: 1px solid #eef0f4; }
.st-note__head { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
.st-note__head b { font-size: 15px; }
.st-note time { display: block; margin: 4px 0 6px; font-size: 12.5px; color: #8a8e9b; }
.st-note p { font-size: 14.5px; line-height: 1.6; color: #4b4f5c; }
.st-tag { flex-shrink: 0; padding: 3px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 700; }
.st-tag--rezolvat { background: #dcfce7; color: #15803d; }
.st-tag--monitorizare { background: #dbeafe; color: #1d4ed8; }
.st-tag--investigare { background: #fee2e2; color: #b91c1c; }
.st-tag--programat { background: #ede9fe; color: #6d28d9; }
.st-empty { padding: 14px 0 4px; border-top: 1px solid #eef0f4; font-size: 14.5px; color: #6b6f7c; }

.st-help { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; margin-top: 28px; padding: 22px 26px; border-radius: 20px; background: #16181d; color: #fff; }
.st-help b { display: block; font-size: 17px; }
.st-help span { font-size: 14.5px; color: #b9bbc8; }
.st-help__btns { display: flex; flex-wrap: wrap; gap: 10px; }

@media (max-width: 900px) { .st-two { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
  .st-bars { gap: 1px; height: 28px; }
  .st-row__top { flex-wrap: wrap; }
  .st-row__meta { margin-left: 20px; width: 100%; }
  .st-legend em { margin-left: 0; width: 100%; }
}

/* =====================================================================
   v23 – Întrebări frecvente (prima pagină)
   ===================================================================== */
.fq {
  position: relative; overflow: hidden; padding: 100px 0;
  background: radial-gradient(ellipse 50% 60% at 15% 0%, rgba(255,90,31,.12), transparent 70%),
              radial-gradient(ellipse 50% 60% at 90% 100%, rgba(139,92,246,.12), transparent 70%),
              linear-gradient(180deg, #111219, #15131f);
}
.fq__head { max-width: 760px; margin: 0 auto 48px; text-align: center; }
.fq__head h2 { margin: 18px 0 14px; font-size: clamp(32px, 4vw, 52px); color: #fff; }
.fq__head p { font-size: 18px; line-height: 1.6; color: #b9bbc8; }

.fq__list { display: grid; gap: 14px; max-width: 920px; margin: 0 auto; }
.fq__item {
  position: relative; border-radius: 18px; overflow: hidden;
  background: linear-gradient(160deg, rgba(255,255,255,.055), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.08);
  transition: border-color .3s, background .3s, box-shadow .3s, transform .3s;
}
.fq__item::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px;
  background: linear-gradient(180deg, #ff7a1a, #ff3b3b); transform: scaleY(0); transform-origin: top; transition: transform .35s;
}
.fq__item:hover { border-color: rgba(255,255,255,.16); }
.fq__item.is-open { border-color: rgba(255,106,43,.4); background: linear-gradient(160deg, rgba(255,106,43,.09), rgba(255,255,255,.02) 55%); box-shadow: 0 18px 44px rgba(0,0,0,.3); }
.fq__item.is-open::before { transform: scaleY(1); }

.fq__q {
  display: flex; align-items: center; gap: 16px; width: 100%; padding: 22px 24px; text-align: left; color: #fff;
}
.fq__q:focus-visible { outline: 2px solid #ff7a1a; outline-offset: -2px; border-radius: 18px; }
.fq__ico {
  width: 44px; height: 44px; flex-shrink: 0; display: grid; place-items: center; border-radius: 12px;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); color: #ff8a5c; transition: background .3s, color .3s, border-color .3s;
}
.fq__ico svg { width: 21px; height: 21px; }
.fq__item.is-open .fq__ico { background: linear-gradient(135deg, #ff7a1a, #ff3b3b); border-color: transparent; color: #fff; box-shadow: 0 8px 20px rgba(255,80,40,.35); }
.fq__num { font-family: 'Outfit', 'Inter', sans-serif; font-size: 14px; font-weight: 700; color: #6b6e80; letter-spacing: .04em; }
.fq__item.is-open .fq__num { color: #ff8a5c; }
.fq__text { flex: 1; font-family: 'Outfit', 'Inter', sans-serif; font-size: 18px; font-weight: 600; line-height: 1.35; }
.fq__toggle {
  position: relative; width: 36px; height: 36px; flex-shrink: 0; border-radius: 50%;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); transition: transform .35s, background .3s, border-color .3s;
}
.fq__toggle::before, .fq__toggle::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 2px; border-radius: 2px; background: #e3e4ec; transform: translate(-50%, -50%);
}
.fq__toggle::after { transform: translate(-50%, -50%) rotate(90deg); }
.fq__item.is-open .fq__toggle { transform: rotate(135deg); background: #ff5a2b; border-color: #ff5a2b; }
.fq__item.is-open .fq__toggle::before, .fq__item.is-open .fq__toggle::after { background: #fff; }

/* Animație lină de deschidere (grid 0fr → 1fr) */
.fq__a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s cubic-bezier(.2,.8,.2,1); }
.fq__a > div { overflow: hidden; }
.fq__item.is-open .fq__a { grid-template-rows: 1fr; }
.fq__a p {
  padding: 0 24px 24px 128px; font-size: 16px; line-height: 1.75; color: #c4c6d2;
  opacity: 0; transform: translateY(-6px); transition: opacity .35s .05s, transform .35s .05s;
}
.fq__item.is-open .fq__a p { opacity: 1; transform: none; }
.fq__a strong { color: #fff; }
.fq__a a { color: #ff8a5c; font-weight: 600; }

.fq__more {
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap; max-width: 920px; margin: 32px auto 0; padding: 22px 24px; border-radius: 18px;
  background: rgba(255,255,255,.04); border: 1px dashed rgba(255,255,255,.16);
}
.fq__more-ico { width: 48px; height: 48px; flex-shrink: 0; display: grid; place-items: center; border-radius: 14px; background: rgba(139,92,246,.18); color: #c4b5fd; }
.fq__more-ico svg { width: 24px; height: 24px; }
.fq__more-text { flex: 1; min-width: 200px; }
.fq__more-text b { display: block; font-size: 17px; color: #fff; }
.fq__more-text span { font-size: 14.5px; color: #a9abb8; }
.fq__more-btns { display: flex; flex-wrap: wrap; gap: 10px; }
.fq__wa { background: #25d366; color: #fff; }
.fq__wa:hover { background: #2fe076; transform: translateY(-2px); }

@media (max-width: 640px) {
  .fq { padding: 64px 0; }
  .fq__q { padding: 18px 16px; gap: 12px; }
  .fq__num { display: none; }
  .fq__ico { width: 38px; height: 38px; }
  .fq__text { font-size: 16px; }
  .fq__a p { padding: 0 16px 20px 66px; font-size: 15px; }
  .fq__more-btns { width: 100%; }
  .fq__more-btns .btn { flex: 1; }
}

/* =====================================================================
   v24 – FAQ: întrebările în stânga, ilustrație în dreapta
   ===================================================================== */
.fq__grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: start; }
.fq__col .fq__list, .fq__col .fq__more { max-width: none; margin-left: 0; margin-right: 0; }
.fq__art { position: sticky; top: 120px; }

.fqa { position: relative; width: 100%; aspect-ratio: 1 / 1.05; }
.fqa__ring { position: absolute; border-radius: 50%; border: 1.5px dashed rgba(255,255,255,.14); }
.fqa__ring--1 { inset: 6% 4%; animation: spin 60s linear infinite; }
.fqa__ring--2 { inset: 20% 18%; border-style: solid; border-color: rgba(255,106,43,.18); animation: spin 40s linear infinite reverse; }
.fqa__orb {
  position: absolute; left: 50%; top: 46%; width: 44%; transform: translate(-50%, -50%);
  filter: drop-shadow(0 24px 50px rgba(255,59,59,.45)); animation: fqFloat 6s ease-in-out infinite;
}
.fqa__orb svg { display: block; width: 100%; }
@keyframes fqFloat { 50% { transform: translate(-50%, calc(-50% - 14px)); } }

.fqa__bubble {
  position: absolute; z-index: 2; display: flex; align-items: flex-end; gap: 10px; max-width: 72%;
}
.fqa__bubble p {
  padding: 12px 15px; border-radius: 16px; font-size: 14px; line-height: 1.45;
  box-shadow: 0 14px 34px rgba(0,0,0,.35);
}
.fqa__bubble--q { left: 0; top: 4%; animation: floatY 5s ease-in-out infinite; }
.fqa__bubble--q p { background: rgba(40,38,58,.95); border: 1px solid rgba(255,255,255,.12); color: #e6e4f0; border-bottom-left-radius: 4px; }
.fqa__bubble--a { right: 0; bottom: 18%; flex-direction: row-reverse; animation: floatY 6s ease-in-out .8s infinite; }
.fqa__bubble--a p { background: linear-gradient(135deg, #ff6a2b, #ff3b3b); color: #fff; border-bottom-right-radius: 4px; }
.fqa__bubble--a b { color: #fff; }
.fqa__avatar { width: 38px; height: 38px; flex-shrink: 0; border-radius: 50%; display: grid; place-items: center; overflow: hidden; box-shadow: 0 6px 16px rgba(0,0,0,.35); }
.fqa__avatar svg { width: 100%; height: 100%; }
.fqa__avatar--client { background: linear-gradient(135deg, #60a5fa, #6366f1); color: #fff; font-weight: 800; font-size: 15px; }

.fqa__chip {
  position: absolute; z-index: 2; display: flex; align-items: center; gap: 10px; padding: 10px 14px 10px 10px; border-radius: 14px; white-space: nowrap;
  background: rgba(30,28,44,.92); border: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(10px); box-shadow: 0 14px 34px rgba(0,0,0,.35);
}
.fqa__chip b { display: block; font-size: 14px; color: #fff; }
.fqa__chip small { display: block; font-size: 12px; color: #a9a6c6; }
.fqa__chip-ico { width: 36px; height: 36px; flex-shrink: 0; display: grid; place-items: center; border-radius: 10px; color: #fff; }
.fqa__chip-ico svg { width: 19px; height: 19px; }
.fqa__chip--fast { right: 2%; top: 20%; animation: floatY 5.5s ease-in-out .4s infinite; }
.fqa__chip--fast .fqa__chip-ico { background: linear-gradient(135deg, #3b82f6, #6366f1); }
.fqa__chip--support { left: 2%; top: 52%; animation: floatY 6s ease-in-out 1.2s infinite; }
.fqa__chip--support .fqa__chip-ico { background: linear-gradient(135deg, #a855f7, #ec4899); }
.fqa__chip--free { left: 14%; bottom: 2%; animation: floatY 5s ease-in-out 2s infinite; }
.fqa__chip--free .fqa__chip-ico { background: linear-gradient(135deg, #22c55e, #16a34a); }

.fqa__spark { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #ff8a5c; box-shadow: 0 0 14px #ff8a5c; animation: pulse 2.4s infinite; }
.fqa__spark--1 { left: 30%; top: 18%; }
.fqa__spark--2 { right: 22%; top: 70%; background: #a78bfa; box-shadow: 0 0 14px #a78bfa; animation-delay: .8s; }
.fqa__spark--3 { left: 8%; top: 38%; width: 6px; height: 6px; background: #60a5fa; box-shadow: 0 0 12px #60a5fa; animation-delay: 1.6s; }

@media (max-width: 1024px) {
  .fq__grid { grid-template-columns: 1fr; }
  .fq__art { position: relative; top: 0; order: -1; max-width: 460px; width: 100%; justify-self: center; }
}
@media (max-width: 640px) {
  .fqa { aspect-ratio: 1 / 1.15; }
  .fqa__bubble { max-width: 86%; }
  .fqa__bubble p { font-size: 13px; padding: 10px 12px; }
  .fqa__chip { padding: 8px 10px 8px 8px; }
  .fqa__chip-ico { width: 30px; height: 30px; }
  .fqa__chip b { font-size: 13px; }
}
.fq { overflow: clip; }

/* =====================================================================
   v25 – Mărimea logo-ului se setează din panoul de administrare
   ===================================================================== */
.logo--header img { height: var(--logo-h, 62px); max-height: calc(var(--header-h, 88px) - 8px); }
.header.scrolled .logo--header img { height: var(--logo-hs, 54px); }
.logo--footer img { height: var(--logo-f, 64px); }
.header__inner { height: max(88px, calc(var(--logo-h, 62px) + 20px)); --header-h: max(88px, calc(var(--logo-h, 62px) + 20px)); }
@media (max-width: 1024px) {
  .header__inner { height: 76px; --header-h: 76px; }
  .logo--header img, .header.scrolled .logo--header img { height: min(var(--logo-m, 46px), 66px); }
}
@media (max-width: 640px) {
  .logo--header img, .header.scrolled .logo--header img { height: min(var(--logo-m, 46px), 58px); }
  .logo--footer img { height: min(var(--logo-f, 64px), 72px); }
}

/* v26 – Titlu deasupra tabelelor de prețuri */
.pricing-head { max-width: 820px; margin-bottom: 44px; }
.section--light .pricing-head h2, .pricing-head h2 { font-size: clamp(30px, 4.2vw, 46px); color: #17131f; letter-spacing: -.01em; }
.section--light .pricing-head p, .pricing-head p { margin-top: 16px; font-size: clamp(16px, 1.8vw, 20px); line-height: 1.65; color: #2f2a3a; }

/* =====================================================================
   v27 – Carduri de preț în stil „listă” (Găzduire partajată)
   ===================================================================== */
.plan--list { padding: 30px 26px 26px; }
.plans--4 .plan--list { padding: 28px 22px 22px; }
.plan--list .plan__tag { position: absolute; top: 22px; right: 20px; }
.plan--list .plan__name { font-size: 22px; font-weight: 800; text-transform: uppercase; letter-spacing: .01em; color: #17131f; padding-right: 80px; }
.plan--list .plan__desc { margin-top: 8px; font-size: 15px; line-height: 1.55; color: #2f2a3a; min-height: 3.1em; }
.plan__big { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; margin-top: 22px; }
.plan__big strong { font-family: 'Outfit', 'Inter', sans-serif; font-size: 44px; font-weight: 800; line-height: 1; letter-spacing: -.02em; color: #17131f; }
.plan__big span { font-size: 16px; font-weight: 600; color: #ff5a1f; }
.plan__big s { width: 100%; font-size: 15px; color: #9a96a3; }
.plan__year { display: block; margin-top: 8px; font-size: 14px; color: #8a8693; }
.plan__rows, .plan__feats { list-style: none; margin: 0; padding: 0; display: grid; }
.plan__rows { gap: 16px; margin-top: 26px; padding-bottom: 22px; border-bottom: 1px solid #ebe7ef; }
.plan__rows li { display: flex; align-items: center; gap: 12px; font-size: 16px; color: #1f1b28; }
.plan__rows li b { font-weight: 800; }
.plan__rows .icon { width: 20px; height: 20px; flex-shrink: 0; color: #ff5a1f; stroke-width: 2.2; }
.plan__feats { gap: 13px; margin-top: 20px; }
.plan__feats li { display: flex; align-items: center; gap: 12px; font-size: 14.5px; color: #2f2a3a; }
.plan__feats .icon { width: 17px; height: 17px; flex-shrink: 0; color: #ff5a1f; stroke-width: 2.6; }
.plan__space { flex: 1; min-height: 26px; }
.plan--list .plan__cta { width: 100%; padding: 14px; justify-content: center; }
.plans--list { align-items: stretch; }
.plans--list .plan--list { display: flex; flex-direction: column; }
@media (max-width: 640px) { .plan__big strong { font-size: 38px; } }

/* =====================================================================
   v28 – Carduri „listă” exact ca modelul (chenar albastru, etichetă mov)
   ===================================================================== */
.plans--list { gap: 24px; }
.plan--list, .plans--4 .plan--list {
  padding: 30px 26px 30px; border-radius: 12px; background: #fff;
  border: 1px solid #d6dff4; box-shadow: none; overflow: hidden;
}
.plan--list:hover { transform: none; box-shadow: 0 14px 40px rgba(30, 50, 120, .08); }
.plan--list.plan--popular { border: 2px solid #2f6be6; box-shadow: none; padding-top: 38px; }
.plan--list .plan__tag { display: none; }
.plan__ribbon {
  position: absolute; top: 0; right: 0; display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 14px 7px 12px; border-radius: 0 0 0 8px; background: #4a2a72; color: #fff;
  font-size: 13.5px; font-weight: 700;
}
.plan__ribbon svg { width: 15px; height: 15px; }
.plan--list .plan__name { font-size: 20px; font-weight: 800; padding-right: 0; color: #15121c; }
.plan--list .plan__desc { margin-top: 6px; font-size: 15.5px; line-height: 1.6; color: #2f2b38; }
.plan--list .plan__big { margin-top: 18px; gap: 4px 10px; }
.plan--list .plan__big strong { font-size: 44px; font-weight: 700; letter-spacing: -.01em; color: #15121c; }
.plan--list .plan__big span { color: #7b7887; font-weight: 500; font-size: 16px; }
.plan--list .plan__year { margin-top: 6px; font-size: 14px; color: #8b8896; }
.plan--list .plan__rows { gap: 16px; margin-top: 24px; padding-bottom: 20px; border-bottom: 1px solid #e3e1e8; }
.plan--list .plan__rows li { font-size: 16.5px; color: #1d1a24; }
.plan--list .plan__rows li b { font-weight: 700; }
.plan--list .plan__rows .icon { width: 19px; height: 19px; color: #ff4f12; }
.plan--list .plan__rows .icon--fill { stroke: none; }
.plan--list .plan__feats { gap: 14px; margin-top: 22px; }
.plan--list .plan__feats li { font-size: 14.5px; color: #2f2b38; }
.plan--list .plan__feats .icon { width: 16px; height: 16px; color: #ff4f12; stroke-width: 2.4; }
.plan__space { min-height: 40px; }
.plan--list .plan__cta {
  width: 100%; padding: 16px; border-radius: 999px; font-size: 16px; font-weight: 600;
  background: #fff; color: #ff4f12; border: 1.5px solid #ff4f12; box-shadow: none;
}
.plan--list .plan__cta:hover { background: #fff3ee; transform: none; }
.plan--list .plan__cta--solid { background: #ff4f12; color: #fff; border-color: #ff4f12; }
.plan--list .plan__cta--solid:hover { background: #ff6630; color: #fff; }
@media (max-width: 1200px) { .plans--list.plans--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .plans--list.plans--4 { grid-template-columns: 1fr; } }
/* Cardurile „listă” pe 4 coloane ies puțin din container, ca să aibă lățimea din model */
@media (min-width: 1201px) {
  .plans--list.plans--4 { --pw: min(1320px, calc(100vw - 48px)); width: var(--pw); margin-left: calc((100% - var(--pw)) / 2); }
}

/* =====================================================================
   v29 – Carduri „listă”: nume normal (fără majuscule forțate), 3 coloane, fulger
   ===================================================================== */
.plan--list .plan__name { text-transform: none; }
.plans--wordpress .plan--list .plan__name { font-size: 27px; font-weight: 700; letter-spacing: -.01em; }
.plans--wordpress .plan--list .plan__desc { font-size: 14px; }
.plans--wordpress .plan--list .plan__rows li { font-size: 15px; }
.plans--wordpress .plan--list .plan__feats li { font-size: 13.5px; }
.plans--list.plans--3 { grid-template-columns: repeat(3, 1fr); max-width: 1100px; margin-inline: auto; }
.plan--list .plan__feats li.is-bolt .icon { width: 15px; height: 15px; stroke: none; }
.plan--list .plan__cta { font-size: 15px; }
@media (max-width: 1000px) { .plans--list.plans--3 { grid-template-columns: 1fr; max-width: 460px; } }
.plans--wordpress .plan--list { padding-left: 22px; padding-right: 22px; }

/* =====================================================================
   v30 – Carduri „listă stil 2” (Găzduire Business)
   ===================================================================== */
.plan--list2, .plans--4 .plan--list2 {
  padding: 38px 30px 30px; border: 1px solid transparent; border-radius: 8px;
  box-shadow: 0 6px 30px rgba(20, 30, 60, .06);
}
.plan--list2.plan--popular { border: 1px solid #2f6be6; padding-top: 38px; box-shadow: 0 6px 30px rgba(20, 30, 60, .06); }
.plan--list2 .plan__name { font-size: 30px; font-weight: 600; line-height: 1.2; color: #15121c; padding: 0 0 0 16px; }
.plan--list2.plan--popular .plan__name { color: #1d6ff2; }
.plan--list2 .plan__big { margin-top: 12px; padding-left: 16px; gap: 4px 8px; }
.plan--list2 .plan__big strong { font-size: 42px; font-weight: 700; color: #ff4f12; letter-spacing: -.01em; }
.plan--list2 .plan__big span { font-size: 15px; font-weight: 600; color: #15121c; }
.plan--list2 .plan__desc { margin-top: 36px; font-size: 15px; line-height: 1.65; color: #2f2b38; min-height: 0; }
.plan--list2 .plan__rows { gap: 14px; margin-top: 22px; padding-bottom: 0; border-bottom: 0; }
.plan--list2 .plan__rows li { font-size: 16px; color: #2a2733; gap: 12px; }
.plan--list2 .plan__rows .icon { width: 19px; height: 19px; color: #ff4f12; }
.plan--list2 .plan__rows .is-feat .icon { stroke-width: 2.4; }
.plan--list2 .plan__space { min-height: 60px; }
.plan--list2 .plan__cta { padding: 17px; border: 0; background: #eef3fb; color: #ff4f12; font-weight: 700; }
.plan--list2 .plan__cta:hover { background: #e2eaf8; }
.plan--list2 .plan__cta--solid { background: #ff4f12; color: #fff; }
.plan--list2 .plan__cta--solid:hover { background: #ff6630; }
.plans--business.plans--3 { max-width: 1340px; gap: 24px; }
@media (min-width: 1201px) {
  .plans--business.plans--3 { --pw: min(1340px, calc(100vw - 48px)); width: var(--pw); max-width: none; margin-left: calc((100% - var(--pw)) / 2); }
}
@media (max-width: 640px) { .plan--list2 .plan__name { font-size: 25px; } .plan--list2 .plan__big strong { font-size: 36px; } }

/* =====================================================================
   v31 – Carduri „listă stil 3” (Reseller web)
   ===================================================================== */
.plan--list3, .plans--4 .plan--list3 {
  padding: 40px 24px 26px; border: 0; border-radius: 6px; box-shadow: 0 6px 30px rgba(20, 30, 60, .07);
}
.plan--list3.plan--popular { border: 0; padding-top: 40px; box-shadow: 0 6px 30px rgba(20, 30, 60, .07), 0 0 0 2px #ff3a1a; }
.plan--list3 .plan__name { font-size: 20px; font-weight: 700; line-height: 1.25; color: #5d5c66; }
.plan--list3 .plan__big { margin-top: 10px; gap: 4px 8px; }
.plan--list3 .plan__big strong { font-size: 36px; font-weight: 700; color: #f0127a; letter-spacing: -.01em; }
.plan--list3 .plan__big span { font-size: 15px; font-weight: 600; color: #15121c; }
.plan--list3 .plan__desc { margin-top: 26px; font-size: 15px; line-height: 1.7; color: #4a4955; min-height: 3.4em; }
.plan--list3 .plan__cta {
  margin-top: 26px; padding: 15px; border: 0; border-radius: 3px; background: #ff3a1a; color: #fff; font-weight: 700; font-size: 15px;
}
.plan--list3 .plan__cta:hover { background: #ff5534; }
.plan--list3 .plan__rows { gap: 12px; margin-top: 30px; padding-bottom: 0; border-bottom: 0; }
.plan--list3 .plan__rows li { font-size: 14px; color: #3d3c47; gap: 9px; }
.plan--list3 .plan__rows .icon { width: 15px; height: 15px; color: #ff3a1a; }
.plan--list3 .plan__rows .is-feat .icon { stroke-width: 2.4; }
.plan--list3 .plan__rows li[hidden] { display: none; }
.plan__more { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; padding: 4px 0; color: #15121c; font-size: 14px; font-weight: 700; cursor: pointer; }
.plan__more span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #e8e9f0; }
.plan__more .icon { width: 13px; height: 13px; stroke-width: 2.4; transition: transform .2s; }
.plan__more[aria-expanded="true"] .icon { transform: rotate(180deg); }
.plans--resellerWeb.plans--3 { max-width: 1110px; gap: 20px; }
@media (max-width: 640px) { .plan--list3 .plan__big strong { font-size: 32px; } }

/* =====================================================================
   v32 – Carduri „listă stil 4” (Servere radio)
   ===================================================================== */
.plan--list4, .plans--4 .plan--list4 { padding: 30px 24px 24px; }
.plan--list4.plan--popular { padding-top: 34px; }
.plan--list4 .plan__name { font-size: 19px; font-weight: 700; line-height: 1.3; color: #15121c; text-transform: none; }
.plan--list4 .plan__name span { display: block; font-weight: 500; }
.plan--list4.plan--popular .plan__name { color: #1d6ff2; }
.plan--list4 .plan__desc { margin-top: 18px; font-size: 14.5px; color: #77757f; min-height: 0; }
.plan--list4 .plan__big { margin-top: 28px; }
.plan--list4 .plan__big strong { font-size: 42px; font-weight: 600; }
.plan--list4 .plan__big span { color: #15121c; font-weight: 600; font-size: 15px; }
.plan--list4 .plan__rows { gap: 14px; margin-top: 36px; padding-bottom: 0; border-bottom: 0; }
.plan--list4 .plan__rows li { font-size: 15.5px; color: #2a2733; }
.plan--list4 .plan__rows .icon { width: 19px; height: 19px; }
.plan--list4 .plan__rows .is-feat .icon { color: #1f8a4c; stroke-width: 2.4; width: 17px; height: 17px; }
.plan--list4 .plan__rows .is-no { color: #8e8c96; }
.plan--list4 .plan__rows .is-no .icon { color: #ff4f12; stroke-width: 2.4; width: 15px; height: 15px; }
.plan--list4 .plan__space { min-height: 44px; }
.plan--list4 .plan__cta { padding: 17px; }
@media (min-width: 1201px) {
  .plans--radio.plans--4 { --pw: min(1320px, calc(100vw - 48px)); width: var(--pw); margin-left: calc((100% - var(--pw)) / 2); }
}

/* =====================================================================
   v33 – Secțiunea „Control Panel Intuitiv” (pagina radio)
   ===================================================================== */
.rpanel { padding: 80px 0 90px; background: #f4f6fb; color: #15121c; overflow: clip; }
.rpanel__head { margin-bottom: 40px; }
.rpanel .rpanel__head h2 { color: #15121c; }
.rpanel .rpanel__head p { color: #2f2b38; max-width: 830px; margin-inline: auto; }
.rpanel__grid { display: grid; grid-template-columns: minmax(0, 500px) minmax(0, 1fr); gap: 60px; align-items: center; }
.rpanel__list { display: grid; gap: 24px; }
.rpanel__item { display: flex; gap: 22px; padding: 26px 28px; border-radius: 16px; background: #fff; box-shadow: 0 4px 22px rgba(30, 40, 80, .06); }
.rpanel__icon { flex-shrink: 0; color: #ff4f12; padding-top: 2px; }
.rpanel__icon svg { width: 34px; height: 34px; display: block; }
.rpanel__item h3 { font-size: 19px; font-weight: 700; color: #15121c; }
.rpanel__item p { margin-top: 10px; font-size: 16px; line-height: 1.75; color: #6c6a75; }
.rpanel__media { position: relative; display: flex; justify-content: center; padding: 50px 0 0 30px; }
.rpanel__blob { position: absolute; top: 0; right: -10px; width: 150px; height: 150px; border-radius: 50%; background: linear-gradient(135deg, #4f8bff, #2f5ef0); }
.rpanel__frame { position: relative; width: 100%; max-width: 640px; border-radius: 14px; overflow: hidden; background: #fff; border: 5px solid #fff; box-shadow: 0 24px 60px rgba(20, 30, 70, .18); }
.rpanel__bar { height: 22px; background: #34363d; }
.rpanel__frame img { display: block; width: 100%; height: auto; }
@media (max-width: 1000px) {
  .rpanel__grid { grid-template-columns: 1fr; gap: 40px; }
  .rpanel__list { max-width: 620px; margin-inline: auto; }
  .rpanel__media { padding: 40px 10px 0; }
}
@media (max-width: 640px) {
  .rpanel { padding: 60px 0; }
  .rpanel__item { padding: 22px 20px; gap: 16px; }
  .rpanel__icon svg { width: 28px; height: 28px; }
  .rpanel__blob { width: 100px; height: 100px; right: 0; }
}

/* =====================================================================
   v34 – Secțiunea „Găzduire Radio Online” (4 carduri)
   ===================================================================== */
.rfeat { padding: 80px 0 90px; background: #fff; color: #15121c; }
.rfeat__head { margin-bottom: 52px; }
.rfeat .rfeat__head h2 { color: #15121c; }
.rfeat .rfeat__head h2 span { color: #ff5a14; }
.rfeat .rfeat__head p { color: #2f2b38; max-width: 740px; margin-inline: auto; }
.rfeat__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.rfeat__card { padding: 34px 24px 40px; border: 1px solid #e3e6ee; border-radius: 6px; background: #fff; transition: box-shadow .25s, transform .25s; }
.rfeat__card:hover { box-shadow: 0 14px 36px rgba(20, 30, 70, .08); transform: translateY(-3px); }
.rfeat__icon { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 6px; background: #fdeee6; color: #ff5a14; }
.rfeat__icon svg { width: 26px; height: 26px; }
.rfeat__card h3 { margin-top: 28px; font-family: 'Inter', sans-serif; font-size: 16px; font-weight: 700; color: #15121c; }
.rfeat__card p { margin-top: 14px; font-size: 16px; line-height: 1.7; color: #2f2b38; }
@media (max-width: 1100px) { .rfeat__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .rfeat { padding: 60px 0; } .rfeat__grid { grid-template-columns: 1fr; } }

/* =====================================================================
   v35 – Prețuri VPS pe rânduri, cu file (VPS START / BUSINESS / ADVANCED)
   ===================================================================== */
.plans--rows { display: block; }
.vtabs { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; margin: 0 0 48px; }
.vtab { padding: 19px 30px; border-radius: 2px; font-size: 17px; font-weight: 700; color: #15121c; letter-spacing: .01em; transition: background .2s, color .2s, box-shadow .2s; }
.vtab:hover { color: #ff4f12; }
.vtab.active { background: #ff4f12; color: #fff; box-shadow: 0 10px 24px rgba(255, 79, 18, .28); }
.vrows { display: grid; gap: 26px; }
.vrow {
  display: grid; grid-template-columns: 1.55fr 1.05fr 0.95fr .5fr .75fr 1fr .6fr .85fr 2.05fr; align-items: stretch;
  gap: 2px; background: #fff; animation: fadeUp .45s both;
}
.vrow > * { background: #fcf8f4; }
.vrow__name { display: flex; align-items: center; gap: 22px; padding: 22px 22px; }
.vrow__srv { width: 40px; height: 40px; flex-shrink: 0; color: #b9b6bd; }
.vrow__name h3 { font-family: 'Inter', sans-serif; font-size: 18px; font-weight: 700; color: #15121c; white-space: nowrap; }
.vrow__cell { display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 18px 16px; min-width: 0; }
.vrow__cell small { font-size: 15.5px; color: #6f6c77; }
.vrow__cell b { display: flex; align-items: center; gap: 6px; font-size: 15.5px; font-weight: 700; color: #15121c; white-space: nowrap; }
.vrow__cell .vpo__flag { width: 16px; height: 11px; border-radius: 1px; box-shadow: none; }
.vrow__ok { width: 17px; height: 17px; color: #1f9254; }
.vrow__buy { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 30px 16px 18px; }
.vrow__price { display: flex; align-items: baseline; white-space: nowrap; }
.vrow__price b { font-family: 'Outfit', 'Inter', sans-serif; font-size: 32px; font-weight: 700; color: #15121c; letter-spacing: -.02em; }
.vrow__price small { font-size: 13px; font-weight: 600; color: #15121c; }
.vrow__btn { padding: 17px 32px; border-radius: 999px; background: #fff; border: 1px solid #ece7e2; color: #4b4955; font-weight: 600; white-space: nowrap; }
.vrow__btn:hover { background: #ff4f12; border-color: #ff4f12; color: #fff; }
.vrow--popular > * { background: #fff3ec; }
@media (min-width: 1201px) {
  .plans--rows { --pw: min(1300px, calc(100vw - 48px)); width: var(--pw); margin-left: calc((100% - var(--pw)) / 2); }
}
@media (max-width: 1200px) {
  .vrow { grid-template-columns: repeat(4, 1fr); }
  .vrow__name { grid-column: 1 / -1; }
  .vrow__buy { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .vtab { padding: 14px 16px; font-size: 14px; }
  .vrow { grid-template-columns: repeat(2, 1fr); }
  .vrow__buy { flex-wrap: wrap; padding: 16px 18px; }
  .vrow__btn { flex: 1; text-align: center; }
}
@media (max-width: 1200px) { .vrow > .vrow__cell:nth-child(8):last-of-type, .vrow > .vrow__cell:nth-child(8) { grid-column: span 2; } }

/* VPS: efect „selectat” când treci cu mouse-ul peste un rând */
.vrow { position: relative; border-radius: 4px; transition: transform .25s ease, box-shadow .25s ease; }
.vrow > * { transition: background-color .25s ease; }
.vrow::after { content: ''; position: absolute; inset: 0; border: 2px solid transparent; border-radius: 4px; pointer-events: none; transition: border-color .25s ease; }
.vrow:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(255, 79, 18, .16); z-index: 1; }
.vrow:hover::after { border-color: #ff4f12; }
.vrow:hover > * { background: #fff4ee; }
.vrow:hover .vrow__srv { color: #ff4f12; }
.vrow:hover .vrow__btn { background: #ff4f12; border-color: #ff4f12; color: #fff; box-shadow: 0 8px 20px rgba(255, 79, 18, .3); }
.vrow:hover .vrow__price b { color: #ff4f12; }
/* Coloane identice pe toate rândurile VPS (aliniere perfectă) */
@media (min-width: 1201px) {
  .vrow { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1.05fr) minmax(0, .95fr) minmax(0, .5fr) minmax(0, .75fr) minmax(0, 1fr) minmax(0, .85fr) minmax(0, .85fr) minmax(0, 2fr); }
}

/* =====================================================================
   v36 – VPS: secțiune text + ilustrații (SSD, rețea, backup, root, IP)
   ===================================================================== */
.vfeat { padding: 90px 0 100px; background: #fff; color: #15121c; }
.vfeat__row { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; max-width: 1080px; margin-inline: auto; }
.vfeat__row + .vfeat__row { margin-top: 90px; }
.vfeat__row--rev .vfeat__text { order: 2; }
.vfeat__text h3 { font-family: 'Inter', sans-serif; font-size: 20px; font-weight: 700; color: #15121c; }
.vfeat__text h3:not(:first-child) { margin-top: 26px; }
.vfeat__text p { margin-top: 12px; font-size: 15.5px; line-height: 1.8; color: #3d3b46; }
.vfeat__art { display: flex; justify-content: center; }
.vfa { width: 100%; max-width: 430px; height: auto; overflow: visible; }
.vfa__spin { transform-origin: 200px 150px; animation: vfaSpin 40s linear infinite; }
.vfa__spin--rev { animation-duration: 28s; animation-direction: reverse; }
@keyframes vfaSpin { to { transform: rotate(360deg); } }
.vfa__pulse { transform-origin: 200px 150px; animation: vfaPulse 2.6s ease-out infinite; }
@keyframes vfaPulse { 0% { opacity: .8; transform: scale(1); } 100% { opacity: 0; transform: scale(1.9); } }
.vfa__dash { animation: vfaDash 6s linear infinite; }
@keyframes vfaDash { to { stroke-dashoffset: -90; } }
.vfa__dot { transform-box: fill-box; transform-origin: center; animation: vfaDot 2.4s ease-in-out infinite; }
.vfa__dot--2 { animation-delay: .6s; } .vfa__dot--3 { animation-delay: 1.2s; } .vfa__dot--4 { animation-delay: 1.8s; }
@keyframes vfaDot { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.35); } }
@media (max-width: 900px) {
  .vfeat { padding: 60px 0; }
  .vfeat__row { grid-template-columns: 1fr; gap: 30px; }
  .vfeat__row + .vfeat__row { margin-top: 60px; }
  .vfeat__row--rev .vfeat__text { order: 0; }
  .vfa { max-width: 340px; }
}

/* =====================================================================
   v37 – VPS: „De ce să alegi un Server VPS” (fundal închis)
   ===================================================================== */
.vwhy { padding: 90px 0 100px; background: radial-gradient(ellipse 70% 50% at 50% 0%, rgba(60, 70, 140, .25), transparent 70%), #0f1020; color: #e9e9f2; }
.vwhy__head { max-width: 860px; margin: 0 auto 44px; text-align: center; }
.vwhy__head h2 { font-size: clamp(26px, 3.3vw, 38px); line-height: 1.25; color: #fff; }
.vwhy__head p { margin-top: 16px; font-size: 15.5px; line-height: 1.7; color: #a9aac0; }
.vwhy__head strong { color: #fff; }
.vwhy__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; max-width: 1100px; margin: 0 auto; }
.vwhy__card { padding: 28px 30px; border-radius: 14px; background: rgba(255, 255, 255, .025); border: 1px solid rgba(255, 255, 255, .09); transition: border-color .25s, background .25s, transform .25s; }
.vwhy__card:hover { border-color: rgba(255, 106, 43, .4); background: rgba(255, 255, 255, .045); transform: translateY(-3px); }
.vwhy__title { display: flex; align-items: center; gap: 14px; }
.vwhy__title h3 { font-family: 'Inter', sans-serif; font-size: 16.5px; font-weight: 700; color: #fff; }
.vwhy__ico { display: grid; place-items: center; width: 42px; height: 42px; flex-shrink: 0; border-radius: 8px; color: #fff; }
.vwhy__ico svg { width: 22px; height: 22px; }
.vwhy__ico--blue { background: #2f6bf0; } .vwhy__ico--green { background: #1f9d55; }
.vwhy__ico--yellow { background: #f5b400; } .vwhy__ico--cyan { background: #18b7e0; }
.vwhy__card p { margin-top: 18px; font-size: 15px; line-height: 1.75; color: #a9aac0; }
.vwhy__card strong { color: #fff; }
.vwhy__use { display: grid; grid-template-columns: 1.55fr 1fr; gap: 34px; align-items: center; max-width: 1100px; margin: 36px auto 0; padding: 34px 34px; border-radius: 14px; background: rgba(255, 255, 255, .025); border: 1px solid rgba(255, 255, 255, .09); }
.vwhy__use h3 { font-family: 'Inter', sans-serif; font-size: 19px; font-weight: 700; color: #fff; }
.vwhy__use-main > p { margin-top: 14px; font-size: 15px; line-height: 1.7; color: #a9aac0; }
.vwhy__use ul { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 24px; margin: 22px 0 0; padding: 0; }
.vwhy__use li { position: relative; padding-left: 26px; font-size: 14.5px; font-weight: 600; color: #fff; }
.vwhy__use li::before { content: ''; position: absolute; left: 0; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: #1f9d55 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4.5 8.3 2.2 2.2 4.8-5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px no-repeat; }
.vwhy__custom { padding: 26px 26px 30px; border-radius: 12px; background: #090a14; border: 1px solid rgba(255, 255, 255, .1); text-align: center; }
.vwhy__custom h4 { font-family: 'Inter', sans-serif; font-size: 16.5px; font-weight: 700; color: #fff; }
.vwhy__custom p { margin-top: 10px; font-size: 14.5px; line-height: 1.65; color: #a9aac0; }
.vwhy__btn { margin-top: 20px; padding: 14px 28px; border-radius: 999px; background: #ff4f12; color: #fff; font-weight: 700; box-shadow: 0 10px 26px rgba(255, 79, 18, .35); }
.vwhy__btn:hover { background: #ff6630; transform: translateY(-2px); }
@media (max-width: 900px) {
  .vwhy { padding: 60px 0; }
  .vwhy__grid, .vwhy__use { grid-template-columns: 1fr; }
  .vwhy__use { padding: 26px 22px; }
}
@media (max-width: 520px) { .vwhy__use ul { grid-template-columns: 1fr; } .vwhy__card { padding: 24px 20px; } }

/* =====================================================================
   v38 – VPS: „Toate pachetele includ” (deasupra tabelelor de prețuri)
   ===================================================================== */
.vinc { padding: 80px 0 30px; background: #fff; color: #15121c; }
.vinc + .pricing { padding-top: 60px; }
.vinc__head { text-align: center; margin-bottom: 56px; }
.vinc__head h2 { font-size: clamp(30px, 4vw, 48px); color: #15121c; letter-spacing: -.01em; }
.vinc__head p { margin-top: 12px; font-size: clamp(18px, 2.2vw, 30px); color: #2a2733; }
.vinc__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.vinc__card { display: flex; align-items: flex-start; gap: 20px; padding: 30px 30px 34px; border-radius: 10px; background: #fff; box-shadow: 0 4px 24px rgba(20, 20, 40, .07); transition: transform .25s, box-shadow .25s; }
.vinc__card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(255, 79, 18, .12); }
.vinc__ico { display: grid; place-items: center; flex-shrink: 0; width: 64px; height: 64px; border-radius: 8px; background: #fff4ed; color: #ff4f12; }
.vinc__ico svg { width: 30px; height: 30px; }
.vinc__card h3 { font-family: 'Inter', sans-serif; font-size: 20px; font-weight: 700; color: #15121c; }
.vinc__card p { margin-top: 6px; font-size: 18px; line-height: 1.6; color: #2f2b38; }
@media (max-width: 1100px) { .vinc__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) {
  .vinc { padding: 56px 0 10px; }
  .vinc__grid { grid-template-columns: 1fr; gap: 18px; }
  .vinc__card { padding: 22px 20px; }
  .vinc__ico { width: 52px; height: 52px; }
  .vinc__card h3 { font-size: 18px; } .vinc__card p { font-size: 16px; }
}
@media (min-width: 1201px) {
  .vinc__grid { --pw: min(1620px, calc(100vw - 48px)); width: var(--pw); margin-left: calc((100% - var(--pw)) / 2); }
}

/* =====================================================================
   v39 – Găzduire partajată: „Toate pachetele includ” (9 carduri)
   ===================================================================== */
.hinc { padding: 80px 0 90px; background: #fff; color: #15121c; }
.hinc__head { margin-bottom: 44px; }
.hinc .hinc__head h2 { color: #15121c; }
.hinc .hinc__head p { max-width: 540px; margin-inline: auto; color: #2f2b38; }
.hinc__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1080px; margin: 0 auto; }
.hinc__card { display: flex; align-items: flex-start; gap: 16px; padding: 22px 22px 22px 20px; border-radius: 8px; background: #fff; box-shadow: 0 6px 28px rgba(20, 20, 40, .07); transition: transform .25s, box-shadow .25s; }
.hinc__card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(75, 79, 168, .14); }
.hinc__ico { flex-shrink: 0; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: #f3f3fb; }
.hinc__ico svg { width: 34px; height: 34px; }
.hinc__card h3 { font-family: 'Outfit', 'Inter', sans-serif; font-size: 17px; font-weight: 600; color: #15121c; }
.hinc__card p { margin-top: 4px; font-size: 14px; line-height: 1.6; color: #2f2b38; }
@media (max-width: 1000px) { .hinc__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .hinc { padding: 56px 0 60px; } .hinc__grid { grid-template-columns: 1fr; } }

/* =====================================================================
   v40 – Găzduire partajată: „Ce este Găzduirea Web Partajată” + ilustrație animată
   ===================================================================== */
.hwhat { padding: 80px 0 90px; background: radial-gradient(ellipse 60% 60% at 80% 40%, rgba(40, 50, 120, .25), transparent 70%), #10111f; color: #fff; overflow: clip; }
.hwhat__box { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; padding: 30px 20px; background: linear-gradient(135deg, rgba(255,255,255,.015), rgba(0,0,0,.25)); }
.hwhat__text h2 { font-size: clamp(28px, 3.2vw, 38px); line-height: 1.25; color: #fff; }
.hwhat__lead, .hwhat__foot { margin-top: 18px; font-size: 16px; line-height: 1.8; color: #a9aac0; }
.hwhat__lead strong, .hwhat__foot strong, .hwhat__list strong { color: #fff; }
.hwhat__text h3 { margin-top: 26px; font-family: 'Inter', sans-serif; font-size: 18px; font-weight: 700; color: #fff; }
.hwhat__list { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 18px 22px; margin: 18px 0 0; padding: 0; }
.hwhat__list li { position: relative; padding-left: 24px; font-size: 14.5px; line-height: 1.6; color: #d6d7e6; }
.hwhat__list li::before { content: ''; position: absolute; left: 0; top: 6px; width: 12px; height: 7px; border-left: 2.4px solid #ff5a1f; border-bottom: 2.4px solid #ff5a1f; transform: rotate(-45deg); }
.hwhat__foot { margin-top: 26px; }

/* Ilustrația */
.hwhat__art { display: flex; justify-content: center; }
.hws { position: relative; width: 100%; max-width: 420px; aspect-ratio: 400 / 280; }
.hws__frame { position: absolute; inset: 0 2%; border: 1px dashed rgba(255,255,255,.18); }
.hws__orbit { position: absolute; left: 22%; top: -4%; width: 60%; aspect-ratio: 1; border-radius: 50%; border: 1px dashed rgba(255,255,255,.14); animation: hwsSpin 30s linear infinite; }
.hws__tri { position: absolute; right: 0; top: 0; width: 0; height: 0; border-left: 30px solid transparent; border-top: 22px solid transparent; border-bottom: 160px solid #ff3d1f; transform: skewY(-12deg); opacity: .95; }
.hws__dot { position: absolute; left: -2%; top: 30%; width: 13px; height: 13px; border-radius: 50%; background: #ff3d1f; animation: hwsPing 2s ease-out infinite; }
.hws__ring { position: absolute; right: 4%; bottom: -4%; width: 34px; height: 34px; border-radius: 50%; border: 1px dashed rgba(255,255,255,.25); }
.hws__site { position: absolute; left: 4%; right: 4%; top: 10%; bottom: 6%; border-radius: 8px; overflow: hidden; background: radial-gradient(ellipse at 20% 0%, #3a1f3f, transparent 60%), #0b0b12; box-shadow: 0 30px 60px rgba(0,0,0,.55); border: 1px solid rgba(255,255,255,.08); animation: hwsFloat 6s ease-in-out infinite; }
.hws__nav { display: flex; align-items: center; justify-content: space-between; padding: 9px 14px; }
.hws__logo { display: flex; align-items: center; gap: 5px; font-size: 7.5px; font-weight: 800; letter-spacing: .08em; color: #fff; }
.hws__logo i { width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid #ff6a2b; }
.hws__menu { display: flex; gap: 12px; font-size: 6px; font-weight: 700; color: #b9b9c8; }
.hws__menu b { color: #ff6a2b; border-bottom: 1px solid #ff6a2b; }
.hws__body { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 6px 16px 0; height: calc(100% - 30px); }
.hws__copy strong { display: block; margin-top: 18px; font-family: 'Outfit', sans-serif; font-size: clamp(13px, 1.7vw, 19px); line-height: 1.12; color: #fff; }
.hws__line { display: block; height: 3px; margin-top: 6px; width: 85%; border-radius: 2px; background: rgba(255,255,255,.14); }
.hws__copy strong + .hws__line { margin-top: 12px; }
.hws__line--s { width: 60%; }
.hws__cta { display: inline-block; margin-top: 12px; padding: 4px 10px; border-radius: 999px; background: #ff5a1f; font-size: 7px; font-weight: 700; color: #fff; }
.hws__hero { position: relative; margin-top: 4px; border-radius: 40px 40px 6px 6px; overflow: hidden; height: 88%; }
.hws__hero svg { display: block; width: 100%; height: 100%; }
.hws__sun { animation: hwsGlow 4s ease-in-out infinite; transform-origin: 80px 78px; }
.hws__card { position: absolute; left: 10%; right: 10%; bottom: 6%; display: grid; gap: 3px; padding: 6px 8px; border-radius: 4px; background: #fff; }
.hws__card i { height: 2px; border-radius: 1px; background: #c9c9d3; }
.hws__card i:last-child { width: 60%; }
.hws__social { position: absolute; right: 6px; top: 40%; display: grid; gap: 5px; }
.hws__social i { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.6); }
.hws__arc { position: absolute; left: 34%; bottom: -26px; width: 52px; height: 52px; border-radius: 50%; background: #ff3d1f; box-shadow: 0 0 0 8px rgba(255,61,31,.15), 0 0 0 16px rgba(255,61,31,.07); }
.hws__star { position: absolute; left: 47%; top: 44%; font-size: 26px; color: #fff; line-height: 1; animation: hwsSpin 8s linear infinite; }
.hws__badge { position: absolute; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 6px; font-size: 12px; font-weight: 600; color: #fff; white-space: nowrap; backdrop-filter: blur(8px); box-shadow: 0 10px 24px rgba(0,0,0,.35); }
.hws__badge svg { width: 14px; height: 14px; }
.hws__badge--ssl { left: 22%; top: 3%; background: rgba(28, 60, 50, .92); border: 1px solid rgba(80, 200, 140, .35); animation: hwsBob 5s ease-in-out infinite; }
.hws__badge--ssl svg { color: #6ee7a8; }
.hws__badge--ls { left: -1%; top: 56%; background: rgba(48, 40, 90, .92); border: 1px solid rgba(150, 130, 255, .35); animation: hwsBob 6s ease-in-out -2s infinite; }
.hws__badge--ls svg { color: #b6a6ff; }
.hws__badge--mw { right: 9%; bottom: 2%; background: rgba(20, 50, 70, .92); border: 1px solid rgba(90, 190, 240, .35); animation: hwsBob 5.5s ease-in-out -1s infinite; }
.hws__badge--mw svg { color: #7cd3ff; }
.hws__cursor { position: absolute; left: 47%; top: 8%; width: 30px; height: 30px; filter: drop-shadow(0 4px 8px rgba(0,0,0,.4)); animation: hwsCursor 7s ease-in-out infinite; }
@keyframes hwsSpin { to { transform: rotate(360deg); } }
@keyframes hwsFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes hwsBob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes hwsPing { 0% { box-shadow: 0 0 0 0 rgba(255,61,31,.6); } 100% { box-shadow: 0 0 0 16px rgba(255,61,31,0); } }
@keyframes hwsGlow { 0%, 100% { transform: scale(1); opacity: .85; } 50% { transform: scale(1.08); opacity: 1; } }
@keyframes hwsCursor { 0%, 100% { transform: translate(0, 0); } 30% { transform: translate(60px, 70px); } 55% { transform: translate(110px, 30px); } 80% { transform: translate(20px, 50px); } }

/* Banda WordPress */
.hwp { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-top: 50px; padding: 36px 40px; border-radius: 16px; background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.1); }
.hwp__tag { display: inline-flex; align-items: center; gap: 10px; }
.hwp__wp { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #fff; color: #e2371c; font-family: Georgia, serif; font-size: 14px; font-weight: 700; box-shadow: inset 0 0 0 2px #e2371c; }
.hwp__tag em { padding: 2px 8px; border-radius: 4px; background: #ffc107; color: #15121c; font-size: 11.5px; font-style: normal; font-weight: 700; }
.hwp h3 { margin-top: 12px; font-family: 'Inter', sans-serif; font-size: 22px; font-weight: 700; color: #fff; }
.hwp p { margin-top: 8px; max-width: 640px; font-size: 15px; line-height: 1.6; color: #a9aac0; }
.hwp__btn { flex-shrink: 0; gap: 10px; padding: 16px 26px; border-radius: 999px; background: #ff4f12; color: #fff; font-weight: 700; box-shadow: 0 12px 28px rgba(255,79,18,.35); }
.hwp__btn svg { width: 16px; height: 16px; transition: transform .2s; }
.hwp__btn:hover { background: #ff6630; transform: translateY(-2px); }
.hwp__btn:hover svg { transform: translateX(3px); }
@media (max-width: 960px) {
  .hwhat { padding: 60px 0; }
  .hwhat__box { grid-template-columns: 1fr; gap: 50px; padding: 10px 0; }
  .hws { max-width: 460px; }
  .hwp { flex-direction: column; align-items: flex-start; padding: 28px 24px; }
}
@media (max-width: 560px) {
  .hwhat__list { grid-template-columns: 1fr; }
  .hws__badge { font-size: 10.5px; padding: 6px 10px; }
  .hws__cursor { display: none; }
}
.hws { max-width: 520px; } .hws__badge { font-size: 13px; }

/* =====================================================================
   v41 – WordPress: „Toate pachetele WordPress includ” (deasupra prețurilor)
   ===================================================================== */
.winc { padding: 80px 0 40px; background: #fff; color: #15121c; }
.winc + .pricing { padding-top: 60px; }
.winc__head { margin-bottom: 50px; }
.winc .winc__head h2 { color: #15121c; }
.winc .winc__head p { max-width: 860px; margin-inline: auto; color: #2f2b38; }
.winc__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px 26px; }
.winc__card { display: flex; align-items: flex-start; gap: 18px; padding: 26px 24px 28px; border-radius: 8px; background: #fff; box-shadow: 0 6px 30px rgba(20, 20, 40, .06); transition: transform .25s, box-shadow .25s; }
.winc__card:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(255, 79, 18, .12); }
.winc__ico { flex-shrink: 0; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #fff1e9; color: #ff4f12; }
.winc__ico svg { width: 24px; height: 24px; }
.winc__card h3 { font-family: 'Outfit', 'Inter', sans-serif; font-size: 19px; font-weight: 600; color: #15121c; }
.winc__card p { margin-top: 6px; font-size: 15px; line-height: 1.65; color: #2f2b38; }
@media (min-width: 1201px) {
  .winc__grid { --pw: min(1300px, calc(100vw - 48px)); width: var(--pw); margin-left: calc((100% - var(--pw)) / 2); }
}
@media (max-width: 1000px) { .winc__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .winc { padding: 56px 0 20px; } .winc__grid { grid-template-columns: 1fr; } .winc__card { padding: 22px 18px; } }

/* =====================================================================
   v42 – WordPress: „De Ce Să Alegi Găzduirea Web WordPress Dedicată?”
   (refolosește stilurile .hwhat / .hwp + ilustrația .wpm)
   ===================================================================== */
.wwhy .hwhat__text h2 { font-size: clamp(30px, 3.6vw, 44px); line-height: 1.18; }
.wwhy__grad { background: linear-gradient(90deg, #ff6a4d, #ff8a3d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.wwhy__cart { width: 22px; height: 22px; fill: none; }
.wpm { position: relative; width: 100%; max-width: 440px; aspect-ratio: 440 / 300; }
.wpm__orbit { position: absolute; left: 10%; right: 4%; top: -8%; bottom: -8%; border-radius: 50%; border: 1px dashed rgba(255,255,255,.14); animation: hwsSpin 40s linear infinite; }
.wpm__win { position: absolute; left: 12%; right: 0; top: 4%; bottom: 4%; border-radius: 6px; overflow: hidden; background: #0d0b1d; border: 1px solid rgba(255,255,255,.12); box-shadow: 0 30px 60px rgba(0,0,0,.5); animation: hwsFloat 6s ease-in-out infinite; }
.wpm__bar { display: flex; align-items: center; gap: 4px; padding: 6px 8px; background: #1b1930; }
.wpm__bar i { width: 5px; height: 5px; border-radius: 50%; background: #4a4766; }
.wpm__bar span { flex: 1; max-width: 45%; height: 6px; margin-left: 20%; border-radius: 3px; background: #2c2a45; }
.wpm__page { position: relative; height: calc(100% - 17px); padding: 8px 14px; text-align: center; background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(124, 58, 237, .35), transparent 70%), #110e26; }
.wpm__nav { display: flex; align-items: center; gap: 8px; font-size: 5px; color: #cfcde6; }
.wpm__logo { width: 10px; height: 10px; border-radius: 50%; background: linear-gradient(135deg, #a78bfa, #7c3aed); }
.wpm__links { display: flex; gap: 7px; margin-left: auto; }
.wpm__links i { font-style: normal; }
.wpm__login { margin-left: 10px; }
.wpm__btn { padding: 2px 6px; border-radius: 2px; background: #ff4f8b; color: #fff; }
.wpm__title { display: block; margin-top: 14px; font-family: 'Outfit', sans-serif; font-size: clamp(10px, 1.35vw, 15px); line-height: 1.2; letter-spacing: .02em; color: #fff; }
.wpm__title em { font-style: normal; background: linear-gradient(90deg, #ff4f8b, #ff8a3d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.wpm__sub { display: block; margin-top: 4px; font-size: 6px; letter-spacing: .14em; color: #a6a3c4; }
.wpm__img { position: relative; display: grid; place-items: center; width: 48%; aspect-ratio: 2.2; margin: 8px auto 0; border-radius: 3px; overflow: hidden; background: #3a3850; color: #8f8cab; }
.wpm__img svg { width: 22px; height: 22px; }
.wpm__shine { position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.18) 50%, transparent 70%); transform: translateX(-100%); animation: wpmShine 3.5s ease-in-out infinite; }
.wpm__cta { position: relative; display: inline-block; margin-top: -6px; padding: 3px 10px; border-radius: 999px; background: linear-gradient(90deg, #ff4f8b, #ff8a3d); font-size: 5.5px; font-weight: 700; color: #fff; box-shadow: 0 4px 12px rgba(255, 79, 139, .45); animation: wpmPulse 2.4s ease-in-out infinite; }
.wpm__cards { position: absolute; left: 14px; right: 14px; bottom: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.wpm__cards span { padding: 5px 6px 10px; border-radius: 3px 3px 0 0; background: #1d1a35; text-align: left; }
.wpm__cards b { display: block; font-size: 5.5px; letter-spacing: .06em; color: #fff; }
.wpm__cards i { display: block; height: 3px; margin-top: 4px; border-radius: 2px; background: #34314f; }
.wpm__tile { position: absolute; left: 0; top: 42%; display: grid; place-items: center; width: 22%; aspect-ratio: 1; border-radius: 14px; background: #1c1b26; border: 1px solid rgba(255,255,255,.14); box-shadow: 0 18px 40px rgba(0,0,0,.5); animation: hwsBob 5s ease-in-out infinite; }
.wpm__tile svg { width: 58%; height: 58%; }
.wpm__speed { position: absolute; right: -2%; bottom: 0; padding: 7px 12px; border-radius: 8px; background: rgba(20, 60, 45, .92); border: 1px solid rgba(80, 200, 140, .35); font-size: 12px; color: #c7f5dc; box-shadow: 0 10px 24px rgba(0,0,0,.35); animation: hwsBob 6s ease-in-out -2s infinite; }
.wpm__speed b { color: #6ee7a8; }
@keyframes wpmShine { 0%, 40% { transform: translateX(-100%); } 80%, 100% { transform: translateX(100%); } }
@keyframes wpmPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.08); } }
.wwhy .hwp em { white-space: nowrap; }
@media (max-width: 960px) { .wpm { max-width: 480px; } }

/* WordPress: banda e-commerce pe fundal deschis, sub secțiunea închisă (ca în model) */
.wshop { padding: 30px 0; background: #f4f4f5; }
.wshop .hwp { max-width: 820px; margin: 0 auto; padding: 30px 30px; border-radius: 10px; background: #1b1b2b; border: 1px solid rgba(255,255,255,.08); box-shadow: 0 14px 40px rgba(20,20,40,.18); }
.wshop .hwp h3 { font-size: 19px; margin-top: 8px; }
.wshop .hwp p { font-size: 13.5px; color: #9a9bb2; }
.wshop .hwp__btn { padding: 13px 22px; font-size: 14px; }
.wwhy { padding-bottom: 60px; }
.wwhy .hwhat__box { max-width: 1000px; margin: 0 auto; background: none; }
.wpm__title em + br + * em, .wpm__title em:last-child { background: linear-gradient(90deg, #ff4f8b, #ff8a3d); -webkit-background-clip: text; background-clip: text; color: transparent; }
@media (max-width: 960px) { .wshop .hwp { padding: 26px 22px; } }
.wwhy .hwhat__text h2 { font-size: clamp(28px, 3.1vw, 40px); } .wwhy .hwhat__box { grid-template-columns: 1.1fr .9fr; gap: 50px; }
@media (max-width: 960px) { .wwhy .hwhat__box { grid-template-columns: 1fr; } }

/* Business: „De ce să alegi HostEasy pentru afacerea ta?” (refolosește .rfeat) */
.bwhy .rfeat__grid { max-width: 820px; margin: 0 auto; gap: 16px; }
.bwhy .rfeat__card { padding: 22px 16px 34px; }
.bwhy .rfeat__icon { width: 36px; height: 36px; }
.bwhy .rfeat__icon svg { width: 20px; height: 20px; }
.bwhy .rfeat__card h3 { margin-top: 18px; font-size: 13px; }
.bwhy .rfeat__card p { margin-top: 10px; font-size: 13px; line-height: 1.6; }
.bwhy .rfeat__head h2 { max-width: 520px; margin-inline: auto; }
.bwhy .rfeat__head p { max-width: 500px; font-size: 15px; }
@media (min-width: 1100px) { .bwhy .rfeat__grid { max-width: 820px; } }
.bwhy .rfeat__grid { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 880px) { .bwhy .rfeat__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .bwhy .rfeat__grid { grid-template-columns: 1fr; } }

/* Business „De ce să alegi HostEasy” – varianta mare, ca în model */
.bwhy .rfeat__head h2 { max-width: 900px; font-size: clamp(30px, 3.6vw, 54px); line-height: 1.2; }
.bwhy .rfeat__head p { max-width: 940px; font-size: clamp(16px, 1.7vw, 26px); line-height: 1.7; }
.bwhy .rfeat__grid { max-width: none; gap: 30px; }
.bwhy .rfeat__card { padding: 44px 30px 60px; }
.bwhy .rfeat__icon { width: 72px; height: 72px; border-radius: 6px; }
.bwhy .rfeat__icon svg { width: 36px; height: 36px; }
.bwhy .rfeat__card h3 { margin-top: 36px; font-size: 19px; }
.bwhy .rfeat__card p { margin-top: 18px; font-size: clamp(15px, 1.25vw, 20px); line-height: 1.7; }
@media (min-width: 1201px) {
  .bwhy .rfeat__grid { --pw: min(1620px, calc(100vw - 48px)); width: var(--pw); margin-left: calc((100% - var(--pw)) / 2); }
}
@media (max-width: 1100px) { .bwhy .rfeat__card { padding: 30px 22px 40px; } .bwhy .rfeat__icon { width: 58px; height: 58px; } .bwhy .rfeat__icon svg { width: 28px; height: 28px; } .bwhy .rfeat__card h3 { margin-top: 24px; } }
.bwhy .rfeat__head p { max-width: 980px; }
/* Business „De ce să alegi” – puțin mai mic */
.bwhy .rfeat__head h2 { font-size: clamp(28px, 3vw, 44px); }
.bwhy .rfeat__head p { max-width: 820px; font-size: clamp(15px, 1.4vw, 21px); }
.bwhy .rfeat__grid { gap: 24px; }
.bwhy .rfeat__card { padding: 34px 26px 46px; }
.bwhy .rfeat__icon { width: 60px; height: 60px; }
.bwhy .rfeat__icon svg { width: 30px; height: 30px; }
.bwhy .rfeat__card h3 { margin-top: 26px; font-size: 17px; }
.bwhy .rfeat__card p { margin-top: 14px; font-size: clamp(14.5px, 1.05vw, 17px); }
@media (min-width: 1201px) {
  .bwhy .rfeat__grid { --pw: min(1360px, calc(100vw - 48px)); }
}
.bwhy .rfeat__head h2 { max-width: 720px; }

/* =====================================================================
   v43 – Selector de limbă cu steaguri + traducere automată (Google Translate)
   ===================================================================== */
.lflag { display: inline-block; width: 22px; height: 15px; flex-shrink: 0; border-radius: 3px; box-shadow: 0 0 0 1px rgba(255,255,255,.18); vertical-align: middle; overflow: hidden; }
.pill--lang { gap: 8px; }
.dropdown__item .lflag { margin-right: 2px; }
.mlangs { display: flex; gap: 10px; margin-top: 6px; }
.mlang { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px; border-radius: 12px; border: 1px solid rgba(255,255,255,.12); color: #fff; font-size: 14px; }
.mlang b { font-weight: 600; }
.mlang.is-active { border-color: #ff5a1f; background: rgba(255,90,31,.12); }
.mlang.is-disabled { opacity: .5; }
.mlang small { font-size: 11px; color: #9a9bb2; }

/* Ascundem bara și balonașele Google Translate, ca site-ul să arate normal în engleză */
.is-translated body { top: 0 !important; position: static !important; }
body > .skiptranslate, iframe.skiptranslate, .goog-te-banner-frame, #goog-gt-tt, .goog-te-balloon-frame,
.VIpgJd-ZVi9od-ORHb-OEVmcd, .VIpgJd-ZVi9od-aZ2wEe-wOHMyf, .VIpgJd-yAWNEb-L7lbkb { display: none !important; }
.goog-text-highlight { background: none !important; box-shadow: none !important; }
font[style] { background: none !important; box-shadow: none !important; }

/* Lista de limbi din bara de sus nu mai e tăiată (bara ascundea tot ce ieșea din ea) */
.topbar { overflow: visible; position: relative; z-index: 60; }
.header.scrolled .topbar { overflow: hidden; pointer-events: none; }
.topbar .pill-drop .dropdown { z-index: 70; }

/* =====================================================================
   v44 – Pagina de contact: date de contact (stânga) + formular modern (dreapta)
   ===================================================================== */
.cx2 { padding: 90px 0 100px; background: #f5f7fc; color: #15121c; }
.cx2__grid { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 34px; align-items: stretch; }

/* Stânga – card închis */
.cx2__info { position: relative; overflow: hidden; padding: 40px 34px; border-radius: 22px; color: #fff;
  background: radial-gradient(ellipse 80% 50% at 100% 0%, rgba(255, 90, 31, .28), transparent 60%), linear-gradient(160deg, #1a1830 0%, #10101d 100%);
  box-shadow: 0 24px 60px rgba(20, 20, 50, .22); }
.cx2__glow { position: absolute; right: -80px; bottom: -80px; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, rgba(124, 58, 237, .35), transparent 70%); pointer-events: none; }
.cx2__info h2 { position: relative; font-size: 28px; color: #fff; }
.cx2__lead { position: relative; margin-top: 10px; font-size: 15px; line-height: 1.7; color: #b4b5c9; }
.cx2__list { position: relative; list-style: none; display: grid; gap: 14px; margin: 28px 0 0; padding: 0; }
.cx2__list li { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 14px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07); transition: background .2s, border-color .2s, transform .2s; }
.cx2__list li:hover { background: rgba(255,255,255,.07); border-color: rgba(255, 90, 31, .35); transform: translateX(3px); }
.cx2__ico { display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; border-radius: 12px; background: linear-gradient(135deg, #ff7a2f, #ff3b3b); color: #fff; box-shadow: 0 8px 20px rgba(255, 79, 18, .35); }
.cx2__ico svg { width: 20px; height: 20px; }
.cx2__ico--wa { background: linear-gradient(135deg, #34d36b, #1ea952); box-shadow: 0 8px 20px rgba(37, 211, 102, .3); }
.cx2__list small { display: block; font-size: 12px; color: #9a9bb2; }
.cx2__list a, .cx2__list b { display: block; font-size: 15.5px; font-weight: 700; color: #fff; word-break: break-word; }
.cx2__list a:hover { color: #ffb08a; }
.cx2__sub { margin-top: 2px; }
.cx2__sub span { color: #d6d7e6; }
.cx2__company { position: relative; margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.1); }
.cx2__company h3 { font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 700; color: #fff; }
.cx2__company dl { display: grid; gap: 8px; margin: 12px 0 0; }
.cx2__company dl div { display: flex; justify-content: space-between; gap: 14px; font-size: 14px; }
.cx2__company dt { color: #9a9bb2; }
.cx2__company dd { margin: 0; font-weight: 600; color: #fff; text-align: right; }
.cx2__client { position: relative; display: grid; gap: 12px; margin-top: 24px; padding: 18px; border-radius: 14px; background: rgba(255, 90, 31, .1); border: 1px solid rgba(255, 90, 31, .3); }
.cx2__client b { display: block; font-size: 15px; color: #fff; }
.cx2__client span { display: block; margin-top: 4px; font-size: 13.5px; line-height: 1.6; color: #c9cadb; }
.cx2__ticket { justify-self: start; padding: 11px 20px; border-radius: 999px; background: #fff; color: #15121c; font-weight: 700; font-size: 14px; }
.cx2__ticket:hover { background: #ffe6d9; }

/* Dreapta – formular */
.cx2__form { padding: 40px 40px 34px; border-radius: 22px; background: #fff; box-shadow: 0 20px 60px rgba(20, 30, 70, .08); }
.cx2__head { text-align: center; margin-bottom: 34px; }
.cx2__head h2 { font-size: clamp(28px, 3vw, 40px); color: #15121c; }
.cx2__head p { margin-top: 8px; font-size: 17px; color: #2f2b38; }
.cx2__row { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.fl { position: relative; display: block; margin-bottom: 26px; }
.fl > span { position: absolute; left: 16px; top: -10px; z-index: 1; padding: 1px 10px; border-radius: 4px; background: #fff; font-family: 'Outfit', 'Inter', sans-serif; font-size: 14.5px; font-weight: 600; color: #15121c; transition: color .2s; }
.fl input, .fl select, .fl textarea {
  width: 100%; padding: 22px 22px 18px; border-radius: 6px; border: 1px solid #e3e6ee; background: #fff;
  font: inherit; font-size: 16px; color: #15121c; transition: border-color .2s, box-shadow .2s;
}
.fl textarea { resize: vertical; min-height: 180px; }
.fl input::placeholder, .fl textarea::placeholder { color: #8a8793; }
.fl input:focus, .fl select:focus, .fl textarea:focus { outline: 0; border-color: #ff4f12; box-shadow: 0 0 0 4px rgba(255, 79, 18, .1); }
.fl:focus-within > span { color: #ff4f12; }
.fl--select select { appearance: none; -webkit-appearance: none; cursor: pointer; padding-right: 46px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a8793' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 16px center / 18px no-repeat; }
.cx2__gdpr { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.6; color: #4a4955; cursor: pointer; }
.cx2__gdpr input { width: 18px; height: 18px; margin-top: 2px; flex-shrink: 0; accent-color: #ff4f12; }
.cx2__gdpr a { color: #ff4f12; text-decoration: underline; }
.cx2__form .recaptcha { margin-top: 18px; }
.cx2__send { display: flex; justify-content: center; margin-top: 28px; }
.cx2__btn { gap: 10px; padding: 18px 36px; border-radius: 999px; background: #ff4f12; color: #fff; font-family: 'Outfit', 'Inter', sans-serif; font-size: 16px; font-weight: 600; box-shadow: 0 14px 30px rgba(255, 79, 18, .3); }
.cx2__btn svg { width: 16px; height: 16px; transition: transform .2s; }
.cx2__btn:hover { background: #ff6630; transform: translateY(-2px); }
.cx2__btn:hover svg { transform: translateX(3px); }
.cx2__btn:disabled { opacity: .6; transform: none; }
.cx2__form .form-status { margin-top: 16px; text-align: center; }

@media (max-width: 1000px) {
  .cx2__grid { grid-template-columns: 1fr; }
  .cx2__info { order: 2; }
}
@media (max-width: 640px) {
  .cx2 { padding: 60px 0; }
  .cx2__form, .cx2__info { padding: 28px 20px; border-radius: 18px; }
  .cx2__row { grid-template-columns: 1fr; gap: 0; }
}

/* =====================================================================
   v45 – Reseller web: hero mov cu panou WHM/cPanel animat
   ===================================================================== */
.rhero { position: relative; overflow: hidden; padding: 170px 0 90px; color: #fff; background: linear-gradient(100deg, #1e1a2c 0%, #2a1c3c 45%, #3d1d45 75%, #461c3c 100%); }
.rhero__bg { position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 60px 60px; mask-image: linear-gradient(180deg, transparent, #000 25%, #000 80%, transparent); }
.rhero__bg::after { content: ''; position: absolute; right: -10%; top: 10%; width: 50%; height: 80%; border-radius: 50%; background: radial-gradient(circle, rgba(255, 79, 139, .18), transparent 65%); }
.rhero__inner { position: relative; display: grid; grid-template-columns: 1fr 1.05fr; gap: 50px; align-items: center; }

/* Text */
.rhero h1 { display: grid; line-height: 1.02; }
.rhero__thin { font-family: 'Inter', sans-serif; font-weight: 300; font-size: clamp(38px, 4.6vw, 70px); letter-spacing: -.01em; }
.rhero__bold { font-family: 'Outfit', sans-serif; font-weight: 800; font-size: clamp(40px, 4.8vw, 74px); letter-spacing: -.01em; }
.rhero__where { display: flex; align-items: center; gap: 8px; margin-top: 10px; font-family: 'Outfit', sans-serif; font-size: 22px; font-weight: 700; }
.rhero__flag { width: 34px; height: 34px; }
.rhero__lead { margin-top: 26px; max-width: 760px; font-size: clamp(16px, 1.45vw, 21px); line-height: 1.6; color: #e4ddf0; font-weight: 300; }
.rhero__cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 40px; }
.rh-card { position: relative; min-height: 150px; padding: 66px 18px 20px; border-radius: 20px; background: linear-gradient(160deg, rgba(255,255,255,.16), rgba(255,255,255,.05)); border: 1px solid rgba(255,255,255,.18); backdrop-filter: blur(10px); transition: transform .25s, background .25s; }
.rh-card:hover { transform: translateY(-5px); background: linear-gradient(160deg, rgba(255,255,255,.22), rgba(255,255,255,.08)); }
.rh-card__i { position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 64px; height: 52px; border-radius: 20px 0 22px 0; background: #2a1c3c; color: #ff8a5c; }
.rh-card__i svg { width: 26px; height: 26px; }
.rh-card p { font-size: 16.5px; line-height: 1.35; color: #fff; }
.rhero__btn { margin-top: 40px; gap: 18px; padding: 18px 32px; border-radius: 10px; background: #0d1520; color: #fff; font-size: 18px; font-weight: 400; box-shadow: 0 14px 30px rgba(0,0,0,.35); }
.rhero__btn svg { width: 22px; height: 22px; color: #3fb6ff; transition: transform .2s; }
.rhero__btn:hover { background: #ff4f12; transform: translateY(-2px); }
.rhero__btn:hover svg { color: #fff; transform: translateX(4px); }

/* Ilustrația */
.rhero__art { position: relative; min-height: 470px; }
.rh-doodle { position: absolute; opacity: .9; }
.rh-doodle--users { left: 34%; top: -6%; width: 96px; animation: rhFloat 6s ease-in-out infinite; }
.rh-doodle--lock { left: 4%; top: 18%; width: 84px; animation: rhFloat 7s ease-in-out -2s infinite; }
.rh-doodle--pie { right: 0; top: 34%; width: 110px; animation: rhFloat 6.5s ease-in-out -4s infinite; }
.rh-spin { transform-origin: 45px 46px; animation: rhSpin 12s linear infinite; }
.rh-slice { animation: rhSlice 3s ease-in-out infinite; }

.rh-panel { position: absolute; left: 8%; right: 14%; top: 26%; border-radius: 14px; overflow: hidden; background: rgba(18, 16, 30, .92); border: 1px solid rgba(255,255,255,.14); box-shadow: 0 40px 80px rgba(0,0,0,.5); animation: rhPanel 7s ease-in-out infinite; }
.rh-panel__top { display: flex; align-items: center; gap: 6px; padding: 10px 14px; background: rgba(255,255,255,.05); border-bottom: 1px solid rgba(255,255,255,.08); }
.rh-panel__top i { width: 9px; height: 9px; border-radius: 50%; background: #ff5f57; }
.rh-panel__top i:nth-child(2) { background: #febc2e; } .rh-panel__top i:nth-child(3) { background: #28c840; }
.rh-panel__top span { margin-left: 12px; padding: 3px 12px; border-radius: 6px; background: rgba(255,255,255,.07); font-size: 11px; color: #b9b5c9; }
.rh-panel__body { display: grid; grid-template-columns: 110px 1fr; }
.rh-side { display: grid; align-content: start; gap: 4px; padding: 14px 10px; background: rgba(255,255,255,.03); border-right: 1px solid rgba(255,255,255,.07); }
.rh-side__logo { margin-bottom: 8px; padding: 6px 8px; border-radius: 6px; background: linear-gradient(135deg, #ff6c2c, #ff3b3b); font-family: 'Outfit', sans-serif; font-size: 13px; letter-spacing: .08em; text-align: center; }
.rh-side span { padding: 6px 8px; border-radius: 6px; font-size: 11.5px; color: #a8a4ba; }
.rh-side span.is-on { background: rgba(255,106,43,.16); color: #ffb08a; }
.rh-main { padding: 14px 16px 16px; }
.rh-main__head { display: flex; align-items: center; justify-content: space-between; }
.rh-main__head b { font-size: 13.5px; }
.rh-new { padding: 4px 10px; border-radius: 6px; background: #ff5a1f; font-size: 11px; font-weight: 700; animation: rhPulse 2.8s ease-in-out infinite; }
.rh-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.rh-stats > div { padding: 9px 10px; border-radius: 8px; background: rgba(255,255,255,.05); }
.rh-stats small { display: block; font-size: 10px; color: #9a96ad; }
.rh-stats b { font-size: 16px; }
.rh-bar { display: block; height: 4px; margin-top: 6px; border-radius: 2px; background: rgba(255,255,255,.1); overflow: hidden; }
.rh-bar em { display: block; height: 100%; border-radius: 2px; background: linear-gradient(90deg, #ff8a3d, #ff4f8b); animation: rhGrow 3s ease-out both; }
.rh-rows { list-style: none; display: grid; gap: 6px; margin: 12px 0 0; padding: 0; }
.rh-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; background: rgba(255,255,255,.04); font-size: 12px; color: #dcd8e8; }
.rh-row em { margin-left: auto; font-style: normal; font-size: 10.5px; padding: 2px 8px; border-radius: 999px; background: rgba(255,255,255,.08); color: #c9c5d8; }
.rh-row em.ok { background: rgba(34,197,94,.15); color: #86efac; }
.rh-row--new { animation: rhRowIn 6s ease-in-out infinite; }
.rh-row--new em { background: rgba(255,90,31,.2); color: #ffb08a; }
.rh-av { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: var(--c); font-size: 11px; font-weight: 800; color: #fff; }

.rh-cpanel { position: absolute; left: 0; bottom: 4%; display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 14px; background: #fff; color: #15121c; box-shadow: 0 20px 40px rgba(0,0,0,.35); animation: rhFloat 5.5s ease-in-out -1s infinite; }
.rh-cpanel > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: #ff6c2c; color: #fff; font-family: 'Outfit', sans-serif; font-size: 17px; font-weight: 800; }
.rh-cpanel b { display: block; font-size: 15px; }
.rh-cpanel small { font-size: 12px; color: #6c6a75; }
.rh-toast { position: absolute; right: 4%; bottom: 10%; display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 12px; background: rgba(20, 60, 45, .95); border: 1px solid rgba(80, 200, 140, .4); box-shadow: 0 16px 34px rgba(0,0,0,.4); animation: rhToast 6s ease-in-out infinite; }
.rh-toast > span { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #22c55e; font-weight: 800; font-size: 13px; }
.rh-toast b { display: block; font-size: 13px; }
.rh-toast small { font-size: 11px; color: #a7e8c3; }

@keyframes rhFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes rhSpin { to { transform: rotate(360deg); } }
@keyframes rhSlice { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(4px, -4px); } }
@keyframes rhPanel { 0%, 100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-8px) rotate(0deg); } }
@keyframes rhPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(255,90,31,.5); } 50% { box-shadow: 0 0 0 6px rgba(255,90,31,0); } }
@keyframes rhGrow { from { width: 0; } }
@keyframes rhRowIn { 0%, 12% { opacity: 0; transform: translateY(-8px); } 22%, 88% { opacity: 1; transform: none; } 100% { opacity: 0; } }
@keyframes rhToast { 0%, 18% { opacity: 0; transform: translateY(14px) scale(.96); } 26%, 82% { opacity: 1; transform: none; } 92%, 100% { opacity: 0; transform: translateY(8px); } }

@media (max-width: 1100px) {
  .rhero__inner { grid-template-columns: 1fr; gap: 30px; }
  .rhero__content { order: -1; }
  .rhero__art { min-height: 440px; max-width: 620px; width: 100%; margin: 0 auto; }
  .rhero__cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .rhero { padding: 120px 0 60px; }
  .rhero__art { min-height: 360px; }
  .rh-panel { left: 0; right: 0; top: 22%; }
  .rh-panel__body { grid-template-columns: 1fr; }
  .rh-side { display: none; }
  .rh-doodle--users { left: 40%; width: 70px; } .rh-doodle--lock { width: 60px; top: 4%; } .rh-doodle--pie { width: 76px; top: 4%; }
  .rh-cpanel { bottom: -2%; } .rh-toast { display: none; }
  .rh-card { min-height: 120px; padding: 60px 14px 16px; }
}
/* Reseller hero – așezare mai aerisită */
.rhero__art { min-height: 520px; }
.rh-panel { top: 22%; }
.rh-cpanel { left: -2%; bottom: 0; }
.rh-toast { right: 6%; bottom: -1%; }
@media (min-width: 1301px) {
  .rhero__inner { --pw: min(1560px, calc(100vw - 64px)); width: var(--pw); max-width: none; margin-left: calc((100% - var(--pw)) / 2); }
}
@media (max-width: 640px) { .rhero__art { min-height: 380px; } .rh-cpanel { bottom: -4%; } }
/* Reseller hero – textul în stânga, ilustrația în dreapta */
.rhero__inner { grid-template-columns: 1.05fr 1fr; }
.rhero__content { order: -1; }
.rhero__lead { margin-top: 30px; }
@media (max-width: 1100px) { .rhero__inner { grid-template-columns: 1fr; } }
/* Reseller hero – aliniat cu logo-ul și meniul, ca pe celelalte pagini */
@media (min-width: 1301px) {
  .rhero__inner { width: auto; max-width: none; margin-left: auto; }
}
.rhero { padding: 190px 0 96px; }
.rhero__inner { grid-template-columns: 1.1fr 1fr; gap: 40px; }
.rhero__thin { font-size: clamp(36px, 4vw, 58px); }
.rhero__bold { font-size: clamp(38px, 4.2vw, 62px); }
.rhero__lead { font-size: clamp(16px, 1.3vw, 19px); }
.rhero__cards { gap: 12px; }
.rh-card { min-height: 132px; padding: 60px 14px 16px; border-radius: 18px; }
.rh-card__i { width: 56px; height: 46px; border-radius: 18px 0 18px 0; }
.rh-card__i svg { width: 22px; height: 22px; }
.rh-card p { font-size: 15px; }
.rhero__art { min-height: 480px; }
@media (max-width: 1100px) { .rhero__inner { grid-template-columns: 1fr; } }
@media (max-width: 860px) { .rhero { padding-top: 130px; } }
@media (min-width: 1301px) { .rhero__inner { width: 100%; max-width: 1200px; margin: 0 auto; } }
.rhero .rpill { margin-bottom: 22px; }

/* =====================================================================
   v46 – Reseller web: „Reseller Hosting la HOSTEASY pentru că” + ilustrație animată
   ===================================================================== */
.rabout { padding: 90px 0; background: #fbfaf7; color: #2b2a35; overflow: clip; }
.rabout__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.ra { width: 100%; height: auto; display: block; }
.rabout__thin { display: block; font-family: 'Inter', sans-serif; font-weight: 300; font-size: clamp(32px, 3.6vw, 48px); line-height: 1.15; color: #2b2a35; }
.rabout__bold { display: block; font-family: 'Inter', sans-serif; font-weight: 800; font-size: clamp(32px, 3.6vw, 48px); line-height: 1.15; color: #2b2a35; }
.rabout__lead { margin-top: 18px; font-size: clamp(17px, 1.6vw, 22px); line-height: 1.7; font-weight: 300; color: #4a4955; }
.rabout__list { list-style: none; display: grid; gap: 12px; margin: 26px 0 0; padding: 0; }
.rabout__list li { position: relative; padding-left: 30px; font-size: 17px; line-height: 1.75; color: #3d3c47; }
.rabout__list li::before { content: ''; position: absolute; left: 4px; top: 10px; width: 9px; height: 9px; border-radius: 50%; background: #d10f1f; }

/* Animații ilustrație */
.ra-gear { transform-origin: 150px 150px; animation: raSpin 14s linear infinite; }
.ra-phone { animation: raFloat 6s ease-in-out infinite; }
.ra-search { animation: raFloat 5s ease-in-out -1.5s infinite; }
.ra-hand { transform-origin: 0 0; animation: raSpin 10s linear infinite; }
.ra-hand2 { transform-origin: 0 0; animation: raSpin 60s linear infinite; }
.ra-float { animation: raBob 5s ease-in-out infinite; }
.ra-f2 { animation-delay: -1s; } .ra-f3 { animation-delay: -2s; } .ra-f4 { animation-delay: -3s; } .ra-f5 { animation-delay: -4s; }
@keyframes raSpin { to { transform: rotate(360deg); } }
@keyframes raFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes raBob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }

@media (max-width: 960px) {
  .rabout { padding: 60px 0; }
  .rabout__grid { grid-template-columns: 1fr; gap: 30px; }
  .rabout__art { max-width: 520px; margin: 0 auto; width: 100%; }
}

/* =====================================================================
   v47 – Reseller web: „Descoperiți avantajele…” (listă pe 4 coloane)
   ===================================================================== */
.radv { padding: 30px 0 90px; background: #fbfaf7; color: #2b2a35; }
.radv__head { max-width: 960px; margin: 0 auto; text-align: center; }
.radv__head h2 { display: grid; }
.radv__head p { margin-top: 18px; font-size: clamp(16px, 1.5vw, 21px); line-height: 1.8; font-weight: 300; color: #4a4955; }
.radv__list { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px 30px; max-width: 1180px; margin: 56px auto 0; padding: 0; }
.radv__list li { display: flex; align-items: flex-start; gap: 10px; font-size: 16.5px; line-height: 1.5; color: #3d3c47; transition: transform .2s; }
.radv__list li:hover { transform: translateX(3px); }
.radv__list svg { width: 19px; height: 19px; flex-shrink: 0; margin-top: 2px; color: #d10f1f; }
.radv__list b { font-weight: 700; color: #2b2a35; }
@media (max-width: 1100px) { .radv__list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .radv { padding-bottom: 60px; } .radv__list { grid-template-columns: 1fr; gap: 14px; margin-top: 36px; } }
@media (min-width: 1101px) {
  .radv__list { --pw: min(1500px, calc(100vw - 64px)); width: var(--pw); max-width: none; margin-left: calc((100% - var(--pw)) / 2); gap: 20px 24px; }
}
@media (min-width: 1101px) and (max-width: 1400px) { .radv__list li { font-size: 15px; } }

/* Răspunsuri FAQ cu mai multe paragrafe și liste numerotate */
.fq__a p:not(:last-child) { padding-bottom: 12px; }
.fq__a ol { margin: 0; padding: 0 24px 14px 150px; color: #c4c6d2; font-size: 15.5px; line-height: 1.7;
  opacity: 0; transform: translateY(-6px); transition: opacity .35s .05s, transform .35s .05s; }
.fq__a ol li { margin-bottom: 6px; }
.fq__a ol li::marker { color: #ff8a5c; font-weight: 700; }
.fq__item.is-open .fq__a ol { opacity: 1; transform: none; }
@media (max-width: 640px) { .fq__a ol { padding: 0 16px 12px 86px; font-size: 14.5px; } }

/* =====================================================================
   v48 – Reseller web: „Avantaje și Expertiză în Reseller Hosting”
   ===================================================================== */
.rexp { position: relative; overflow: hidden; padding: 90px 0 100px; color: #fff; background: linear-gradient(160deg, #0b2a3d 0%, #0a3550 55%, #082c42 100%); }
.rexp__waves { position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background: radial-gradient(ellipse 70% 30% at 80% 20%, rgba(255,255,255,.05), transparent 70%), radial-gradient(ellipse 60% 25% at 20% 85%, rgba(255,255,255,.04), transparent 70%),
    repeating-linear-gradient(-18deg, transparent 0 120px, rgba(255,255,255,.025) 120px 122px); }
.rexp .container { position: relative; }
.rexp__top { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: start; }
.rexp__pill { display: inline-flex; align-items: center; gap: 10px; padding: 10px 18px; border-radius: 10px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.18); font-size: 14.5px; color: #e6eef5; }
.rexp__pill svg { width: 20px; height: 20px; }
.rexp__pill b { color: #fff; }
.rexp__top h2 { margin-top: 26px; font-size: clamp(32px, 4.2vw, 56px); line-height: 1.12; color: #fff; }
.rexp__top p { margin-top: 18px; font-size: 16.5px; line-height: 1.8; color: #dce7ef; }

.rexp__logos { display: grid; grid-template-columns: repeat(6, 1fr); gap: 22px; margin-top: 56px; }
.rlogo { display: flex; align-items: center; justify-content: center; gap: 8px; height: 130px; padding: 14px; border-radius: 16px; background: #fff; color: #15121c; box-shadow: 0 14px 30px rgba(0,0,0,.25); transition: transform .25s, box-shadow .25s; }
.rlogo:hover { transform: translateY(-5px); box-shadow: 0 20px 40px rgba(0,0,0,.35); }
.rlogo { flex-direction: column; }
.rlogo svg { width: 42px; height: 42px; }
.rlogo__ls-t { font-family: 'Outfit', sans-serif; font-size: 17px; letter-spacing: .04em; color: #1e3a8a; }
.rlogo__cp { font-family: 'Outfit', sans-serif; font-style: italic; font-weight: 800; font-size: 34px; color: #ff6c2c; letter-spacing: -.02em; }
.rlogo__cp sup { font-size: 10px; }
.rlogo:nth-child(3) { flex-direction: row; }
.rlogo__cl { width: 44px !important; height: 44px !important; }
.rlogo__cl-t { font-family: 'Inter', sans-serif; font-weight: 500; font-size: 22px; color: #3a7fc4; }
.rlogo:nth-child(4) { flex-direction: row; gap: 10px; }
.rlogo__rd { width: 50px !important; }
.rlogo__rd-t { font-family: 'Inter', sans-serif; font-weight: 700; font-size: 30px; color: #2a2a2a; letter-spacing: -.02em; }
.rlogo--he { flex-direction: row; gap: 10px; }
.rlogo--he svg { width: 40px; height: 46px; }
.rlogo--he b { display: block; font-family: 'Outfit', sans-serif; font-size: 17px; letter-spacing: .06em; color: #15121c; }
.rlogo--he small { display: block; font-size: 8.5px; letter-spacing: .18em; color: #6c6a75; }
.rlogo__im-t { font-family: 'Inter', sans-serif; font-weight: 500; font-size: 18px; color: #108a47; }
.rlogo__im-t span { font-weight: 700; }

.rexp__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 56px; }
.rcard { position: relative; padding: 0 30px 34px; border-radius: 12px; background: rgba(8, 40, 60, .7); border: 1px solid rgba(80, 170, 220, .25); transition: border-color .25s, transform .25s; }
.rcard:hover { border-color: rgba(42, 168, 242, .6); transform: translateY(-4px); }
.rcard__n { position: absolute; left: 34px; top: 0; display: grid; place-items: center; width: 54px; height: 108px; border-radius: 0 0 14px 14px; background: #19b5f5; font-size: 20px; color: #fff; box-shadow: 0 10px 24px rgba(25,181,245,.35); }
.rcard h3 { min-height: 108px; display: flex; align-items: center; padding-left: 82px; padding-top: 16px; font-family: 'Inter', sans-serif; font-size: 21px; font-weight: 700; line-height: 1.3; color: #fff; }
.rcard p { margin-top: 26px; font-size: 15px; line-height: 1.8; color: #e1ebf2; }

.rexp__bottom { display: grid; grid-template-columns: 420px 1fr; gap: 60px; align-items: center; margin-top: 80px; }
.rexp__checks { display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
.rexp__checks ul { list-style: none; display: grid; gap: 14px; margin: 0; padding: 0; align-content: start; }
.rexp__checks li { display: flex; align-items: center; gap: 12px; font-size: 16px; color: #fff; }
.rexp__checks svg { width: 22px; height: 22px; flex-shrink: 0; }

/* Ilustrația: server HostEasy */
.rsrv { position: relative; width: 100%; aspect-ratio: 1; max-width: 400px; margin: 0 auto; }
.rsrv__ring { position: absolute; inset: 0; border-radius: 50%; border: 2px dashed rgba(255,255,255,.7); animation: rsrvSpin 40s linear infinite; }
.rsrv__disc { position: absolute; inset: 9%; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #3cc8ff, #1aa6ea 55%, #0e7fc0); box-shadow: 0 0 60px rgba(42, 168, 242, .35); }
.rsrv__orbit { position: absolute; inset: -3%; border-radius: 50%; animation: rsrvSpin 9s linear infinite; }
.rsrv__orbit i { position: absolute; left: 50%; top: 0; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: #ff5a1f; box-shadow: 0 0 16px #ff5a1f; }
.rsrv__stack { position: absolute; left: 12%; right: 12%; top: 30%; display: grid; gap: 8px; animation: rsrvFloat 6s ease-in-out infinite; }
.rsrv__unit { position: relative; display: flex; align-items: center; justify-content: space-between; height: 46px; padding: 0 14px; border-radius: 8px;
  background: linear-gradient(180deg, #2c3442, #1a2029); border: 1px solid rgba(255,255,255,.12); box-shadow: 0 12px 24px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.1); }
.rsrv__unit--main { height: 64px; background: linear-gradient(180deg, #1c1f2b, #0f1118); border-color: rgba(255,106,43,.5); box-shadow: 0 16px 34px rgba(0,0,0,.45), 0 0 0 1px rgba(255,106,43,.2), inset 0 1px 0 rgba(255,255,255,.12); }
.rsrv__logo { height: 34px; width: auto; filter: drop-shadow(0 0 6px rgba(255,255,255,.15)); }
.rsrv__bays { display: flex; gap: 5px; }
.rsrv__bays i { width: 22px; height: 22px; border-radius: 3px; background: linear-gradient(180deg, #3b4454, #262d38); border: 1px solid rgba(255,255,255,.1); }
.rsrv__bays i::after { content: ''; display: block; width: 4px; height: 4px; margin: 3px auto 0; border-radius: 50%; background: #ff8a3d; }
.rsrv__leds { display: flex; gap: 6px; }
.rsrv__leds i { width: 7px; height: 7px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 8px #22c55e; animation: rsrvBlink 1.6s ease-in-out infinite; }
.rsrv__leds i:nth-child(2) { animation-delay: .3s; background: #3cc8ff; box-shadow: 0 0 8px #3cc8ff; }
.rsrv__leds i:nth-child(3) { animation-delay: .6s; }
.rsrv__unit:nth-child(2) .rsrv__leds i { animation-duration: 1.1s; }
.rsrv__unit:nth-child(3) .rsrv__leds i { animation-duration: 2s; }
.rsrv__tag { position: absolute; padding: 8px 14px; border-radius: 10px; background: rgba(10, 30, 45, .9); border: 1px solid rgba(255,255,255,.18); font-size: 13px; font-weight: 600; color: #fff; box-shadow: 0 10px 24px rgba(0,0,0,.3); }
.rsrv__tag--1 { right: -4%; top: 16%; animation: rsrvFloat 5s ease-in-out -1s infinite; }
.rsrv__tag--2 { left: -6%; bottom: 20%; animation: rsrvFloat 5.5s ease-in-out -3s infinite; }
.rsrv__url { position: absolute; left: 50%; bottom: 12%; translate: -50% 0; padding: 7px 18px; border-radius: 999px; background: #fff; font-family: 'Outfit', sans-serif; font-size: 16px; font-weight: 800; letter-spacing: .02em; color: #0e5f8f; box-shadow: 0 10px 26px rgba(0,0,0,.3); }
@keyframes rsrvSpin { to { transform: rotate(360deg); } }
@keyframes rsrvFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes rsrvBlink { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }

@media (max-width: 1100px) {
  .rexp__logos { grid-template-columns: repeat(3, 1fr); }
  .rexp__cards { grid-template-columns: 1fr; }
  .rexp__bottom { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 760px) {
  .rexp { padding: 60px 0 70px; }
  .rexp__top { grid-template-columns: 1fr; gap: 10px; }
  .rexp__logos { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .rlogo { height: 100px; }
  .rlogo__cp { font-size: 28px; } .rlogo__rd-t { font-size: 24px; } .rlogo__cl-t { font-size: 18px; }
  .rexp__checks { grid-template-columns: 1fr; }
  .rexp__checks ul + ul { margin-top: 14px; }
  .rcard { padding: 0 20px 26px; } .rcard__n { left: 20px; } .rcard h3 { padding-left: 70px; font-size: 19px; }
  .rsrv { max-width: 320px; }
  .rsrv__tag--1 { right: 0; } .rsrv__tag--2 { left: 0; }
}

/* =====================================================================
   v49 – Reseller radio: carduri ca în model (etichetă galbenă, iconițe albastre)
   ===================================================================== */
.plan__badge { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; margin-top: 18px; padding: 4px 10px; border-radius: 5px; background: #ffc107; font-size: 12.5px; font-weight: 800; letter-spacing: .01em; color: #1a1a24; text-transform: uppercase; }
.plan__badge svg { width: 14px; height: 14px; color: #1a1a24; }
.plans--resellerRadio .plan--list3 .plan__name { text-transform: uppercase; font-size: 23px; color: #5d5c66; }
.plans--resellerRadio .plan--list3 .plan__big strong { font-size: 44px; }
.plans--resellerRadio .plan--list3 .plan__cta { margin-top: 20px; padding: 19px; border-radius: 4px; background: #000f45; font-size: 16px; }
.plans--resellerRadio .plan--list3 .plan__cta:hover { background: #0b1f6b; }
.plans--resellerRadio .plan--list3.plan--popular { box-shadow: 0 6px 30px rgba(20, 30, 60, .07); }
.plans--resellerRadio .plan--list3.plan--popular .plan__cta { background: linear-gradient(90deg, #0a84ff, #2a3cf0); }
.plans--resellerRadio .plan--list3 .plan__rows { gap: 16px; margin-top: 34px; }
.plans--resellerRadio .plan--list3 .plan__rows li { font-size: 15px; }
.plans--resellerRadio .plan--list3 .plan__rows .icon { color: #1e3cf0; width: 17px; height: 17px; }
.plans--resellerRadio .plan--list3 .plan__rows li b { font-weight: 700; color: #3d3c47; }
.plans--resellerRadio.plans--3 { max-width: 1460px; gap: 28px; }
@media (min-width: 1201px) {
  .plans--resellerRadio.plans--3 { --pw: min(1460px, calc(100vw - 48px)); width: var(--pw); margin-left: calc((100% - var(--pw)) / 2); }
}

/* =====================================================================
   v50 – Reseller radio: hero modern (bleumarin → mov) cu card Trial
   ===================================================================== */
.rrhero { position: relative; overflow: hidden; padding: 190px 0 70px; color: #fff; background: linear-gradient(100deg, #121423 0%, #1a1a2e 45%, #2a1a36 80%, #331a38 100%); }
.rrhero__bg { position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 60px 60px; }
.rrhero__bg::after { content: ''; position: absolute; left: 30%; top: 20%; width: 50%; height: 70%; border-radius: 50%; background: radial-gradient(circle, rgba(255, 90, 31, .12), transparent 65%); }
.rrhero__inner { position: relative; display: grid; grid-template-columns: 1fr 400px; gap: 50px; align-items: center; }
.rrhero h1 { margin-top: 22px; font-size: clamp(40px, 5vw, 70px); line-height: 1.08; }
.rrhero h1 span { display: block; background: linear-gradient(90deg, #ffc23d, #ff9a1f); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rrhero__lead { margin-top: 22px; max-width: 560px; font-size: clamp(17px, 1.5vw, 20px); line-height: 1.6; color: #d9d6e8; }
.rrhero__btns { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 34px; }
.rrhero__go { gap: 10px; padding: 18px 32px; border-radius: 999px; background: linear-gradient(90deg, #ff7a4d, #ff2d6f); color: #fff; font-weight: 700; box-shadow: 0 14px 30px rgba(255, 45, 111, .35); }
.rrhero__go svg { width: 18px; height: 18px; transition: transform .2s; }
.rrhero__go:hover { transform: translateY(-2px); } .rrhero__go:hover svg { transform: translateX(3px); }
.rrhero__try { padding: 18px 32px; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.7); color: #fff; font-weight: 700; }
.rrhero__try:hover { background: #fff; color: #1a1a2e; }
.rrhero__eq { display: flex; align-items: flex-end; gap: 5px; height: 46px; margin-top: 46px; }
.rrhero__eq i { width: 6px; border-radius: 3px; background: linear-gradient(180deg, #ffc23d, #ff5a1f); animation: rrEq 1.2s ease-in-out infinite; }
.rrhero__eq i:nth-child(odd) { animation-duration: .9s; } .rrhero__eq i:nth-child(3n) { animation-duration: 1.5s; }
.rrhero__eq i:nth-child(2) { animation-delay: -.2s; } .rrhero__eq i:nth-child(4) { animation-delay: -.5s; } .rrhero__eq i:nth-child(6) { animation-delay: -.8s; }
.rrhero__eq i:nth-child(8) { animation-delay: -.3s; } .rrhero__eq i:nth-child(10) { animation-delay: -.7s; } .rrhero__eq i:nth-child(12) { animation-delay: -.1s; }
@keyframes rrEq { 0%, 100% { height: 18%; } 50% { height: 100%; } }

/* Card Trial */
.rrtrial { position: relative; padding: 34px 30px 26px; border-radius: 22px; background: #fff; color: #15121c; text-align: center; box-shadow: 0 30px 70px rgba(0,0,0,.45); }
.rrtrial__art { position: relative; width: 150px; height: 150px; margin: -6px auto 0; }
.rrtrial__mic { position: relative; width: 100%; height: 100%; animation: rrMic 5s ease-in-out infinite; }
.rrtrial__wave { position: absolute; left: 50%; top: 44%; width: 120px; height: 120px; margin: -60px 0 0 -60px; border-radius: 50%; border: 2px solid rgba(255, 90, 31, .45); animation: rrWave 2.6s ease-out infinite; }
.rrtrial__wave--2 { animation-delay: 1.3s; }
.rrtrial__live { position: absolute; right: -14px; top: 8px; display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 999px; background: #ff2d55; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; color: #fff; }
.rrtrial__live i { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: rsrvBlink 1s ease-in-out infinite; }
.rrtrial h3 { margin-top: 10px; font-family: 'Outfit', sans-serif; font-size: 22px; font-weight: 700; }
.rrtrial__sub { margin-top: 10px; font-size: 14.5px; color: #2f2b38; }
.rrtrial__price { display: flex; align-items: flex-start; justify-content: center; gap: 2px; margin-top: 8px; }
.rrtrial__price b { font-family: 'Outfit', sans-serif; font-size: 40px; line-height: 1; color: #f0127a; }
.rrtrial__price sup { margin-top: 4px; font-size: 18px; font-weight: 800; color: #f0127a; }
.rrtrial__price > span { align-self: flex-end; margin-left: 4px; font-size: 14px; font-weight: 600; color: #15121c; }
.rrtrial__specs { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 18px 0 0; padding: 0; }
.rrtrial__specs li { padding: 6px 12px; border-radius: 999px; background: #f2f3f8; font-size: 13px; color: #4a4955; }
.rrtrial__btn { width: 100%; margin-top: 24px; padding: 16px; border-radius: 999px; background: #0f1340; color: #fff; font-weight: 700; }
.rrtrial__btn:hover { background: #ff5a1f; }
.rrtrial__note { margin-top: 16px; font-size: 13px; line-height: 1.6; color: #7a7884; }
.rrtrial__note a { color: #1d6ff2; font-weight: 700; }
@keyframes rrMic { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-6px) rotate(2deg); } }
@keyframes rrWave { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(1.5); opacity: 0; } }

/* Cele 4 carduri */
.rrfeat { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; max-width: calc(100% - 450px); margin-top: 50px; }
.rrfeat__card { display: grid; justify-items: center; gap: 16px; padding: 30px 14px 26px; border-radius: 14px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(8px); text-align: center; transition: transform .25s, background .25s; }
.rrfeat__card:hover { transform: translateY(-5px); background: rgba(255,255,255,.1); }
.rrfeat__card b { font-size: 15px; color: #fff; }
.rrfeat__ico { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; }
.rrfeat__ico svg { width: 28px; height: 28px; }
.rrfeat__ico--yt { background: rgba(255, 0, 0, .14); color: #ff3030; }
.rrfeat__ico--fb { background: rgba(24, 119, 242, .18); color: #4b9bff; }
.rrfeat__ico--pl { background: rgba(255, 166, 61, .16); color: #ffb35c; }
.rrfeat__ico--dj { background: rgba(139, 92, 246, .2); color: #b9a3ff; }

@media (max-width: 1100px) {
  .rrhero__inner { grid-template-columns: 1fr; }
  .rrtrial { max-width: 420px; width: 100%; margin: 0 auto; }
  .rrfeat { max-width: none; grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .rrhero { padding: 120px 0 50px; }
  .rrhero__btns .btn { flex: 1; justify-content: center; padding: 16px 20px; }
  .rrfeat { gap: 12px; }
  .rrfeat__card { padding: 22px 10px 20px; }
}

/* =====================================================================
   v51 – Reseller radio: panou de reseller animat + tabele în lățimea paginii
   ===================================================================== */
@media (min-width: 1201px) {
  .plans--resellerRadio.plans--3 { width: auto; max-width: none; margin-left: 0; }
}
.plans--resellerRadio.plans--3 { gap: 24px; }
.rrhero__inner { grid-template-columns: 1fr 420px; }
.rrpanel { position: relative; padding: 22px 22px 22px; border-radius: 22px; color: #fff; background: linear-gradient(160deg, rgba(40, 36, 70, .92), rgba(20, 18, 38, .96)); border: 1px solid rgba(255,255,255,.14); box-shadow: 0 30px 70px rgba(0,0,0,.45); animation: rrPanelFloat 7s ease-in-out infinite; }
.rrpanel__top { display: flex; align-items: center; gap: 12px; }
.rrpanel__logo { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: linear-gradient(135deg, #ffc23d, #ff5a1f); font-family: 'Outfit', sans-serif; font-weight: 800; color: #1a1a2e; }
.rrpanel__top b { display: block; font-size: 16px; }
.rrpanel__top small { font-size: 12px; color: #a9a6c2; }
.rrpanel .rrtrial__live { position: static; margin-left: auto; }
.rrpanel__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 18px; }
.rrpanel__stats > div { padding: 12px 10px; border-radius: 12px; background: rgba(255,255,255,.06); }
.rrpanel__stats small { display: block; font-size: 11px; color: #a9a6c2; }
.rrpanel__stats b { display: block; margin-top: 2px; font-family: 'Outfit', sans-serif; font-size: 22px; }
.rrpanel__count { color: #6ee7a8; }
.rrpanel__head { display: flex; align-items: center; justify-content: space-between; margin-top: 18px; }
.rrpanel__head b { font-size: 14px; }
.rrpanel__new { padding: 5px 11px; border-radius: 8px; background: #ff5a1f; font-size: 12px; font-weight: 700; animation: rhPulse 2.8s ease-in-out infinite; }
.rrpanel__list { list-style: none; display: grid; gap: 8px; margin: 12px 0 0; padding: 0; }
.rrpanel__row { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.06); }
.rrpanel__row div { flex: 1; min-width: 0; }
.rrpanel__row b { display: block; font-size: 13.5px; }
.rrpanel__row small { font-size: 11.5px; color: #a9a6c2; }
.rrpanel__row--new { border-color: rgba(34,197,94,.4); background: rgba(34,197,94,.08); animation: rhRowIn 6s ease-in-out infinite; }
.rrpanel__av { display: grid; place-items: center; width: 32px; height: 32px; flex-shrink: 0; border-radius: 10px; background: var(--c); font-weight: 800; font-size: 14px; }
.rrpanel__eq { display: flex; align-items: flex-end; gap: 3px; height: 18px; }
.rrpanel__eq i { width: 3px; border-radius: 2px; background: #ffb35c; animation: rrEq 1s ease-in-out infinite; }
.rrpanel__eq i:nth-child(2) { animation-delay: -.3s; } .rrpanel__eq i:nth-child(3) { animation-delay: -.6s; } .rrpanel__eq i:nth-child(4) { animation-delay: -.15s; }
.rrpanel .rrtrial__btn { margin-top: 18px; background: linear-gradient(90deg, #ff7a4d, #ff2d6f); }
.rrpanel .rrtrial__btn:hover { background: linear-gradient(90deg, #ff8a5c, #ff4580); }
.rrpanel .rrtrial__note { margin-top: 12px; color: #b9b6cf; }
.rrpanel .rrtrial__note b { color: #fff; }
@keyframes rrPanelFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.rrfeat { max-width: calc(100% - 470px); }
@media (max-width: 1100px) {
  .rrhero__inner { grid-template-columns: 1fr; }
  .rrpanel { max-width: 460px; width: 100%; margin: 0 auto; }
  .rrfeat { max-width: none; }
}

/* =====================================================================
   v52 – Reseller radio: „Panou de Reseller” cu captura SonicPanel Manager
   ===================================================================== */
.rrmgr .rpanel__grid { grid-template-columns: minmax(0, 470px) minmax(0, 1fr); }
.rrmgr .rpanel__list { gap: 18px; }
.rrmgr .rpanel__item { padding: 22px 24px; }
.rrmgr .rpanel__item h3 { font-size: 18px; }
.rrmgr .rpanel__item p { font-size: 15px; line-height: 1.7; }
.rrmgr .rpanel__item b { color: #2f2b38; }
.rrmgr__bar { display: flex; align-items: center; gap: 6px; height: auto !important; padding: 9px 12px; }
.rrmgr__bar i { width: 9px; height: 9px; border-radius: 50%; background: #ff5f57; }
.rrmgr__bar i:nth-child(2) { background: #febc2e; } .rrmgr__bar i:nth-child(3) { background: #28c840; }
.rrmgr__bar span { margin-left: 10px; padding: 3px 12px; border-radius: 6px; background: rgba(255,255,255,.1); font-size: 12px; color: #d5d7e0; }
.rrmgr__bar b { color: #ffb35c; }
.rrmgr .rpanel__frame { animation: rrPanelFloat 7s ease-in-out infinite; }
.rrmgr__tag { position: absolute; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 12px; font-size: 13px; font-weight: 700; box-shadow: 0 12px 28px rgba(20,30,70,.18); }
.rrmgr__tag--1 { left: 0; bottom: 8%; background: #15121c; color: #fff; animation: rsrvFloat 5s ease-in-out -1s infinite; }
.rrmgr__tag--1 i { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 8px #22c55e; animation: rsrvBlink 1.4s ease-in-out infinite; }
.rrmgr__tag--2 { right: -2%; top: 18%; background: #fff; color: #15121c; animation: rsrvFloat 6s ease-in-out -3s infinite; }
@media (max-width: 1000px) { .rrmgr .rpanel__grid { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .rrmgr__tag { font-size: 11.5px; padding: 7px 10px; } .rrmgr__tag--2 { right: 0; top: 4%; } }

/* =====================================================================
   v53 – Reseller radio: „Ce este un reseller server radio online?” + ilustrație animată
   ===================================================================== */
.rrwhat { padding: 90px 0; background: #f6f8fd; color: #15121c; overflow: clip; }
.rrwhat__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.rrwhat__kicker { display: inline-block; padding: 6px 14px; border-radius: 999px; background: rgba(91, 61, 245, .1); color: #5b3df5; font-size: 13px; font-weight: 700; }
.rrwhat h2 { margin-top: 16px; font-size: clamp(30px, 3.6vw, 48px); line-height: 1.15; color: #15121c; }
.rrwhat h2 span { background: linear-gradient(90deg, #5b3df5, #ff5a1f); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rrwhat__text p { margin-top: 20px; font-size: 17.5px; line-height: 1.75; color: #2f2b38; }
.rrwhat__steps { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 32px 0 0; padding: 0; }
.rrwhat__steps li { display: flex; gap: 10px; align-items: flex-start; padding: 14px; border-radius: 14px; background: #fff; box-shadow: 0 6px 22px rgba(30, 30, 80, .07); }
.rrwhat__steps span { display: grid; place-items: center; flex-shrink: 0; width: 28px; height: 28px; border-radius: 9px; background: linear-gradient(135deg, #7b5cff, #5b3df5); color: #fff; font-weight: 800; font-size: 14px; }
.rrwhat__steps b { display: block; font-size: 14px; line-height: 1.3; }
.rrwhat__steps small { display: block; margin-top: 3px; font-size: 12px; color: #6c6a75; }

.rrwhat__art { position: relative; width: 100%; max-width: 540px; aspect-ratio: 520 / 420; margin-left: auto; }
.rrw-lines { position: absolute; inset: 0; width: 100%; height: 100%; }
.rrw-path { stroke: #b9b0ff; stroke-width: 2.4; stroke-dasharray: 6 8; animation: rrwDash 1.4s linear infinite; }
@keyframes rrwDash { to { stroke-dashoffset: -28; } }
.rrw-hub { position: absolute; left: 50%; top: 50%; width: 34%; translate: -50% -50%; display: grid; justify-items: center; }
.rrw-server { width: 100%; height: auto; filter: drop-shadow(0 24px 30px rgba(59, 31, 200, .35)); animation: rrwFloat 6s ease-in-out infinite; }
.rrw-hub__label { margin-top: 6px; padding: 6px 12px; border-radius: 999px; background: #15121c; color: #fff; font-size: 12px; font-weight: 700; white-space: nowrap; }
.rrw-wave { position: absolute; left: 50%; top: 18%; width: 60%; aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; border: 2px solid rgba(255, 194, 61, .7); animation: rrwWave 3s ease-out infinite; }
.rrw-wave--2 { animation-delay: 1s; } .rrw-wave--3 { animation-delay: 2s; }
@keyframes rrwWave { 0% { width: 30%; opacity: .9; } 100% { width: 140%; opacity: 0; } }
.rrw-l1, .rrw-l2, .rrw-l3 { animation: rsrvBlink 1.4s ease-in-out infinite; }
.rrw-l2 { animation-delay: .4s; } .rrw-l3 { animation-delay: .8s; }
.rrw-card { position: absolute; display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 14px; background: #fff; box-shadow: 0 14px 34px rgba(30, 30, 80, .14); animation: rrwFloat 5s ease-in-out infinite; }
.rrw-card b { display: block; font-size: 13px; white-space: nowrap; }
.rrw-card small { font-size: 11px; color: #6c6a75; }
.rrw-card--1 { left: 0; top: 10%; }
.rrw-card--2 { right: 0; top: 13%; animation-delay: -1.2s; }
.rrw-card--3 { right: 2%; bottom: 13%; animation-delay: -2.4s; }
.rrw-card--4 { left: 0; bottom: 13%; animation-delay: -3.6s; }
.rrw-av { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: var(--c); color: #fff; font-weight: 800; font-size: 14px; }
.rrw-eq { display: flex; align-items: flex-end; gap: 3px; height: 16px; margin-left: 4px; }
.rrw-eq i { width: 3px; border-radius: 2px; background: #5b3df5; animation: rrEq 1s ease-in-out infinite; }
.rrw-eq i:nth-child(2) { animation-delay: -.35s; } .rrw-eq i:nth-child(3) { animation-delay: -.7s; }
.rrw-coin { position: absolute; right: 24%; top: 2%; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, #ffd56a, #ffb020); color: #7a4b00; font-weight: 800; font-size: 18px; box-shadow: 0 10px 22px rgba(255, 176, 32, .4); animation: rrwCoin 3.5s ease-in-out infinite; }
@keyframes rrwFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes rrwCoin { 0%, 100% { transform: translateY(0) rotateY(0); } 50% { transform: translateY(-10px) rotateY(180deg); } }

@media (max-width: 1000px) {
  .rrwhat__grid { grid-template-columns: 1fr; gap: 40px; }
  .rrwhat__art { margin: 0 auto; }
}
@media (max-width: 640px) {
  .rrwhat { padding: 60px 0; }
  .rrwhat__steps { grid-template-columns: 1fr; }
  .rrw-card { padding: 8px 10px; gap: 8px; }
  .rrw-card b { font-size: 11.5px; } .rrw-card small { font-size: 10px; }
  .rrw-av { width: 26px; height: 26px; font-size: 12px; }
  .rrw-eq { display: none; }
  .rrw-hub__label { font-size: 10.5px; }
}
@media (max-width: 640px) {
  .rrwhat__art { aspect-ratio: 1 / 1.15; }
  .rrw-card--1 { top: 2%; } .rrw-card--2 { top: 16%; }
  .rrw-card--3 { bottom: 2%; } .rrw-card--4 { bottom: 16%; }
  .rrw-hub { width: 44%; }
  .rrw-coin { right: 6%; top: 34%; width: 32px; height: 32px; font-size: 15px; }
}
@media (max-width: 640px) { .rrw-hub__label { display: none; } }

/* =====================================================================
   v54 – Prima pagină: câte un tabel real din fiecare serviciu
   ===================================================================== */
.ovplans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; align-items: stretch; }
.ovplans--2 { grid-template-columns: repeat(2, 1fr); max-width: 820px; margin: 0 auto; }
.ovplans__col { display: flex; flex-direction: column; min-width: 0; }
.ovplans__label { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 14px; padding: 0 4px; font-family: 'Outfit', sans-serif; font-size: 20px; font-weight: 700; color: #15121c; }
.ovplans__label span { font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 600; color: #ff4f12; white-space: nowrap; }
.ovplans__label:hover span { text-decoration: underline; }
.ovplans__col > [data-pricing] { flex: 1; display: flex; }
.ovplans__col .plans { flex: 1; display: flex; width: 100% !important; margin: 0 !important; }
.ovplans__col .plan { flex: 1; width: 100%; }
@media (max-width: 1000px) { .ovplans { grid-template-columns: 1fr; max-width: 460px; margin: 0 auto; } }

/* Reseller web – „Descoperiți avantajele…”: în lățimea paginii, carduri aliniate */
@media (min-width: 1101px) {
  .radv__list { width: auto; max-width: none; margin-left: 0; }
}
.radv__list { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 50px; }
.radv__list li { align-items: center; min-height: 64px; padding: 14px 16px; border-radius: 12px; background: #fff; border: 1px solid #eceae4; box-shadow: 0 4px 14px rgba(30, 30, 60, .04); font-size: 15px; line-height: 1.45; transition: transform .2s, border-color .2s, box-shadow .2s; }
.radv__list li:hover { transform: translateY(-3px); border-color: rgba(209, 15, 31, .3); box-shadow: 0 12px 26px rgba(30, 30, 60, .08); }
.radv__list svg { margin-top: 0; }
@media (max-width: 1100px) { .radv__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .radv__list { grid-template-columns: 1fr; gap: 10px; } .radv__list li { min-height: 0; } }

/* =====================================================================
   v55 – Despre noi: hero „Salut!” (mov ca la Reseller) + „Noi suntem HostEasy”
   ===================================================================== */
.ahero { position: relative; overflow: hidden; padding: 180px 0 90px; color: #fff; background: linear-gradient(100deg, #1e1a2c 0%, #2a1c3c 45%, #3d1d45 75%, #461c3c 100%); }
.ahero__bg { position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 60px 60px; }
.ahero__bg::after { content: ''; position: absolute; right: -8%; top: 8%; width: 55%; height: 85%; border-radius: 50%; background: radial-gradient(circle, rgba(255, 79, 139, .2), transparent 65%); }
.ahero__inner { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.ahero h1 { margin-top: 22px; font-size: clamp(54px, 7vw, 100px); line-height: 1; letter-spacing: -.02em; }
.ahero__wave { display: inline-block; transform-origin: 70% 75%; animation: aWave 2.4s ease-in-out infinite; }
@keyframes aWave { 0%, 60%, 100% { transform: rotate(0); } 10%, 30% { transform: rotate(16deg); } 20%, 40% { transform: rotate(-8deg); } 50% { transform: rotate(10deg); } }
.ahero__sub { margin-top: 18px; font-family: 'Outfit', sans-serif; font-size: clamp(24px, 2.6vw, 36px); font-weight: 700; line-height: 1.2; }
.ahero__sub span { background: linear-gradient(90deg, #ff9a6b, #ff4f8b); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ahero__lead { margin-top: 20px; max-width: 580px; font-size: clamp(16px, 1.4vw, 19px); line-height: 1.65; color: #e4ddf0; font-weight: 300; }
.ahero__btns { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 32px; }
.ahero__go { gap: 10px; padding: 17px 30px; border-radius: 999px; background: linear-gradient(90deg, #ff7a4d, #ff2d6f); color: #fff; font-weight: 700; box-shadow: 0 14px 30px rgba(255, 45, 111, .35); }
.ahero__go svg { width: 18px; height: 18px; transition: transform .2s; }
.ahero__go:hover { transform: translateY(-2px); } .ahero__go:hover svg { transform: translateX(3px); }
.ahero__try { padding: 17px 30px; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.7); color: #fff; font-weight: 700; }
.ahero__try:hover { background: #fff; color: #2a1c3c; }
.ahero__stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 40px; max-width: 620px; }
.ahero__stats > div { padding: 14px 12px; border-radius: 14px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); }
.ahero__stats b { display: block; font-family: 'Outfit', sans-serif; font-size: 22px; }
.ahero__stats span { display: block; margin-top: 2px; font-size: 12px; line-height: 1.35; color: #c9c1db; }

/* ilustrația */
.ahero__art { position: relative; width: 100%; max-width: 560px; aspect-ratio: 560 / 500; margin-left: auto; }
.ahd { position: absolute; opacity: .92; filter: drop-shadow(0 6px 14px rgba(0,0,0,.25)); }
.ahd--rocket { left: 0; top: 0; width: 15%; animation: aFloat 5s ease-in-out infinite; }
.ahd--target { left: 2%; bottom: 4%; width: 21%; animation: aFloat 6s ease-in-out infinite -1.5s; }
.ahd--mega { right: 0; top: 0; width: 22%; animation: aFloat 5.5s ease-in-out infinite -3s; }
.ahd--cup { right: 3%; bottom: 3%; width: 18%; animation: aFloat 6.5s ease-in-out infinite -2s; }
.ahd__flame { animation: aFlame .5s ease-in-out infinite alternate; transform-origin: 60px 100px; }
.ahd__trail, .ahd__sound, .ahd__spark { animation: aBlink 1.4s ease-in-out infinite; }
.ahd__arrow { animation: aArrow 3s ease-in-out infinite; }
@keyframes aFloat { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-12px) rotate(3deg); } }
@keyframes aFlame { from { transform: scaleY(.8); } to { transform: scaleY(1.15); } }
@keyframes aBlink { 0%, 100% { opacity: .3; } 50% { opacity: 1; } }
@keyframes aArrow { 0%, 70%, 100% { transform: translate(0, 0); } 80% { transform: translate(8px, -8px); } }

.achat { position: absolute; left: 50%; top: 53%; width: 64%; translate: -50% -50%; padding: 18px; border-radius: 20px; background: #fff; color: #15121c; box-shadow: 0 30px 70px rgba(0,0,0,.45); animation: aFloat 7s ease-in-out infinite; }
.achat__top { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid #eee; }
.achat__logo { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: linear-gradient(135deg, #ff7a4d, #ff2d6f); color: #fff; font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 14px; }
.achat__top b { display: block; font-size: 15px; }
.achat__top small { display: flex; align-items: center; gap: 5px; font-size: 12px; color: #16a34a; }
.achat__top small i { width: 7px; height: 7px; border-radius: 50%; background: #22c55e; animation: aBlink 1.2s infinite; }
.achat__msg { max-width: 86%; margin-top: 10px; padding: 9px 13px; border-radius: 14px; font-size: 13px; line-height: 1.45; opacity: 0; animation: aMsg .5s ease .6s both; }
.achat__msg--in { background: #f1f0f6; border-bottom-left-radius: 4px; }
.achat__msg--out { margin-left: auto; background: linear-gradient(135deg, #ff7a4d, #ff2d6f); color: #fff; border-bottom-right-radius: 4px; animation-delay: 1.8s; }
.achat__msg--in + .achat__msg--out + .achat__msg--in { animation-delay: 3s; }
@keyframes aMsg { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.achat__typing { display: inline-flex; gap: 4px; margin-top: 10px; padding: 10px 13px; border-radius: 14px; background: #f1f0f6; }
.achat__typing i { width: 6px; height: 6px; border-radius: 50%; background: #9a97a8; animation: aDot 1s ease-in-out infinite; }
.achat__typing i:nth-child(2) { animation-delay: .15s; } .achat__typing i:nth-child(3) { animation-delay: .3s; }
@keyframes aDot { 0%, 100% { transform: translateY(0); opacity: .5; } 50% { transform: translateY(-4px); opacity: 1; } }
.abadge { position: absolute; padding: 10px 14px; border-radius: 14px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); backdrop-filter: blur(10px); box-shadow: 0 14px 30px rgba(0,0,0,.25); animation: aFloat 6s ease-in-out infinite; }
.abadge b { display: block; font-family: 'Outfit', sans-serif; font-size: 20px; color: #ffb38a; }
.abadge small { font-size: 11.5px; color: #e4ddf0; white-space: nowrap; }
.abadge--1 { left: 24%; top: 0; animation-delay: -2s; }
.abadge--2 { right: 22%; bottom: 2%; animation-delay: -4s; }

/* Noi suntem HostEasy */
.awho { padding: 90px 0; background: linear-gradient(180deg, #fff 0%, #f6f4fb 100%); }
.awho__inner { display: grid; grid-template-columns: 1fr 1.15fr; gap: 60px; align-items: center; }
.awho h2 { font-size: clamp(40px, 5.2vw, 76px); line-height: 1.02; letter-spacing: -.02em; color: #0f2233; }
.awho h2 span { display: block; background: linear-gradient(90deg, #6b2fd6, #ff2d6f); -webkit-background-clip: text; background-clip: text; color: transparent; }
.awho p { font-size: 18px; line-height: 1.8; color: #1c2b3a; }

@media (max-width: 1000px) {
  .ahero__inner { grid-template-columns: 1fr; }
  .ahero__art { margin: 0 auto; }
  .awho__inner { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 640px) {
  .ahero { padding: 120px 0 60px; }
  .ahero__btns .btn { flex: 1; justify-content: center; padding: 16px 20px; }
  .ahero__stats { grid-template-columns: repeat(2, 1fr); }
  .ahero__art { aspect-ratio: 360 / 470; }
  .achat { width: 80%; padding: 14px; top: 52%; }
  .abadge--1 { left: auto; right: 0; top: 2%; }
  .abadge--2 { right: auto; left: 0; bottom: 0; }
  .ahd--target { display: none; }
  .ahd--mega { top: 3%; right: auto; left: 32%; width: 18%; }
  .achat__msg { font-size: 12px; }
  .abadge { padding: 7px 10px; } .abadge b { font-size: 16px; } .abadge small { font-size: 10px; }
  .awho { padding: 60px 0; }
  .awho p { font-size: 16.5px; }
}

/* =====================================================================
   v56 – Pagina Data Center (DATAFOREST Germania)
   ===================================================================== */
.dch { position: relative; overflow: hidden; padding: 170px 0 90px; color: #fff; background: linear-gradient(100deg, #1e1a2c 0%, #2a1c3c 45%, #3d1d45 75%, #461c3c 100%); }
.dch__inner { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.dch__content h1 { display: grid; margin-top: 20px; line-height: 1; }
.dch__content h1 b { font-family: 'Outfit', sans-serif; font-weight: 800; font-size: clamp(44px, 5.6vw, 84px); letter-spacing: -.02em; }
.dch__content h1 span { font-family: 'Inter', sans-serif; font-weight: 200; font-size: clamp(42px, 5.2vw, 78px); background: linear-gradient(90deg, #ff9a6b, #ff4f8b); -webkit-background-clip: text; background-clip: text; color: transparent; }
.dch__lead { margin-top: 24px; max-width: 580px; font-size: clamp(16px, 1.4vw, 19px); line-height: 1.65; color: #e4ddf0; font-weight: 300; }
.dch__lead b { color: #fff; font-weight: 700; }
.dch__specs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 32px; max-width: 600px; }
.dch__specs > div { padding: 14px 14px; border-radius: 14px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); transition: transform .25s, background .25s; }
.dch__specs > div:hover { transform: translateY(-4px); background: rgba(255,255,255,.1); }
.dch__specs b { display: block; font-family: 'Outfit', sans-serif; font-size: 21px; color: #ffb38a; }
.dch__specs span { display: block; margin-top: 2px; font-size: 12.5px; color: #c9c1db; }

.dch__art { position: relative; width: 100%; max-width: 560px; aspect-ratio: 560 / 440; }
.dch__path { position: absolute; inset: 0; width: 100%; height: 100%; }
.dch__path path { animation: rrwDash 1.6s linear infinite; }
.dch__pie { position: absolute; left: 0; top: 4%; width: 18%; animation: aFloat 6s ease-in-out infinite; }
.dch__slice { transform-origin: 56px 46px; animation: dchSlice 3s ease-in-out infinite; }
@keyframes dchSlice { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(5px, -5px); } }
.dch__plane { position: absolute; right: 2%; top: 2%; width: 18%; animation: dchPlane 5s ease-in-out infinite; }
@keyframes dchPlane { 0%, 100% { transform: translate(0, 0) rotate(0); } 50% { transform: translate(-10px, 10px) rotate(-6deg); } }
.dch__racks { position: absolute; left: 12%; right: 10%; bottom: 0; display: flex; align-items: flex-end; justify-content: center; gap: 6%; height: 78%; }
.dch__rack { position: relative; display: grid; gap: 6px; padding: 10px; border-radius: 6px 6px 0 0; background: linear-gradient(180deg, #2b2b33, #121217); border: 2px solid #3a3a44; box-shadow: 0 30px 60px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.04); }
.dch__rack--s { width: 27%; height: 76%; }
.dch__rack--l { width: 32%; height: 100%; }
.dch__rack i { display: grid; place-items: center; border-radius: 4px; background: radial-gradient(circle, #3a3a44 1px, transparent 1.4px) 0 0 / 6px 6px, #1c1c22; border: 1px solid #33333c; font-style: normal; }
.dch__logo { font-family: 'Outfit', sans-serif; font-weight: 800; font-size: clamp(20px, 3vw, 34px); color: #ff7a8f; text-shadow: 0 0 18px rgba(255, 79, 139, .6); letter-spacing: .02em; }
.dch__leds { position: absolute; right: 10px; top: 10px; display: flex; gap: 4px; }
.dch__leds b { width: 5px; height: 5px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 6px #22c55e; animation: rsrvBlink 1.2s ease-in-out infinite; }
.dch__leds b:nth-child(2) { background: #3fb6ff; box-shadow: 0 0 6px #3fb6ff; animation-delay: .3s; }
.dch__leds b:nth-child(3) { animation-delay: .7s; }
.dch__tag { position: absolute; left: 50%; bottom: -14px; translate: -50% 0; display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 999px; background: #fff; color: #2a1c3c; font-size: 13px; font-weight: 800; white-space: nowrap; box-shadow: 0 14px 30px rgba(0,0,0,.35); }

/* pill comun */
.dcpill { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 10px; background: #f3eefe; border: 1px solid #e3d8fb; color: #2a1c3c; font-size: 14px; font-weight: 600; }
.dcpill--dark { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.18); color: #fff; }

/* rânduri text + poză */
.dcrow { padding: 70px 0; background: #fff; color: #15121c; }
.dcrow--first { padding-top: 90px; }
.dcrow__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.dcrow--rev .dcrow__img { order: -1; }
.dcrow h2 { font-size: clamp(28px, 3vw, 42px); line-height: 1.15; color: #0f2233; }
.dcrow__big { margin-top: 20px; font-size: clamp(34px, 4vw, 56px) !important; }
.dcrow__text p { margin-top: 20px; font-size: 16.5px; line-height: 1.75; color: #2f2b38; }
.dcrow__img { position: relative; margin: 0; border-radius: 18px; overflow: hidden; aspect-ratio: 4 / 4.4; background: #ece8f5; box-shadow: 0 24px 50px rgba(30, 20, 60, .14); }
.dcrow__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s ease; }
.dcrow__img:hover img { transform: scale(1.05); }
.dcrow__img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(160deg, rgba(91, 61, 245, .12), transparent 45%, rgba(255, 79, 139, .12)); pointer-events: none; }
.dcquote { margin: 34px 0 0; padding-top: 30px; border-top: 1px solid #ddd; font-family: 'Outfit', sans-serif; font-size: 21px; font-weight: 700; line-height: 1.4; color: #3d1d45; }
.dcquote span { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 18px; border-radius: 8px 8px 8px 0; background: linear-gradient(135deg, #ff7a4d, #ff2d6f); color: #fff; font-size: 34px; line-height: 1; padding-top: 12px; }

/* Inima infrastructurii + tehnologii (fundal închis mov) */
.dcheart, .dctech { padding: 90px 0; color: #fff; background: linear-gradient(180deg, #1e1a2c 0%, #2a1c3c 100%); }
.dcheart { background: linear-gradient(180deg, #1e1a2c 0%, #2a1c3c 62%, #fff 62%); padding-bottom: 70px; }
.dcheart__head { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: start; }
.dcheart__head h2 { margin-top: 20px; font-size: clamp(36px, 4.4vw, 62px); line-height: 1.05; }
.dcheart__head p { font-size: 17px; line-height: 1.7; color: #e4ddf0; }
.dcheart__head p b { color: #fff; }
.dcheart__media { position: relative; margin-top: 50px; border-radius: 20px; overflow: hidden; aspect-ratio: 16 / 7.5; background: #2a1c3c; box-shadow: 0 30px 70px rgba(20, 10, 40, .35); }
.dcheart__media img { width: 100%; height: 100%; object-fit: cover; }
.dcheart__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(30, 26, 44, .55), transparent 50%); pointer-events: none; }
.dcheart__card { position: absolute; z-index: 1; display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: 14px; background: rgba(255,255,255,.95); color: #15121c; box-shadow: 0 16px 34px rgba(0,0,0,.3); animation: aFloat 6s ease-in-out infinite; }
.dcheart__card b { display: block; font-family: 'Outfit', sans-serif; font-size: 18px; }
.dcheart__card small { font-size: 12px; color: #6c6a75; }
.dcheart__card .rrtrial__live { position: static; }
.dcheart__card--loc { left: 24px; top: 24px; }
.dcheart__card--net { right: 24px; top: 40%; display: block; animation-delay: -2s; }
.dcheart__card--ddos { left: 24px; bottom: 24px; display: block; animation-delay: -4s; }
.dcheart__card--net b, .dcheart__card--ddos b { color: #c0265f; }
.dcheart__flag { width: 34px; height: 24px; border-radius: 4px; background: linear-gradient(#000 0 33.3%, #dd0000 33.3% 66.6%, #ffce00 66.6%); box-shadow: 0 0 0 1px rgba(0,0,0,.1); }

.dctech { background: linear-gradient(160deg, #1e1a2c 0%, #2a1c3c 55%, #3d1d45 100%); }
.dctech__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 50px; }
.dctech__grid article { padding: 26px 24px; border-radius: 16px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); transition: transform .25s, border-color .25s, background .25s; }
.dctech__grid article:hover { transform: translateY(-5px); background: rgba(255,255,255,.08); border-color: rgba(255, 122, 77, .5); }
.dctech__grid h3 { font-family: 'Outfit', sans-serif; font-size: 18px; line-height: 1.3; }
.dctech__grid p { margin-top: 12px; font-size: 14.5px; line-height: 1.6; color: #c9c1db; }

@media (max-width: 1000px) {
  .dch__inner, .dcrow__inner, .dcheart__head { grid-template-columns: 1fr; gap: 30px; }
  .dch__art { order: 2; margin: 0 auto; }
  .dcrow--rev .dcrow__img { order: 0; }
  .dcrow__img { aspect-ratio: 16 / 10; }
  .dctech__grid { grid-template-columns: repeat(2, 1fr); }
  .dcheart__media { aspect-ratio: 4 / 3; }
}
@media (max-width: 640px) {
  .dch { padding: 120px 0 70px; }
  .dch__specs { grid-template-columns: repeat(2, 1fr); }
  .dcrow { padding: 50px 0; }
  .dcheart, .dctech { padding: 60px 0; }
  .dctech__grid { grid-template-columns: 1fr; }
  .dcheart__media { aspect-ratio: 3 / 4; }
  .dcheart__card { padding: 9px 12px; }
  .dcheart__card--loc { left: 12px; top: 12px; right: 12px; }
  .dcheart__card--net { right: 12px; top: auto; bottom: 90px; }
  .dcheart__card--ddos { left: 12px; bottom: 12px; }
}

/* =====================================================================
   v57 – IP-ul meu: hero mov cu glob animat
   ===================================================================== */
.iph { position: relative; overflow: hidden; padding: 170px 0 90px; color: #fff; background: linear-gradient(100deg, #1e1a2c 0%, #2a1c3c 45%, #3d1d45 75%, #461c3c 100%); }
.iph__inner { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.iph h1 { margin-top: 20px; font-size: clamp(48px, 6.4vw, 92px); line-height: 1; letter-spacing: -.02em; }
.iph h1 span { font-family: 'Inter', sans-serif; font-weight: 200; background: linear-gradient(90deg, #ff9a6b, #ff4f8b); -webkit-background-clip: text; background-clip: text; color: transparent; }
.iph__lead { margin-top: 18px; max-width: 560px; font-size: clamp(16px, 1.4vw, 19px); line-height: 1.6; color: #e4ddf0; font-weight: 300; }
.iph__box { margin-top: 28px; max-width: 580px; padding: 20px 24px; border-radius: 18px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); backdrop-filter: blur(8px); box-shadow: 0 20px 40px rgba(0,0,0,.25); }
.iph__box small { font-size: 13px; color: #c9c1db; }
.iph__ip { margin-top: 6px; font-family: 'Outfit', sans-serif; font-size: clamp(26px, 3.2vw, 42px); font-weight: 800; line-height: 1.15; color: #fff; word-break: break-all; }
.iph__ip .ipx__loading { font-size: .6em; font-weight: 600; color: #c9c1db; }
.iph__where { margin-top: 8px; font-size: 15px; color: #ffb38a; }
.iph__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 26px; }
.iph__go { gap: 10px; padding: 15px 28px; border-radius: 999px; background: linear-gradient(90deg, #ff7a4d, #ff2d6f); color: #fff; font-weight: 700; box-shadow: 0 14px 30px rgba(255, 45, 111, .35); }
.iph__go:hover:not(:disabled) { transform: translateY(-2px); }
.iph__go:disabled { opacity: .6; cursor: default; }
.iph__try { gap: 10px; padding: 15px 28px; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.7); color: #fff; font-weight: 700; background: transparent; }
.iph__try:hover { background: #fff; color: #2a1c3c; }
.iph__actions .icon { width: 18px; height: 18px; }

.iph__art { position: relative; width: 100%; max-width: 560px; aspect-ratio: 560 / 460; margin-left: auto; }
.iph__svg { width: 100%; height: 100%; overflow: visible; }
.iph__meridians { animation: iphSpin 14s linear infinite; }
@keyframes iphSpin { from { transform: translateX(0); } to { transform: translateX(-236px); } }
.iph__land { animation: iphLand 14s linear infinite; }
@keyframes iphLand { 0% { transform: translateX(0); } 50% { transform: translateX(-30px); } 100% { transform: translateX(0); } }
.iph__orbit { transform-box: fill-box; transform-origin: center; }
.iph__orbit--2 { animation: iphPulse 4s ease-in-out infinite; }
@keyframes iphPulse { 0%, 100% { opacity: .5; } 50% { opacity: 1; } }
.iph__pin { animation: iphPin 2.2s ease-in-out infinite; transform-box: fill-box; transform-origin: bottom center; }
@keyframes iphPin { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.iph__link { animation: rrwDash 1.4s linear infinite; }
.iph__leds circle { animation: rsrvBlink 1.2s ease-in-out infinite; }
.iph__leds circle:nth-child(2) { animation-delay: .4s; } .iph__leds circle:nth-child(3) { animation-delay: .8s; }

.iph__card { position: absolute; display: flex; align-items: center; gap: 10px; max-width: 62%; padding: 10px 14px; border-radius: 14px; background: #fff; color: #15121c; box-shadow: 0 16px 34px rgba(0,0,0,.35); animation: aFloat 6s ease-in-out infinite; }
.iph__card small { display: block; font-size: 11px; color: #6c6a75; }
.iph__card b { display: block; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.iph__ico { display: grid; place-items: center; flex-shrink: 0; width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(135deg, #7b5cff, #5b3df5); color: #fff; font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 13px; }
.iph__ico--pin { background: #ffe7ef; font-size: 17px; }
.iph__ico--ok { background: #dcfce7; font-size: 16px; }
.iph__card--ip { left: 0; top: 2%; }
.iph__card--loc { right: 0; top: 30%; animation-delay: -2s; }
.iph__card--sec { left: 30%; bottom: 1%; animation-delay: -4s; }

@media (max-width: 1000px) {
  .iph__inner { grid-template-columns: 1fr; }
  .iph__art { margin: 10px auto 0; }
}
@media (max-width: 640px) {
  .iph { padding: 120px 0 60px; }
  .iph__actions .btn { flex: 1; justify-content: center; padding: 14px 18px; }
  .iph__box { padding: 16px 18px; }
  .iph__card { padding: 7px 10px; gap: 8px; }
  .iph__ico { width: 28px; height: 28px; font-size: 11px; }
  .iph__card b { font-size: 12px; } .iph__card small { font-size: 10px; }
  .iph__card--sec { left: 22%; }
}

/* =====================================================================
   v58 – Politica de confidențialitate: hero mov + cuprins + secțiuni card
   ===================================================================== */
.pvh { position: relative; overflow: hidden; padding: 170px 0 110px; color: #fff; background: linear-gradient(100deg, #1e1a2c 0%, #2a1c3c 45%, #3d1d45 75%, #461c3c 100%); }
.pvh__inner { position: relative; display: grid; grid-template-columns: 1.05fr 1fr; gap: 50px; align-items: center; }
.pvh h1 { margin-top: 20px; font-size: clamp(40px, 5vw, 72px); line-height: 1.05; letter-spacing: -.02em; }
.pvh h1 span { display: block; font-family: 'Inter', sans-serif; font-weight: 200; background: linear-gradient(90deg, #ff9a6b, #ff4f8b); -webkit-background-clip: text; background-clip: text; color: transparent; }
.pvh__lead { margin-top: 20px; max-width: 580px; font-size: clamp(16px, 1.4vw, 19px); line-height: 1.65; color: #e4ddf0; font-weight: 300; }
.pvh__chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.pvh__chips span { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); font-size: 14px; font-weight: 600; }
.pvh__chips i { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: #22c55e; font-style: normal; font-size: 12px; font-weight: 800; }
.pvh__date { margin-top: 22px; font-size: 14px; color: #c9c1db; }
.pvh__date b { color: #fff; }

.pvh__art { position: relative; width: 100%; max-width: 520px; aspect-ratio: 520 / 440; margin-left: auto; }
.pvh__glow { position: absolute; left: 50%; top: 50%; width: 80%; aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; background: radial-gradient(circle, rgba(255, 79, 139, .28), transparent 65%); animation: iphPulse 4s ease-in-out infinite; }
.pvh__doc { position: absolute; left: 8%; top: 10%; width: 58%; padding: 18px 20px 22px; border-radius: 18px; background: #fff; color: #15121c; box-shadow: 0 30px 70px rgba(0,0,0,.45); overflow: hidden; transform: rotate(-4deg); animation: pvDoc 7s ease-in-out infinite; }
@keyframes pvDoc { 0%, 100% { transform: rotate(-4deg) translateY(0); } 50% { transform: rotate(-3deg) translateY(-10px); } }
.pvh__doc-top { display: flex; gap: 5px; margin-bottom: 14px; }
.pvh__doc-top span { width: 9px; height: 9px; border-radius: 50%; background: #ff5f57; }
.pvh__doc-top span:nth-child(2) { background: #febc2e; } .pvh__doc-top span:nth-child(3) { background: #28c840; }
.pvh__doc > b { display: block; font-family: 'Outfit', sans-serif; font-size: 18px; }
.pvh__doc > i { display: block; height: 8px; margin-top: 10px; border-radius: 4px; background: #ece9f3; }
.pvh__doc > i.short { width: 60%; }
.pvh__fields { display: grid; gap: 8px; margin-top: 16px; }
.pvh__fields div { display: flex; justify-content: space-between; align-items: center; padding: 9px 12px; border-radius: 10px; background: #f6f4fb; }
.pvh__fields small { font-size: 12px; color: #6c6a75; }
.pvh__fields em { font-style: normal; font-size: 13px; font-weight: 700; letter-spacing: .06em; color: #5b3df5; }
.pvh__scan { position: absolute; left: 0; right: 0; top: 0; height: 40px; background: linear-gradient(180deg, transparent, rgba(91, 61, 245, .18), transparent); border-bottom: 2px solid rgba(91, 61, 245, .5); animation: pvScan 3s ease-in-out infinite; }
@keyframes pvScan { 0% { top: -40px; } 100% { top: 100%; } }
.pvh__shield { position: absolute; right: 6%; bottom: 8%; width: 36%; filter: drop-shadow(0 24px 34px rgba(255, 45, 111, .45)); animation: aFloat 5s ease-in-out infinite; }
.pvh__card { position: absolute; display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 14px; background: rgba(255,255,255,.96); color: #15121c; box-shadow: 0 16px 34px rgba(0,0,0,.35); animation: aFloat 6s ease-in-out infinite; }
.pvh__card b { display: block; font-size: 14px; white-space: nowrap; }
.pvh__card small { font-size: 11.5px; color: #6c6a75; white-space: nowrap; }
.pvh__ico { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #e8edff; font-size: 17px; }
.pvh__ico--ok { background: #dcfce7; } .pvh__ico--no { background: #ffe7ef; }
.pvh__card--1 { right: 0; top: 4%; animation-delay: -1.5s; }
.pvh__card--2 { left: 0; bottom: 6%; animation-delay: -3s; }
.pvh__card--3 { right: 34%; bottom: -2%; animation-delay: -4.5s; }

/* Pe scurt – carduri care urcă peste marginea hero-ului */
.pvs { position: relative; z-index: 2; margin-top: -60px; }
.pvs__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.pvs__grid > div { padding: 24px 22px; border-radius: 18px; background: #fff; box-shadow: 0 20px 44px rgba(30, 20, 60, .12); transition: transform .25s; }
.pvs__grid > div:hover { transform: translateY(-5px); }
.pvs__grid span { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: #f3eefe; font-size: 22px; }
.pvs__grid b { display: block; margin-top: 14px; font-family: 'Outfit', sans-serif; font-size: 18px; color: #15121c; }
.pvs__grid p { margin-top: 6px; font-size: 14px; line-height: 1.55; color: #5a5866; }

/* Conținut */
.pvb { padding: 70px 0 90px; }
.pvb__inner { display: grid; grid-template-columns: 260px 1fr; gap: 40px; align-items: start; }
.pvb__toc { position: sticky; top: 110px; display: grid; gap: 4px; padding: 22px; border-radius: 18px; background: #f6f4fb; border: 1px solid #ebe6f6; }
.pvb__toc > b { margin-bottom: 8px; font-family: 'Outfit', sans-serif; font-size: 17px; color: #15121c; }
.pvb__toc a { padding: 8px 10px; border-radius: 10px; font-size: 14.5px; color: #3d3a48; transition: background .2s, color .2s; }
.pvb__toc a:hover { background: #fff; color: #c0265f; }
.pvb__toc .pvb__ask { margin-top: 10px; background: linear-gradient(90deg, #ff7a4d, #ff2d6f); color: #fff; font-weight: 700; text-align: center; }
.pvb__toc .pvb__ask:hover { color: #fff; filter: brightness(1.05); background: linear-gradient(90deg, #ff7a4d, #ff2d6f); }
.pvb__body.legal__body { max-width: none; display: grid; gap: 18px; }
.pvb__sec { position: relative; scroll-margin-top: 110px; padding: 28px 30px 28px 92px; border-radius: 18px; background: #fff; border: 1px solid #ebe6f6; box-shadow: 0 10px 30px rgba(30, 20, 60, .05); }
.pvb__num { position: absolute; left: 26px; top: 26px; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: linear-gradient(135deg, #3d1d45, #5b3df5); color: #fff; font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 16px; }
.pvb__sec h2 { margin: 6px 0 12px !important; font-size: 22px; }
.pvb__sec p + p { margin-top: 12px; }
.pvb__body .legal__note { margin-top: 6px; }

@media (max-width: 1000px) {
  .pvh__inner { grid-template-columns: 1fr; }
  .pvh__art { margin: 10px auto 0; }
  .pvs__grid { grid-template-columns: repeat(2, 1fr); }
  .pvb__inner { grid-template-columns: 1fr; }
  .pvb__toc { position: static; }
}
@media (max-width: 640px) {
  .pvh { padding: 120px 0 90px; }
  .pvh__card { padding: 7px 10px; gap: 8px; }
  .pvh__card b { font-size: 12px; } .pvh__card small { font-size: 10px; }
  .pvh__ico { width: 28px; height: 28px; font-size: 14px; }
  .pvh__doc { width: 66%; padding: 14px 14px 16px; }
  .pvh__card--3 { right: 30%; }
  .pvs__grid { grid-template-columns: 1fr; }
  .pvb__sec { padding: 24px 20px; }
  .pvb__num { position: static; margin-bottom: 12px; }
}
/* v58b – fundal deschis și text închis pentru conținutul paginii de confidențialitate */
.pvs { background: linear-gradient(180deg, transparent 0 60px, #f7f5fc 60px); }
.pvb { background: #f7f5fc; color: #3d3a48; }
.pvb__sec h2 { color: #15121c; }
.pvb__sec p, .pvb__sec li { color: #3d3a48; }
.pvb__sec b { color: #15121c; }
.pvb__sec a { color: #c0265f; font-weight: 600; }
.pvb__toc { background: #fff; }
.pvb__toc a:hover { background: #f6f4fb; }
.pvb .legal__note { color: #7a7884; }
.pvs, .pvb { border-top: 0; } .pvb { padding-top: 50px; } .pvs { padding-bottom: 0; }

/* =====================================================================
   v59 – Termeni și condiții: contract animat (reutilizează stilul de la confidențialitate)
   ===================================================================== */
.tch__list { list-style: none; display: grid; gap: 8px; margin: 14px 0 0; padding: 0; }
.tch__list li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; background: #f6f4fb; font-size: 13px; font-weight: 600; color: #3d3a48; }
.tch__list li span { display: grid; place-items: center; flex-shrink: 0; width: 18px; height: 18px; border-radius: 6px; border: 2px solid #c9c1db; }
.tch__list li span::after { content: '✓'; font-size: 11px; font-weight: 900; color: #fff; opacity: 0; }
.tch__list li span { animation: tcCheck 8s ease infinite; }
.tch__list li span::after { animation: tcTick 8s ease infinite; }
.tch__list li:nth-child(2) span, .tch__list li:nth-child(2) span::after { animation-delay: .6s; }
.tch__list li:nth-child(3) span, .tch__list li:nth-child(3) span::after { animation-delay: 1.2s; }
.tch__list li:nth-child(4) span, .tch__list li:nth-child(4) span::after { animation-delay: 1.8s; }
@keyframes tcCheck { 0%, 5% { background: transparent; border-color: #c9c1db; } 10%, 90% { background: #22c55e; border-color: #22c55e; } 100% { background: transparent; border-color: #c9c1db; } }
@keyframes tcTick { 0%, 5% { opacity: 0; } 10%, 90% { opacity: 1; } 100% { opacity: 0; } }
.tch__sign { margin-top: 14px; padding-top: 10px; border-top: 1px dashed #d8d2e6; }
.tch__sign small { font-size: 11px; color: #6c6a75; }
.tch__sign svg { display: block; width: 70%; height: auto; margin-top: 2px; }
.tch__sig { stroke-dasharray: 420; stroke-dashoffset: 420; animation: tcSign 8s ease infinite; }
@keyframes tcSign { 0%, 30% { stroke-dashoffset: 420; } 55%, 92% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 420; } }
.tch__stamp { position: absolute; right: 10%; bottom: 14%; display: grid; place-items: center; width: 30%; aspect-ratio: 1; border-radius: 50%; border: 4px dashed rgba(255,255,255,.85); background: linear-gradient(135deg, #ff7a4d, #ff2d6f); color: #fff; box-shadow: 0 20px 40px rgba(255, 45, 111, .45); animation: tcStamp 8s ease infinite; }
.tch__stamp b { font-size: clamp(30px, 4vw, 48px); line-height: 1; }
.tch__stamp span { margin-top: -18px; font-family: 'Outfit', sans-serif; font-weight: 800; font-size: clamp(10px, 1.1vw, 14px); letter-spacing: .14em; }
@keyframes tcStamp { 0%, 55% { transform: scale(1.6) rotate(-20deg); opacity: 0; } 62% { transform: scale(.92) rotate(-12deg); opacity: 1; } 66%, 94% { transform: scale(1) rotate(-12deg); opacity: 1; } 100% { transform: scale(1) rotate(-12deg); opacity: 0; } }

/* =====================================================================
   v60 – Noutăți și ghiduri: hero mov + articol recomandat + grilă cu filtre
   ===================================================================== */
.bgh { position: relative; overflow: hidden; padding: 170px 0 100px; color: #fff; background: linear-gradient(100deg, #1e1a2c 0%, #2a1c3c 45%, #3d1d45 75%, #461c3c 100%); }
.bgh__inner { position: relative; display: grid; grid-template-columns: 1.05fr 1fr; gap: 50px; align-items: center; }
.bgh h1 { margin-top: 20px; font-size: clamp(42px, 5.4vw, 80px); line-height: 1.02; letter-spacing: -.02em; }
.bgh h1 span { font-family: 'Inter', sans-serif; font-weight: 200; background: linear-gradient(90deg, #ff9a6b, #ff4f8b); -webkit-background-clip: text; background-clip: text; color: transparent; }
.bgh__lead { margin-top: 20px; max-width: 580px; font-size: clamp(16px, 1.4vw, 19px); line-height: 1.65; color: #e4ddf0; font-weight: 300; }
.bgh__search { display: flex; align-items: center; gap: 12px; max-width: 560px; margin-top: 30px; padding: 6px 8px 6px 20px; border-radius: 999px; background: #fff; box-shadow: 0 20px 40px rgba(0,0,0,.3); }
.bgh__search svg { width: 20px; height: 20px; flex-shrink: 0; color: #8a86a0; }
.bgh__search input { flex: 1; min-width: 0; padding: 12px 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 15.5px; color: #15121c; }
.bgh__cats { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.bgh__cat { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: #fff; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; transition: background .2s, border-color .2s; }
.bgh__cat em { padding: 1px 8px; border-radius: 999px; background: rgba(255,255,255,.14); font-style: normal; font-size: 12px; }
.bgh__cat:hover { background: rgba(255,255,255,.12); }
.bgh__cat.is-active { background: linear-gradient(90deg, #ff7a4d, #ff2d6f); border-color: transparent; }
.bgh__cat.is-active em { background: rgba(255,255,255,.25); }

.bgh__art { position: relative; width: 100%; max-width: 520px; aspect-ratio: 520 / 440; margin-left: auto; }
.bgh__glow { position: absolute; left: 50%; top: 50%; width: 80%; aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; background: radial-gradient(circle, rgba(255, 79, 139, .26), transparent 65%); animation: iphPulse 4s ease-in-out infinite; }
.bgh__paper { position: absolute; left: 50%; top: 50%; width: 62%; height: 78%; border-radius: 18px; translate: -50% -50%; }
.bgh__paper--back { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.18); transform: rotate(-12deg) translate(-28px, 6px); }
.bgh__paper--mid { background: rgba(255,255,255,.22); border: 1px solid rgba(255,255,255,.25); transform: rotate(-6deg) translate(-12px, 2px); }
.bgh__paper--front { padding: 16px; background: #fff; color: #15121c; box-shadow: 0 30px 70px rgba(0,0,0,.45); animation: bgPaper 7s ease-in-out infinite; }
@keyframes bgPaper { 0%, 100% { transform: rotate(3deg) translateY(0); } 50% { transform: rotate(2deg) translateY(-10px); } }
.bgh__paper-top { display: flex; align-items: center; gap: 10px; }
.bgh__logo { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(135deg, #ff7a4d, #ff2d6f); color: #fff; font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 13px; }
.bgh__paper-top b { display: block; font-size: 14px; }
.bgh__paper-top small { font-size: 11px; color: #6c6a75; }
.bgh__new { margin-left: auto; padding: 4px 9px; border-radius: 999px; background: #22c55e; color: #fff; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; animation: rsrvBlink 1.6s ease-in-out infinite; }
.bgh__cover { display: grid; align-content: center; height: 36%; margin-top: 12px; padding: 0 16px; border-radius: 12px; background: linear-gradient(135deg, #2a1c3c, #5b3df5); color: #fff; font-family: 'Outfit', sans-serif; line-height: 1.05; overflow: hidden; }
.bgh__cover span { font-size: clamp(16px, 2.2vw, 26px); font-weight: 800; color: #ffb38a; }
.bgh__cover b { font-size: clamp(16px, 2.2vw, 26px); }
.bgh__title { display: block; margin-top: 12px; font-size: 14.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.bgh__paper--front > i { display: block; height: 7px; margin-top: 9px; border-radius: 4px; background: #ece9f3; }
.bgh__paper--front > i.short { width: 55%; }
.bgh__bell { position: absolute; right: 8%; top: 4%; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 18px; background: linear-gradient(135deg, #7b5cff, #5b3df5); box-shadow: 0 16px 34px rgba(91, 61, 245, .45); animation: bgBell 3s ease-in-out infinite; transform-origin: top center; }
.bgh__bell svg { width: 28px; height: 28px; }
.bgh__bell span { position: absolute; right: -6px; top: -6px; display: grid; place-items: center; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 999px; background: #ff2d6f; border: 2px solid #2a1c3c; font-size: 12px; font-weight: 800; }
@keyframes bgBell { 0%, 70%, 100% { transform: rotate(0); } 75% { transform: rotate(14deg); } 80% { transform: rotate(-12deg); } 85% { transform: rotate(8deg); } 90% { transform: rotate(-4deg); } }
.bgh__card { position: absolute; display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 14px; background: rgba(255,255,255,.96); color: #15121c; box-shadow: 0 16px 34px rgba(0,0,0,.35); animation: aFloat 6s ease-in-out infinite; }
.bgh__card b { display: block; font-size: 14px; white-space: nowrap; }
.bgh__card small { font-size: 11.5px; color: #6c6a75; }
.bgh__card--1 { left: 0; top: 20%; animation-delay: -2s; }
.bgh__card--2 { right: 0; bottom: 10%; animation-delay: -4s; }
.bgh__plane { position: absolute; left: 6%; bottom: 4%; width: 14%; opacity: .85; animation: dchPlane 5s ease-in-out infinite; }

/* Lista de articole */
.bgl { padding: 80px 0 90px; background: #f7f5fc; color: #15121c; border-top: 0; }
.bgf { display: grid; grid-template-columns: 1.15fr 1fr; gap: 0; border-radius: 22px; overflow: hidden; background: #fff; box-shadow: 0 24px 60px rgba(30, 20, 60, .1); }
.bgf__cover { position: relative; display: block; min-height: 380px; }
.bgf__cover .cover { height: 100%; min-height: 380px; border-radius: 0; }
.bgf__badge { position: absolute; left: 20px; bottom: 20px; padding: 7px 14px; border-radius: 999px; background: linear-gradient(90deg, #ff7a4d, #ff2d6f); color: #fff; font-size: 13px; font-weight: 800; box-shadow: 0 10px 22px rgba(255, 45, 111, .4); }
.bgf__body { display: flex; flex-direction: column; justify-content: center; padding: 40px 44px; }
.bgf__body h2 { margin-top: 14px; font-size: clamp(24px, 2.6vw, 34px); line-height: 1.2; color: #15121c; }
.bgf__body h2 a:hover, .bgc h3 a:hover { color: #c0265f; }
.bgf__body > p { margin-top: 14px; font-size: 16px; line-height: 1.7; color: #4a4756; }
.bgf__go { align-self: flex-start; gap: 10px; margin-top: 24px; padding: 14px 26px; border-radius: 999px; background: linear-gradient(90deg, #ff7a4d, #ff2d6f); color: #fff; font-weight: 700; box-shadow: 0 12px 26px rgba(255, 45, 111, .3); }
.bgf__go:hover { transform: translateY(-2px); }
.bgf__go .icon { width: 18px; height: 18px; }
.bgc__meta { display: flex; align-items: center; gap: 16px; margin-top: 18px; font-size: 13.5px; color: #6c6a75; }
.bgc__meta span { display: inline-flex; align-items: center; gap: 6px; }
.bgc__meta .icon { width: 16px; height: 16px; }
.bgc__meta .icon-btn { margin-left: auto; }
.bgl__head { display: flex; align-items: baseline; justify-content: space-between; margin: 60px 0 24px; }
.bgl__head h2 { font-size: clamp(24px, 2.6vw, 34px); color: #15121c; }
.bgl__head span { font-size: 14px; color: #6c6a75; }
.bgl__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.bgc { display: flex; flex-direction: column; border-radius: 18px; overflow: hidden; background: #fff; box-shadow: 0 14px 36px rgba(30, 20, 60, .07); transition: transform .25s, box-shadow .25s; }
.bgc:hover { transform: translateY(-6px); box-shadow: 0 24px 50px rgba(30, 20, 60, .14); }
.bgc__cover { display: block; }
.bgc__cover .cover { border-radius: 0; aspect-ratio: 16 / 10; height: auto; }
.bgc__body { display: flex; flex-direction: column; flex: 1; padding: 22px 24px 20px; }
.bgc h3 { margin-top: 12px; font-size: 19px; line-height: 1.3; color: #15121c; }
.bgc__body > p { margin-top: 10px; font-size: 14.5px; line-height: 1.6; color: #5a5866; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.bgc .bgc__meta { margin-top: auto; padding-top: 16px; }
.bgl__empty { padding: 60px 20px; border-radius: 18px; background: #fff; text-align: center; }
.bgl__empty b { font-size: 20px; }
.bgl__empty p { margin-top: 6px; color: #6c6a75; }

@media (max-width: 1000px) {
  .bgh__inner { grid-template-columns: 1fr; }
  .bgh__art { margin: 10px auto 0; }
  .bgf { grid-template-columns: 1fr; }
  .bgf__cover, .bgf__cover .cover { min-height: 280px; }
  .bgl__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .bgh { padding: 120px 0 70px; }
  .bgh__card { padding: 7px 10px; gap: 8px; }
  .bgh__card b { font-size: 12px; } .bgh__card small { font-size: 10px; }
  .bgh__paper { width: 70%; }
  .bgh__bell { width: 46px; height: 46px; }
  .bgf__body { padding: 26px 22px; }
  .bgl { padding: 50px 0 60px; }
  .bgl__grid { grid-template-columns: 1fr; }
}
.bgf { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
.bgf__cover, .bgc__cover { min-width: 0; overflow: hidden; }
.bgf__cover .cover { width: 100%; aspect-ratio: auto; }
.bgf__cover .cover .cover__title { font-size: clamp(34px, 4vw, 56px); }
/* coperți în tonurile mov ale paginii */
.bgl .cover:not(.cover--img) { background: radial-gradient(circle at 85% 30%, rgba(255, 79, 139, .4), transparent 45%), linear-gradient(135deg, #1e1a2c, #3d1d45 60%, #5b3df5); }
.bgl .cover:not(.cover--img) .cover__title span { color: #ffb38a; }
@media (max-width: 1000px) { .bgf { grid-template-columns: minmax(0, 1fr); } }

/* =====================================================================
   v61 – Mobil: IP-ul meu (ilustrație + detalii compacte pe 2 coloane)
   ===================================================================== */
@media (max-width: 640px) {
  .iph__art { max-width: 420px; }
  .iph__card { max-width: 72%; }
  .iph__card--ip { left: 0; top: 0; }
  .iph__card--loc { right: 0; top: auto; bottom: 34%; }
  .iph__card--sec { left: auto; right: 2%; bottom: 0; }
  .ipd { padding: 30px 0 50px; }
  .ipd__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .ipd__item { flex-direction: column; align-items: flex-start; gap: 8px; padding: 14px 12px; }
  .ipd__item--hl { grid-column: 1 / -1; flex-direction: row; align-items: center; }
  .ipd__ico { width: 34px; height: 34px; border-radius: 10px; }
  .ipd__ico svg { width: 18px; height: 18px; }
  .ipd__item small { font-size: 11.5px; }
  .ipd__item b { font-size: 14px; }
  .ipq { padding: 56px 0; }
  .ipq p { font-size: 15.5px; }
  .ipi { padding: 40px 0 60px; }
  .ipi__grid { grid-template-columns: 1fr; gap: 14px; }
  .ipi__card { display: grid; grid-template-columns: 46px 1fr; column-gap: 14px; padding: 18px 16px; border-radius: 14px; }
  .ipi__ico { grid-row: span 2; width: 46px; height: 46px; margin-bottom: 0; }
  .ipi__card h3 { font-size: 17px; }
  .ipi__card p { margin-top: 4px; font-size: 14.5px; }
}
/* v61b – Mobil: taburile VPS pe un singur rând */
@media (max-width: 640px) {
  .vtabs { flex-wrap: nowrap; gap: 4px; }
  .vtab { flex: 1 1 0; min-width: 0; padding: 12px 6px; font-size: 11.5px; line-height: 1.2; text-align: center; }
}
/* v61c – Mobil: butoane plutitoare mai mici, ca să nu acopere conținutul */
@media (max-width: 640px) {
  .fab { width: 44px; height: 44px; bottom: 14px; }
  .fab .icon { width: 20px; height: 20px; }
  .fab--left { left: 12px; }
  .fab--right { right: 12px; }
  .fab--wa { right: 12px; bottom: 84px; width: 46px; height: 46px; }
  .fab--wa svg { width: 24px; height: 24px; }
}
/* v61d – Anti-DDoS: nota din hero curge ca text normal (partea roșie nu mai e coloană separată) */
.dd-hero__note { display: block; position: relative; padding-left: 32px; }
.dd-hero__note svg { position: absolute; left: 0; top: 0; }
@media (max-width: 640px) { .dd-hero__note { margin-top: 30px; font-size: 15px; } }

/* =====================================================================
   v62 – Politica de cookies: biscuit animat + panou preferințe + tabel
   ===================================================================== */
.ckh__cookie { position: absolute; left: 4%; top: 6%; width: 46%; filter: drop-shadow(0 24px 34px rgba(0,0,0,.45)); animation: ckSpin 14s linear infinite; }
@keyframes ckSpin { from { transform: rotate(0); } to { transform: rotate(360deg); } }
.ckh__crumb { position: absolute; width: 12px; height: 10px; border-radius: 40% 60% 50% 50%; background: #d9913f; animation: ckCrumb 3s ease-in infinite; }
.ckh__crumb--1 { left: 44%; top: 12%; }
.ckh__crumb--2 { left: 48%; top: 20%; width: 8px; height: 7px; animation-delay: 1s; }
.ckh__crumb--3 { left: 40%; top: 8%; width: 9px; height: 8px; animation-delay: 2s; }
@keyframes ckCrumb { 0% { transform: translate(0, 0) rotate(0); opacity: 0; } 15% { opacity: 1; } 100% { transform: translate(30px, 120px) rotate(200deg); opacity: 0; } }
.ckh__panel { position: absolute; right: 2%; bottom: 8%; width: 58%; padding: 18px; border-radius: 18px; background: #fff; color: #15121c; box-shadow: 0 30px 70px rgba(0,0,0,.45); animation: pvDoc 7s ease-in-out infinite; }
.ckh__panel > b { display: block; margin-bottom: 8px; font-family: 'Outfit', sans-serif; font-size: 17px; }
.ckh__row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 0; border-top: 1px solid #eee; }
.ckh__row span { display: block; font-size: 13.5px; font-weight: 700; }
.ckh__row small { font-size: 11px; color: #6c6a75; }
.ckh__sw { position: relative; flex-shrink: 0; width: 40px; height: 22px; border-radius: 999px; background: #d9d6e2; }
.ckh__sw::after { content: ''; position: absolute; left: 3px; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.ckh__sw--on { background: #22c55e; }
.ckh__sw--on::after { left: 21px; }
.ckh__sw--lock { opacity: .75; }
.ckh__row:nth-of-type(2) .ckh__sw { animation: ckToggle 5s ease-in-out infinite; }
.ckh__row:nth-of-type(2) .ckh__sw::after { animation: ckKnob 5s ease-in-out infinite; }
@keyframes ckToggle { 0%, 40%, 100% { background: #22c55e; } 50%, 90% { background: #d9d6e2; } }
@keyframes ckKnob { 0%, 40%, 100% { transform: translateX(0); } 50%, 90% { transform: translateX(-18px); } }
.ckh__card--1 { right: 0; top: 2%; animation-delay: -1.5s; }
.ckh__card--2 { left: 0; bottom: 4%; animation-delay: -3.5s; }

/* tabel cookie-uri */
.cktable { display: grid; margin-top: 16px; border-radius: 14px; overflow: hidden; border: 1px solid #ebe6f6; }
.cktable__row { display: grid; grid-template-columns: 1.1fr .8fr 2fr .8fr; gap: 14px; padding: 14px 16px; border-top: 1px solid #ebe6f6; font-size: 14px; line-height: 1.5; color: #3d3a48; }
.cktable__row:first-child { border-top: 0; }
.cktable__row--head { background: #f6f4fb; font-size: 12.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: #6c6a75; }
.cktable code { padding: 2px 7px; border-radius: 6px; background: #f3eefe; color: #5b3df5; font-size: 12.5px; word-break: break-all; }
.cktag { display: inline-block; padding: 3px 10px; border-radius: 999px; font-style: normal; font-size: 12px; font-weight: 700; }
.cktag--ess { background: #dcfce7; color: #15803d; }
.cktag--pref { background: #e0ecff; color: #1d4ed8; }
.ckbrowsers { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 16px; }
.pvb__sec .ckbrowsers a { display: grid; gap: 2px; padding: 14px; border-radius: 14px; border: 1px solid #ebe6f6; background: #faf9fd; text-align: center; color: inherit; font-weight: 400; transition: transform .2s, border-color .2s; }
.pvb__sec .ckbrowsers a:hover { transform: translateY(-3px); border-color: #ff7a8f; }
.ckbrowsers b { font-size: 15px; color: #15121c; }
.ckbrowsers small { font-size: 12px; color: #6c6a75; }
.ckreset { gap: 8px; margin-top: 16px; padding: 13px 24px; border-radius: 999px; background: linear-gradient(90deg, #ff7a4d, #ff2d6f); color: #fff; font-weight: 700; box-shadow: 0 12px 26px rgba(255, 45, 111, .3); }
.ckreset:hover { transform: translateY(-2px); }

@media (max-width: 760px) {
  .cktable__row { grid-template-columns: 1fr auto; gap: 6px 12px; }
  .cktable__row--head { display: none; }
  .cktable__row > span:nth-child(3) { grid-column: 1 / -1; }
  .cktable__row > span:nth-child(4) { grid-column: 1 / -1; font-size: 12.5px; color: #6c6a75; }
  .cktable__row > span:nth-child(4)::before { content: 'Durată: '; font-weight: 700; }
  .ckbrowsers { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .ckh__panel { width: 68%; padding: 14px; }
  .ckh__row span { font-size: 12px; } .ckh__row small { font-size: 10px; }
}

/* =====================================================================
   v63 – Prima pagină: glob + Anti-DDoS (în locul „Servere aproape de clienții tăi”)
   ===================================================================== */
.gdd__pill { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px; background: rgba(255, 59, 59, .12); border: 1px solid rgba(255, 59, 59, .35); color: #ff8a7a; font-size: 13px; font-weight: 700; }
.gdd__pill i { width: 8px; height: 8px; border-radius: 50%; background: #ff3b3b; box-shadow: 0 0 10px #ff3b3b; animation: rsrvBlink 1.2s ease-in-out infinite; }
.gdd h2 { margin-top: 16px; }
.gdd h2 span { display: block; background: linear-gradient(90deg, #ff6a4d, #ff2d55); -webkit-background-clip: text; background-clip: text; color: transparent; }
.gdd__layers { display: grid; gap: 10px; margin: 24px 0 18px; }
.gdd__layer { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 14px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); transition: border-color .25s, background .25s, transform .25s; }
.gdd__layer:hover { transform: translateX(4px); border-color: rgba(255, 59, 59, .45); background: rgba(255, 59, 59, .06); }
.gdd__lnum { display: grid; place-items: center; flex-shrink: 0; width: 42px; height: 42px; border-radius: 12px; background: linear-gradient(135deg, #ff6a4d, #e0222f); color: #fff; font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 15px; box-shadow: 0 8px 20px rgba(255, 45, 45, .3); }
.gdd__layer b { display: block; font-size: 15px; color: #fff; }
.gdd__layer small { display: block; margin-top: 2px; font-size: 13px; color: #a9a6b5; }
.gdd__layer em { margin-left: auto; flex-shrink: 0; padding: 4px 10px; border-radius: 999px; background: rgba(34, 197, 94, .14); color: #4ade80; font-style: normal; font-size: 12px; font-weight: 700; }
.gdd__go { gap: 10px; margin-top: 22px; padding: 15px 28px; border-radius: 999px; background: linear-gradient(90deg, #ff6a4d, #e0222f); color: #fff; font-weight: 700; box-shadow: 0 14px 30px rgba(255, 45, 45, .3); }
.gdd__go svg { width: 18px; height: 18px; transition: transform .2s; }
.gdd__go:hover { transform: translateY(-2px); } .gdd__go:hover svg { transform: translateX(3px); }

.gdd .globe-wrap { position: relative; }
.gdd__feed { position: absolute; right: 0; bottom: 6%; z-index: 2; width: 250px; padding: 12px; border-radius: 16px; background: rgba(14, 12, 18, .82); border: 1px solid rgba(255,255,255,.1); backdrop-filter: blur(10px); box-shadow: 0 20px 40px rgba(0,0,0,.4); }
.gdd__feed-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.gdd__feed-head span { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 800; color: #fff; }
.gdd__feed-head i { width: 7px; height: 7px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 8px #22c55e; animation: rsrvBlink 1s ease-in-out infinite; }
.gdd__feed-head small { font-size: 10.5px; color: #8b8896; text-transform: uppercase; letter-spacing: .06em; }
.gdd__feed ul { list-style: none; display: grid; gap: 5px; margin: 0; padding: 0; }
.gdd__feed li { display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: auto auto; column-gap: 8px; align-items: center; padding: 7px 9px; border-radius: 10px; background: rgba(255,255,255,.04); animation: gddIn .45s ease; }
.gdd__feed li:first-child { background: rgba(255, 59, 59, .1); }
@keyframes gddIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.gdd__lv { grid-row: span 2; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: rgba(255, 59, 59, .18); color: #ff8a7a; font-size: 11px; font-weight: 800; }
.gdd__feed li b { font-size: 12.5px; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gdd__feed li small { grid-column: 2; font-size: 11px; color: #8b8896; }
.gdd__feed li em { grid-row: 1 / span 2; grid-column: 3; font-style: normal; font-size: 11px; font-weight: 700; color: #4ade80; white-space: nowrap; }
.gdd__cap { position: absolute; left: 0; top: 6%; z-index: 2; padding: 12px 16px; border-radius: 16px; background: rgba(14, 12, 18, .82); border: 1px solid rgba(255, 59, 59, .3); backdrop-filter: blur(10px); box-shadow: 0 20px 40px rgba(0,0,0,.4); animation: aFloat 6s ease-in-out infinite; }
.gdd__cap b { display: block; font-family: 'Outfit', sans-serif; font-size: 26px; line-height: 1; background: linear-gradient(90deg, #ff8a6b, #ff3b3b); -webkit-background-clip: text; background-clip: text; color: transparent; }
.gdd__cap small { font-size: 11.5px; color: #a9a6b5; }

@media (max-width: 640px) {
  .gdd__layer { padding: 10px 12px; gap: 10px; }
  .gdd__lnum { width: 36px; height: 36px; font-size: 13px; }
  .gdd__layer small { font-size: 12px; }
  .gdd__go { width: 100%; justify-content: center; }
  .gdd__feed { width: 210px; right: 0; bottom: 0; padding: 10px; }
  .gdd__feed li:nth-child(n+4) { display: none; }
  .gdd__cap { padding: 9px 12px; } .gdd__cap b { font-size: 20px; }
}
.gdd__feed { top: 4%; bottom: auto; }
.gdd__cap { top: auto; bottom: 14%; }
.gdd__feed li:nth-child(n+4) { display: none; }
@media (max-width: 640px) { .gdd__feed { width: 196px; top: 0; } .gdd__feed li:nth-child(n+3) { display: none; } .gdd__cap { bottom: 12%; } }
@media (min-width: 1001px) { .gdd__feed { right: 10%; } .gdd__cap { left: 4%; } }

/* =====================================================================
   v64 – Prima pagină: card animat Layer 7 (WAF filtrează cererile HTTP)
   ===================================================================== */
.l7 { margin: 0 0 18px; padding: 16px; border-radius: 18px; background: linear-gradient(160deg, rgba(255, 59, 59, .08), rgba(255,255,255,.03)); border: 1px solid rgba(255, 59, 59, .25); }
.l7__head { display: flex; align-items: center; gap: 12px; }
.l7__badge { display: grid; place-items: center; flex-shrink: 0; width: 42px; height: 42px; border-radius: 12px; background: linear-gradient(135deg, #ff6a4d, #e0222f); color: #fff; font-family: 'Outfit', sans-serif; font-weight: 800; box-shadow: 0 8px 20px rgba(255, 45, 45, .35); animation: l7Glow 2s ease-in-out infinite; }
@keyframes l7Glow { 0%, 100% { box-shadow: 0 8px 20px rgba(255, 45, 45, .3); } 50% { box-shadow: 0 8px 30px rgba(255, 45, 45, .7); } }
.l7__head b { display: block; font-size: 15px; color: #fff; }
.l7__head small { font-size: 12.5px; color: #a9a6b5; }
.l7__live { display: inline-flex; align-items: center; gap: 5px; margin-left: auto; padding: 4px 9px; border-radius: 999px; background: #ff2d55; color: #fff; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; }
.l7__live i { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: rsrvBlink 1s ease-in-out infinite; }

.l7__lane { position: relative; height: 130px; margin-top: 14px; border-radius: 14px; overflow: hidden; background:
  linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 24px 24px,
  linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 24px 24px, rgba(10, 8, 14, .6); border: 1px solid rgba(255,255,255,.07); }
.l7__node { position: absolute; top: 50%; translate: 0 -50%; z-index: 2; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; }
.l7__node svg { width: 22px; height: 22px; }
.l7__node--web { left: 10px; background: rgba(63, 182, 255, .14); color: #6cc4ff; }
.l7__node--srv { right: 10px; background: rgba(34, 197, 94, .14); color: #4ade80; }
.l7__gate { position: absolute; left: 50%; top: 0; bottom: 0; z-index: 2; translate: -50% 0; display: grid; place-items: center; align-content: center; gap: 2px; width: 46px; background: linear-gradient(90deg, transparent, rgba(255, 59, 59, .22), transparent); color: #ff8a7a; }
.l7__gate::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; translate: -50% 0; background: repeating-linear-gradient(180deg, #ff3b3b 0 6px, transparent 6px 12px); animation: l7Scan 1s linear infinite; opacity: .8; }
@keyframes l7Scan { to { background-position: 0 12px; } }
.l7__gate svg { position: relative; width: 26px; height: 26px; padding: 4px; border-radius: 9px; background: #1a1016; filter: drop-shadow(0 0 8px rgba(255, 59, 59, .7)); }
.l7__gate em { position: relative; padding: 1px 5px; border-radius: 4px; background: #1a1016; font-style: normal; font-size: 9.5px; font-weight: 800; letter-spacing: .06em; }

.l7__req { position: absolute; left: 56px; z-index: 1; translate: 0 -50%; padding: 3px 8px; border-radius: 6px; font-family: ui-monospace, 'SFMono-Regular', Menlo, monospace; font-size: 10.5px; font-weight: 700; white-space: nowrap; pointer-events: none; }
.l7__req--ok { background: rgba(34, 197, 94, .16); border: 1px solid rgba(34, 197, 94, .45); color: #86efac; animation: l7Pass 2.6s linear forwards; }
.l7__req--bot { background: rgba(255, 59, 59, .16); border: 1px solid rgba(255, 59, 59, .5); color: #ffaaa0; animation: l7Block 1.5s ease-in forwards; }
@keyframes l7Pass { 0% { left: 56px; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { left: calc(100% - 120px); opacity: 0; } }
@keyframes l7Block { 0% { left: 56px; opacity: 0; } 10% { opacity: 1; } 80% { left: calc(50% - 90px); transform: none; opacity: 1; } 88% { transform: translateX(-6px); } 100% { left: calc(50% - 96px); transform: scale(.6); opacity: 0; } }
.l7__tag { position: absolute; z-index: 3; translate: 0 -50%; padding: 2px 7px; border-radius: 6px; font-size: 10px; font-weight: 800; pointer-events: none; animation: l7Tag .9s ease-out forwards; }
.l7__tag--bad { left: calc(50% - 64px); background: #ff2d55; color: #fff; }
.l7__tag--ok { right: 56px; background: #22c55e; color: #fff; }
@keyframes l7Tag { 0% { opacity: 0; transform: translateY(4px) scale(.8); } 20% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(-12px); } }

.l7__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.l7__stats > div { padding: 9px 10px; border-radius: 12px; background: rgba(255,255,255,.04); text-align: center; }
.l7__stats b { display: block; font-family: 'Outfit', sans-serif; font-size: 19px; color: #fff; }
.l7__stats > div:nth-child(1) b { color: #4ade80; }
.l7__stats > div:nth-child(2) b { color: #ff6a5a; }
.l7__stats small { font-size: 11px; color: #a9a6b5; }
.l7__note { margin-top: 8px; font-size: 10.5px; color: #77737f; text-align: right; text-transform: uppercase; letter-spacing: .06em; }

@media (max-width: 640px) {
  .l7 { padding: 12px; }
  .l7__head small { display: none; }
  .l7__lane { height: 120px; }
  .l7__node { width: 34px; height: 34px; }
  .l7__req { left: 46px; font-size: 9.5px; padding: 2px 6px; }
  @keyframes l7Pass { 0% { left: 46px; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { left: calc(100% - 100px); opacity: 0; } }
  @keyframes l7Block { 0% { left: 46px; opacity: 0; } 10% { opacity: 1; } 80% { left: calc(50% - 80px); opacity: 1; } 100% { left: calc(50% - 86px); transform: scale(.6); opacity: 0; } }
  .l7__tag--bad { left: calc(50% - 56px); }
  .l7__stats b { font-size: 16px; }
  .l7__stats small { font-size: 10px; }
}

/* =====================================================================
   v65 – Prima pagină: secțiunea glob + Anti-DDoS aranjată compact
   (text + niveluri | glob, apoi rândul Layer 7 + card Anti-DDoS)
   ===================================================================== */
.gdd { padding: 90px 0; }
.gdd .globe-section__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.gdd .globe-wrap { width: 100%; max-width: 540px; margin: 0 auto; justify-self: center; }
.gdd__layers { margin: 22px 0 0; }
.gdd__go { margin-top: 24px; }
.gdd__bottom { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 24px; align-items: stretch; margin-top: 40px; }
.gdd__bottom .l7 { margin: 0; }
.gdd__bottom .ddos-card { margin: 0; height: 100%; }
@media (min-width: 1001px) { .gdd__feed { right: -4%; } .gdd__cap { left: -4%; } }
@media (max-width: 1000px) {
  .gdd .globe-section__inner { grid-template-columns: 1fr; gap: 30px; }
  .gdd .globe-wrap { max-width: 480px; }
  .gdd__bottom { grid-template-columns: 1fr; margin-top: 30px; }
}
@media (max-width: 640px) { .gdd { padding: 60px 0; } }
.gdd__bottom .ddos-card { max-width: none; display: flex; flex-direction: column; justify-content: center; }

/* =====================================================================
   v66 – „Mitigare live”: mutat jos (la nivelul cardului 12 Tbps) + design colorat
   ===================================================================== */
.gdd .gdd__feed { top: auto; bottom: 12%; width: 260px; padding: 14px; border-radius: 18px; border: 1px solid transparent; user-select: none;
  background: linear-gradient(160deg, rgba(36, 18, 40, .92), rgba(18, 10, 22, .94)) padding-box,
              linear-gradient(135deg, #ff6a4d, #ff2d6f 45%, #7b5cff) border-box;
  box-shadow: 0 24px 50px rgba(0,0,0,.5), 0 0 40px rgba(255, 45, 111, .18); }
.gdd .gdd__cap { bottom: 12%; top: auto; }
@media (min-width: 1001px) { .gdd .gdd__feed { right: -6%; } .gdd .gdd__cap { left: -4%; } }
.gdd__feed-head { padding-bottom: 8px; margin-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,.08); }
.gdd__feed-head span { font-size: 13px; background: linear-gradient(90deg, #fff, #ffc7d6); -webkit-background-clip: text; background-clip: text; color: transparent; }
.gdd__feed-head i { flex-shrink: 0; }
.gdd__feed-head small { padding: 3px 8px; border-radius: 999px; background: rgba(123, 92, 255, .18); color: #c4b5ff; font-weight: 700; letter-spacing: .08em; }
.gdd__feed li { padding: 8px 10px; border-radius: 12px; background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.06); }
.gdd__feed li:first-child { background: linear-gradient(90deg, rgba(255, 45, 111, .2), rgba(255, 106, 77, .08)); border-color: rgba(255, 45, 111, .35); }
.gdd__lv { width: 30px; height: 30px; border-radius: 9px; color: #fff; font-size: 11px; }
.gdd__lv--l3 { background: linear-gradient(135deg, #3fb6ff, #2563eb); box-shadow: 0 4px 12px rgba(37, 99, 235, .45); }
.gdd__lv--l4 { background: linear-gradient(135deg, #a78bfa, #7b5cff); box-shadow: 0 4px 12px rgba(123, 92, 255, .45); }
.gdd__lv--l7 { background: linear-gradient(135deg, #ff6a4d, #ff2d6f); box-shadow: 0 4px 12px rgba(255, 45, 111, .45); }
.gdd__feed li b { font-size: 13px; }
.gdd__feed li small { color: #a9a3b8; }
.gdd__feed li em { padding: 3px 8px; border-radius: 999px; background: rgba(34, 197, 94, .16); border: 1px solid rgba(34, 197, 94, .35); color: #4ade80; font-size: 10.5px; }
@media (max-width: 640px) { .gdd .gdd__feed { width: 205px; padding: 10px; bottom: 14%; right: 0; } .gdd .gdd__cap { bottom: 30%; left: 0; } }
.gdd .gdd__feed { bottom: 17%; } .gdd .gdd__cap { bottom: 17%; } @media (max-width: 640px) { .gdd .gdd__feed { bottom: 15%; } .gdd .gdd__cap { bottom: 30%; } }
@media (max-width: 640px) { .gdd__feed li em span { display: none; } .gdd__feed li em { padding: 3px 7px; } .gdd .gdd__feed { width: 196px; } }

/* v67 – „Mitigare live” compact: un singur rând, în colțul din dreapta-sus (în afara globului) */
.gdd .gdd__feed { top: 0; bottom: auto; right: 0; width: 214px; padding: 9px 10px; border-radius: 14px; }
@media (min-width: 1001px) { .gdd .gdd__feed { right: -2%; } }
.gdd .gdd__feed-head { padding-bottom: 6px; margin-bottom: 6px; }
.gdd .gdd__feed-head span { font-size: 11.5px; }
.gdd .gdd__feed-head small { padding: 2px 6px; font-size: 9px; }
.gdd .gdd__feed li:nth-child(n+2) { display: none; }
.gdd .gdd__feed li { padding: 6px 8px; column-gap: 7px; }
.gdd .gdd__lv { width: 24px; height: 24px; border-radius: 7px; font-size: 9.5px; }
.gdd .gdd__feed li b { font-size: 11.5px; }
.gdd .gdd__feed li small { font-size: 10px; }
.gdd .gdd__feed li em { padding: 2px 6px; font-size: 9.5px; }
.gdd .gdd__cap { bottom: 8%; }
@media (max-width: 640px) { .gdd .gdd__feed { width: 178px; top: 0; bottom: auto; padding: 8px; } .gdd .gdd__cap { bottom: 12%; } }

/* =====================================================================
   v68 – Prima pagină: hero cu rachetă animată + scut Anti-DDoS
   ===================================================================== */
.hrk { position: relative; width: 100%; max-width: 600px; aspect-ratio: 600 / 540; margin-left: auto; }
.hrk::before { display: none; }
.hrk__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.hrk__leaves path { transform-box: fill-box; transform-origin: bottom center; animation: hrkLeaf 6s ease-in-out infinite; }
.hrk__leaves path:nth-child(2) { animation-delay: -2s; } .hrk__leaves path:nth-child(3) { animation-delay: -4s; }
@keyframes hrkLeaf { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(4deg); } }
.hrk__line { stroke-dasharray: 520; stroke-dashoffset: 520; animation: hrkLine 4s ease-out infinite; }
@keyframes hrkLine { 0% { stroke-dashoffset: 520; } 55%, 100% { stroke-dashoffset: 0; } }

.hrk__rocketWrap { animation: hrkFloat 4s ease-in-out infinite; }
@keyframes hrkFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
.hrk__flame { transform-box: fill-box; transform-origin: top center; animation: hrkFlame .18s ease-in-out infinite alternate; }
@keyframes hrkFlame { from { transform: scaleY(.85) scaleX(.95); } to { transform: scaleY(1.15) scaleX(1.05); } }
.hrk__field { transform-box: fill-box; transform-origin: center; animation: hrkField 2.6s ease-in-out infinite; }
@keyframes hrkField { 0%, 100% { opacity: .7; transform: scale(1); } 50% { opacity: 1; transform: scale(1.03); } }
.hrk__ring { transform-box: fill-box; transform-origin: center; animation: hrkSpin 14s linear infinite; }
@keyframes hrkSpin { to { transform: rotate(360deg); } }
.hrk__shield { animation: hrkGlow 2s ease-in-out infinite; }
@keyframes hrkGlow { 0%, 100% { filter: drop-shadow(0 0 2px #4ade80); } 50% { filter: drop-shadow(0 0 8px #4ade80); } }

/* atacuri: linie roșie care vine spre scut, apoi impact verde */
.hrk__atk { stroke-dasharray: 26 400; stroke-dashoffset: 26; opacity: 0; animation: hrkAtk 3.2s linear infinite; }
.hrk__atk--2 { animation-delay: .8s; } .hrk__atk--3 { animation-delay: 1.6s; } .hrk__atk--4 { animation-delay: 2.4s; }
@keyframes hrkAtk { 0% { stroke-dashoffset: 26; opacity: 0; } 5% { opacity: 1; } 30% { stroke-dashoffset: -110; opacity: 1; } 34%, 100% { stroke-dashoffset: -150; opacity: 0; } }
.hrk__hit { fill: none; stroke: #4ade80; stroke-width: 3; opacity: 0; transform-box: fill-box; transform-origin: center; animation: hrkHit 3.2s ease-out infinite; }
.hrk__hit--2 { animation-delay: .8s; } .hrk__hit--3 { animation-delay: 1.6s; } .hrk__hit--4 { animation-delay: 2.4s; }
@keyframes hrkHit { 0%, 29% { opacity: 0; transform: scale(.4); } 31% { opacity: 1; transform: scale(1); } 48% { opacity: 0; transform: scale(3); } 100% { opacity: 0; } }

.hrk__gear--1 > * { transform-origin: 0 0; animation: hrkSpin 8s linear infinite; }
.hrk__gear--2 > * { transform-origin: 0 0; animation: hrkSpin 5s linear infinite reverse; }

/* ferestre plutitoare */
.hrk__card { position: absolute; z-index: 2; border-radius: 12px; background: #fff; box-shadow: 0 18px 40px rgba(0,0,0,.35); animation: aFloat 6s ease-in-out infinite; }
.hrk__card > i { position: absolute; top: 8px; width: 6px; height: 6px; border-radius: 50%; background: #d9d6e2; }
.hrk__card > i:nth-child(1) { left: 10px; } .hrk__card > i:nth-child(2) { left: 20px; } .hrk__card > i:nth-child(3) { left: 30px; }
.hrk__card > b { position: absolute; right: 12px; height: 6px; border-radius: 3px; background: #e3def0; }
.hrk__card--video { left: 2%; top: 8%; width: 30%; aspect-ratio: 1.55; }
.hrk__card--video > b { top: 44%; width: 44%; } .hrk__card--video > b.s { top: 60%; width: 32%; }
.hrk__play { position: absolute; left: 12%; top: 38%; width: 22%; aspect-ratio: 1; border-radius: 50%; background: linear-gradient(135deg, #ff6a3d, #e2361f); }
.hrk__play::after { content: ''; position: absolute; left: 40%; top: 30%; border-left: 10px solid #fff; border-top: 7px solid transparent; border-bottom: 7px solid transparent; }
.hrk__card--cart { left: 0; top: 42%; width: 28%; aspect-ratio: 1.6; animation-delay: -2s; }
.hrk__card--cart > b { top: 46%; width: 40%; } .hrk__card--cart > b.s { top: 62%; width: 30%; }
.hrk__cartico { position: absolute; left: 10%; top: 34%; width: 26%; color: #7b5cff; }
.hrk__cartico svg { width: 100%; height: auto; }
.hrk__card--ddos { right: 0; top: 34%; display: flex; align-items: center; gap: 10px; padding: 10px 14px 10px 10px; animation-delay: -3s; }
.hrk__ok { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: #dcfce7; color: #16a34a; }
.hrk__ok svg { width: 22px; height: 22px; }
.hrk__card--ddos strong { display: block; font-size: 14px; color: #15121c; white-space: nowrap; }
.hrk__card--ddos small { font-size: 11.5px; color: #6c6a75; white-space: nowrap; }
.hrk__card--up { right: 4%; bottom: 14%; padding: 10px 16px; background: rgba(20, 16, 28, .92); border: 1px solid rgba(74, 222, 128, .35); animation-delay: -4.5s; }
.hrk__card--up small { display: block; font-size: 11px; color: #a9a6b5; }
.hrk__card--up strong { font-family: 'Outfit', sans-serif; font-size: 26px; color: #fff; line-height: 1.1; }
.hrk__card--up em { margin-left: 2px; font-style: normal; font-size: 16px; color: #22c55e; }

@media (max-width: 1000px) { .hrk { margin: 0 auto; } }
@media (max-width: 640px) {
  .hrk__card--ddos { padding: 7px 10px 7px 7px; gap: 7px; }
  .hrk__ok { width: 28px; height: 28px; } .hrk__ok svg { width: 17px; height: 17px; }
  .hrk__card--ddos strong { font-size: 11.5px; } .hrk__card--ddos small { font-size: 9.5px; }
  .hrk__card--up { padding: 7px 11px; } .hrk__card--up strong { font-size: 19px; } .hrk__card--up small { font-size: 9.5px; }
  .hrk__play::after { border-left-width: 7px; border-top-width: 5px; border-bottom-width: 5px; }
}
@media (prefers-reduced-motion: reduce) { .hrk *, .hrk__svg * { animation: none !important; } .hrk__line { stroke-dashoffset: 0; } }

/* =====================================================================
   v69 – VPS: „Toate pachetele includ” și tabelele în lățimea normală a paginii;
   butonul „Comandă” nu mai iese din rând (preț deasupra, buton dedesubt)
   ===================================================================== */
@media (min-width: 1201px) {
  .vinc__grid { width: auto; margin-left: 0; }
  .plans--rows { width: auto; margin-left: 0; }
  .vrow__cell { padding: 16px 12px; }
  .vrow__name { gap: 14px; padding: 18px 16px; }
  .vrow__name h3 { font-size: 17px; }
  .vrow__buy { flex-direction: column; align-items: stretch; justify-content: center; gap: 10px; padding: 14px 16px; text-align: center; }
  .vrow__price { justify-content: center; }
  .vrow__price b { font-size: 28px; }
  .vrow__btn { width: 100%; padding: 12px 16px; text-align: center; }
}
.vrow__buy { min-width: 0; }
.vrow__btn { max-width: 100%; }

/* =====================================================================
   v70 – Pagina Servere dedicate: hero mov + rack animat
   ===================================================================== */
.dsh { position: relative; overflow: hidden; padding: 170px 0 100px; color: #fff; background: linear-gradient(100deg, #1e1a2c 0%, #2a1c3c 45%, #3d1d45 75%, #461c3c 100%); }
.dsh__inner { position: relative; display: grid; grid-template-columns: 1.05fr 1fr; gap: 50px; align-items: center; }
.dsh h1 { margin-top: 20px; font-size: clamp(44px, 5.6vw, 84px); line-height: 1.02; letter-spacing: -.02em; }
.dsh h1 span { display: block; font-family: 'Inter', sans-serif; font-weight: 200; background: linear-gradient(90deg, #ff9a6b, #ff4f8b); -webkit-background-clip: text; background-clip: text; color: transparent; }
.dsh__lead { margin-top: 20px; max-width: 580px; font-size: clamp(16px, 1.4vw, 19px); line-height: 1.65; color: #e4ddf0; font-weight: 300; }
.dsh__btns { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; }
.dsh__go { gap: 10px; padding: 16px 28px; border-radius: 999px; background: linear-gradient(90deg, #ff7a4d, #ff2d6f); color: #fff; font-weight: 700; box-shadow: 0 14px 30px rgba(255, 45, 111, .35); }
.dsh__go svg { width: 18px; height: 18px; transition: transform .2s; }
.dsh__go:hover { transform: translateY(-2px); } .dsh__go:hover svg { transform: translateX(3px); }
.dsh__try { padding: 16px 28px; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.7); color: #fff; font-weight: 700; }
.dsh__try:hover { background: #fff; color: #2a1c3c; }

.dsh__art { position: relative; width: 100%; max-width: 540px; aspect-ratio: 540 / 500; margin-left: auto; }
.dsh__glow { position: absolute; left: 50%; top: 50%; width: 82%; aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; background: radial-gradient(circle, rgba(255, 79, 139, .3), transparent 65%); animation: iphPulse 4s ease-in-out infinite; }
.dsh__rack { position: absolute; left: 50%; top: 4%; bottom: 2%; width: 52%; translate: -50% 0; display: flex; flex-direction: column; gap: 7px; padding: 12px 12px 0; border-radius: 14px 14px 6px 6px; background: linear-gradient(180deg, #2b2638, #15121c); border: 2px solid #463d5c; box-shadow: 0 40px 80px rgba(0,0,0,.55), inset 0 0 0 1px rgba(255,255,255,.04); }
.dsh__rack-top { display: flex; align-items: center; justify-content: space-between; padding: 0 4px 4px; font-size: 10px; font-weight: 800; letter-spacing: .14em; color: #8f86a8; }
.dsh__rack-top i { width: 7px; height: 7px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 8px #22c55e; animation: rsrvBlink 1.2s ease-in-out infinite; }
.dsh__unit { position: relative; display: flex; align-items: center; gap: 10px; flex: 1; min-height: 0; padding: 0 10px; border-radius: 6px; background: linear-gradient(180deg, #24202f, #1b1824); border: 1px solid #3a3350; }
.dsh__unit--hl { border-color: #ff5a8a; background: linear-gradient(90deg, rgba(255, 79, 139, .22), #1f1a2a 60%); box-shadow: 0 0 24px rgba(255, 79, 139, .35); animation: dshHl 3s ease-in-out infinite; }
@keyframes dshHl { 0%, 100% { box-shadow: 0 0 16px rgba(255, 79, 139, .25); } 50% { box-shadow: 0 0 30px rgba(255, 79, 139, .55); } }
.dsh__logo { display: grid; place-items: center; width: 30px; height: 22px; border-radius: 5px; background: linear-gradient(135deg, #ff7a4d, #ff2d6f); font-family: 'Outfit', sans-serif; font-size: 11px; font-weight: 800; }
.dsh__fan { width: 22px; height: 22px; border-radius: 50%; border: 2px solid #4b4363; background: conic-gradient(#5b5275 0 25%, transparent 0 50%, #5b5275 0 75%, transparent 0); animation: dshFan .6s linear infinite; }
@keyframes dshFan { to { transform: rotate(360deg); } }
.dsh__bays { display: flex; gap: 4px; flex: 1; }
.dsh__bays i { flex: 1; max-width: 22px; height: 14px; border-radius: 3px; background: repeating-linear-gradient(90deg, #2f2a40 0 2px, #3a3350 2px 4px); border: 1px solid #4b4363; }
.dsh__ports { display: flex; gap: 3px; flex: 1; }
.dsh__ports i { width: 9px; height: 8px; border-radius: 2px; background: #0f0d14; border: 1px solid #4b4363; box-shadow: inset 0 -2px 0 #3fb6ff; animation: rsrvBlink 1.4s ease-in-out infinite; }
.dsh__ports i:nth-child(odd) { animation-delay: .5s; box-shadow: inset 0 -2px 0 #22c55e; }
.dsh__leds { display: flex; gap: 4px; margin-left: auto; }
.dsh__leds b { width: 6px; height: 6px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 6px #22c55e; animation: rsrvBlink 1.1s ease-in-out infinite; }
.dsh__leds b:nth-child(2) { background: #3fb6ff; box-shadow: 0 0 6px #3fb6ff; animation-delay: .35s; }
.dsh__leds b:nth-child(3) { animation-delay: .7s; animation-duration: .7s; }
.dsh__unit:nth-child(3) .dsh__leds b { animation-delay: .2s; } .dsh__unit:nth-child(4) .dsh__leds b { animation-delay: .5s; }
.dsh__tag { position: absolute; right: -10px; top: -9px; padding: 3px 8px; border-radius: 999px; background: #ff2d6f; font-size: 9px; font-weight: 800; letter-spacing: .08em; box-shadow: 0 6px 14px rgba(255, 45, 111, .45); }
.dsh__rack-feet { display: flex; justify-content: space-between; padding: 6px 6px 0; }
.dsh__rack-feet i { width: 18px; height: 6px; border-radius: 0 0 4px 4px; background: #463d5c; }

.dsh__card { position: absolute; z-index: 2; display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 14px; background: rgba(255,255,255,.96); color: #15121c; box-shadow: 0 16px 34px rgba(0,0,0,.35); animation: aFloat 6s ease-in-out infinite; }
.dsh__card b { display: block; font-size: 13.5px; white-space: nowrap; }
.dsh__card small { font-size: 11px; color: #6c6a75; white-space: nowrap; }
.dsh__ico { display: grid; place-items: center; flex-shrink: 0; width: 34px; height: 34px; border-radius: 10px; }
.dsh__ico svg { width: 19px; height: 19px; }
.dsh__ico--cpu { background: #efe9ff; color: #6d4cff; }
.dsh__ico--ram { background: #e0ecff; color: #1d6ff2; }
.dsh__ico--net { background: #fff1e8; color: #ff5a1f; }
.dsh__ico--ddos { background: #dcfce7; color: #16a34a; }
.dsh__card--cpu { left: 0; top: 6%; display: block; padding: 12px 14px; animation-delay: -1s; }
.dsh__card-h { display: flex; align-items: center; gap: 10px; }
.dsh__bars { display: flex; align-items: flex-end; gap: 4px; height: 34px; margin-top: 10px; }
.dsh__bars i { flex: 1; height: var(--h); border-radius: 3px 3px 0 0; background: linear-gradient(180deg, #8b6bff, #5b3df5); animation: dshBar 1.6s ease-in-out infinite alternate; }
.dsh__bars i:nth-child(2n) { animation-delay: -.6s; } .dsh__bars i:nth-child(3n) { animation-delay: -1.1s; }
@keyframes dshBar { from { transform: scaleY(.45); transform-origin: bottom; } to { transform: scaleY(1); transform-origin: bottom; } }
.dsh__card--ram { right: 0; top: 18%; animation-delay: -2.5s; }
.dsh__card--net { left: 2%; bottom: 14%; animation-delay: -4s; }
.dsh__card--ddos { right: 2%; bottom: 6%; animation-delay: -3s; }

/* Pentru cine */
.dsu { padding: 90px 0; background: #f7f5fc; color: #15121c; }
.dsu .section-head h2 { color: #15121c; }
.dsu .section-head p { color: #4a4756; }
.dsu__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; margin-top: 10px; }
.dsu__card { padding: 28px 24px; border-radius: 18px; background: #fff; box-shadow: 0 14px 36px rgba(30, 20, 60, .07); transition: transform .25s, box-shadow .25s; }
.dsu__card:hover { transform: translateY(-6px); box-shadow: 0 24px 50px rgba(30, 20, 60, .13); }
.dsu__emoji { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px; background: linear-gradient(135deg, #fff1ea, #ffe4ef); font-size: 26px; }
.dsu__card h3 { margin-top: 18px; font-size: 19px; color: #15121c; }
.dsu__card p { margin-top: 8px; font-size: 15px; line-height: 1.6; color: #5a5866; }

@media (max-width: 1000px) {
  .dsh__inner { grid-template-columns: 1fr; }
  .dsh__art { margin: 10px auto 0; }
  .dsu__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .dsh { padding: 120px 0 70px; }
  .dsh__btns .btn { flex: 1; justify-content: center; padding: 15px 18px; }
  .dsh__rack { width: 58%; padding: 9px 9px 0; gap: 5px; }
  .dsh__unit { gap: 6px; padding: 0 7px; }
  .dsh__bays i { height: 10px; }
  .dsh__card { padding: 7px 10px; gap: 7px; }
  .dsh__card b { font-size: 11.5px; } .dsh__card small { font-size: 9.5px; }
  .dsh__ico { width: 28px; height: 28px; } .dsh__ico svg { width: 15px; height: 15px; }
  .dsh__bars { height: 24px; }
  .dsu { padding: 60px 0; }
  .dsu__grid { grid-template-columns: 1fr; gap: 14px; }
}
.dsh__rack { top: 20%; bottom: 0; left: 54%; } .dsh__card--cpu { top: 0; left: 0; } .dsh__card--ram { top: 8%; } @media (max-width: 640px) { .dsh__rack { top: 24%; left: 52%; } }

/* =====================================================================
   v71 – Servere dedicate „în stoc”: filtre + listă (livrare instant)
   ===================================================================== */
.stk { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 28px; align-items: start; text-align: left; }
.stk__filters { position: sticky; top: 100px; display: grid; gap: 18px; padding: 20px; border-radius: 18px; background: #fff; border: 1px solid #ebe6f6; box-shadow: 0 14px 36px rgba(30, 20, 60, .06); color: #15121c; }
.stk__fhead { display: flex; align-items: center; justify-content: space-between; }
.stk__fhead b { font-family: 'Outfit', sans-serif; font-size: 18px; }
.stk__reset { padding: 6px 12px; border-radius: 999px; border: 1px solid #ebe6f6; background: #faf9fd; color: #6c6a75; font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; }
.stk__reset:hover { border-color: #ff7a8f; color: #c0265f; }
.stk__search { display: flex; align-items: center; gap: 8px; padding: 0 12px; border-radius: 12px; border: 1px solid #e3ddf0; background: #faf9fd; }
.stk__search:focus-within { border-color: #ff7a8f; background: #fff; }
.stk__search svg { width: 17px; height: 17px; flex-shrink: 0; color: #8a86a0; }
.stk__search input { flex: 1; min-width: 0; padding: 11px 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 14px; color: #15121c; }
.stk__group { display: grid; gap: 8px; }
.stk__group > small { font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #8a86a0; }
.stk__chk { display: flex; align-items: center; gap: 10px; font-size: 14.5px; color: #2f2b38; cursor: pointer; }
.stk__chk input { position: absolute; opacity: 0; pointer-events: none; }
.stk__chk span { position: relative; flex-shrink: 0; width: 36px; height: 20px; border-radius: 999px; background: #e3ddf0; transition: background .2s; }
.stk__chk span::after { content: ''; position: absolute; left: 3px; top: 3px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: left .2s; }
.stk__chk input:checked + span { background: linear-gradient(90deg, #ff7a4d, #ff2d6f); }
.stk__chk input:checked + span::after { left: 19px; }
.stk__chk input:focus-visible + span { outline: 2px solid #ff7a8f; outline-offset: 2px; }
.stk__chk em { margin-left: auto; padding: 1px 8px; border-radius: 999px; background: #f3eefe; color: #5b3df5; font-style: normal; font-size: 11.5px; font-weight: 700; }
.stk__pills { display: flex; gap: 6px; }
.stk__pill { flex: 1; padding: 8px 6px; border-radius: 10px; border: 1px solid #e3ddf0; background: #faf9fd; color: #3d3a48; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; transition: all .2s; }
.stk__pill:hover { border-color: #ff7a8f; }
.stk__pill.is-on { background: linear-gradient(90deg, #ff7a4d, #ff2d6f); border-color: transparent; color: #fff; }
.stk__range { display: grid; gap: 4px; }
.stk__range span { font-size: 13px; color: #6c6a75; }
.stk__range b { color: #15121c; }
.stk__range input { width: 100%; accent-color: #ff2d6f; }

.stk__bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; color: #3d3a48; font-size: 14.5px; }
.stk__bar > span { display: inline-flex; align-items: center; gap: 8px; }
.stk__bar > span i { width: 9px; height: 9px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 4px rgba(34, 197, 94, .18); animation: rsrvBlink 1.4s ease-in-out infinite; }
.stk__bar b { color: #15121c; }
.stk__bar select { margin-left: 6px; padding: 8px 12px; border-radius: 10px; border: 1px solid #e3ddf0; background: #fff; font: inherit; font-size: 14px; color: #15121c; }
.stk__list { display: grid; gap: 16px; }
.stk__item { display: grid; grid-template-columns: 150px minmax(0, 1fr) 230px; align-items: stretch; border-radius: 18px; background: #fff; border: 1px solid #ebe6f6; box-shadow: 0 12px 30px rgba(30, 20, 60, .06); overflow: hidden; transition: transform .25s, box-shadow .25s, border-color .25s; animation: fadeUp .4s both; }
.stk__item:hover { transform: translateY(-4px); border-color: #ff9ab2; box-shadow: 0 22px 48px rgba(255, 45, 111, .14); }
.stk__cpu { display: grid; justify-items: center; align-content: center; gap: 12px; padding: 18px 12px; background: linear-gradient(180deg, #faf8ff, #f3eefe); border-right: 1px solid #ebe6f6; }
.stk__logo { display: grid; justify-items: center; line-height: 1; }
.stk__logo b { font-family: 'Outfit', sans-serif; font-size: 24px; font-weight: 900; letter-spacing: .04em; }
.stk__logo small { margin-top: 3px; font-size: 11px; font-weight: 800; letter-spacing: .14em; }
.stk__logo--amd b { color: #15121c; } .stk__logo--amd small { color: #e2231a; }
.stk__logo--intel b { color: #0068b5; } .stk__logo--intel small { color: #0068b5; font-style: italic; letter-spacing: .02em; font-size: 13px; }
.stk__logo--other b { color: #5b3df5; }
.stk__bench { position: relative; display: grid; justify-items: center; width: 96px; }
.stk__gauge { width: 96px; height: auto; }
.stk__bench strong { margin-top: -22px; font-family: 'Outfit', sans-serif; font-size: 15px; color: #15121c; }
.stk__bench small { font-size: 10.5px; font-weight: 700; color: #6c6a75; }
.stk__info { padding: 20px 22px; min-width: 0; }
.stk__name { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.stk__name h3 { font-family: 'Outfit', sans-serif; font-size: 21px; color: #15121c; }
.stk__live { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: #dcfce7; color: #15803d; font-size: 12px; font-weight: 700; }
.stk__live i { width: 6px; height: 6px; border-radius: 50%; background: #22c55e; animation: rsrvBlink 1.2s ease-in-out infinite; }
.stk__specs { list-style: none; display: grid; gap: 7px; margin: 14px 0 0; padding: 0; }
.stk__specs li { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #5a5866; min-width: 0; }
.stk__specs li b { color: #15121c; font-weight: 600; overflow-wrap: anywhere; }
.stk__specs .icon { flex-shrink: 0; width: 17px; height: 17px; color: #ff5a3d; }
.stk__buy { display: flex; flex-direction: column; justify-content: center; align-items: stretch; gap: 8px; padding: 18px 20px; border-left: 1px dashed #ebe6f6; text-align: center; }
.stk__buy s { font-size: 13px; color: #9a97a8; }
.stk__price b { display: block; font-family: 'Outfit', sans-serif; font-size: 30px; line-height: 1; color: #15121c; }
.stk__price small { font-size: 12px; color: #6c6a75; }
.stk__perks { list-style: none; display: grid; gap: 2px; margin: 4px 0 0; padding: 0; font-size: 12.5px; color: #3d3a48; }
.stk__go { gap: 8px; justify-content: center; padding: 13px 16px; border-radius: 12px; background: linear-gradient(90deg, #ff7a4d, #ff2d6f); color: #fff; font-weight: 700; box-shadow: 0 10px 22px rgba(255, 45, 111, .28); }
.stk__go .icon { width: 17px; height: 17px; }
.stk__go:hover { transform: translateY(-2px); }
.stk__empty { padding: 50px 20px; border-radius: 18px; background: #fff; border: 1px dashed #e3ddf0; text-align: center; color: #5a5866; }
.stk__empty b { display: block; font-size: 18px; color: #15121c; }
.stk__empty a { color: #c0265f; font-weight: 700; }

@media (max-width: 1100px) {
  .stk__item { grid-template-columns: 130px minmax(0, 1fr); }
  .stk__buy { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; border-left: 0; border-top: 1px dashed #ebe6f6; text-align: left; }
  .stk__go { flex: 0 0 auto; }
}
@media (max-width: 900px) {
  .stk { grid-template-columns: 1fr; }
  .stk__filters { position: static; }
}
@media (max-width: 560px) {
  .stk__item { grid-template-columns: 1fr; }
  .stk__cpu { grid-auto-flow: column; justify-content: space-around; border-right: 0; border-bottom: 1px solid #ebe6f6; padding: 14px; }
  .stk__info { padding: 16px; }
  .stk__buy { flex-direction: column; align-items: stretch; text-align: center; }
  .stk__bar { font-size: 13.5px; }
}

/* =====================================================================
   v72 – Stoc instant: logo procesor (badge) + stoc limitat / epuizat
   ===================================================================== */
.cpub { position: relative; display: grid; align-content: center; width: 104px; height: 104px; padding: 12px 12px 10px 16px; border-radius: 14px; overflow: hidden; color: #fff; text-align: left; box-shadow: 0 10px 22px rgba(20, 10, 40, .25), inset 0 1px 0 rgba(255,255,255,.15); }
.cpub::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; }
.cpub::after { content: ''; position: absolute; right: -30px; top: -30px; width: 90px; height: 90px; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.18), transparent 70%); }
.cpub__maker { display: flex; align-items: center; gap: 3px; font-family: 'Outfit', 'Inter', sans-serif; font-size: 12px; font-weight: 900; letter-spacing: .02em; line-height: 1; }
.cpub__maker i { width: 9px; height: 9px; border-top: 3px solid currentColor; border-right: 3px solid currentColor; }
.cpub b { margin-top: 8px; font-family: 'Outfit', 'Inter', sans-serif; font-size: 21px; font-weight: 800; letter-spacing: .06em; line-height: 1; }
.cpub em { position: absolute; right: 9px; bottom: 6px; font-family: 'Outfit', sans-serif; font-style: normal; font-size: 30px; font-weight: 900; line-height: 1; }
.cpub--ryzen { background: linear-gradient(150deg, #2c2c2c, #0b0b0b 70%); }
.cpub--ryzen::before { background: linear-gradient(180deg, #ff9a3d, #e2231a); }
.cpub--ryzen em { background: linear-gradient(180deg, #ffb35c, #ff5a1f); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cpub--epyc { background: linear-gradient(150deg, #3a3a40, #121216 70%); }
.cpub--epyc::before { background: linear-gradient(180deg, #e8e8ee, #8f8f99); }
.cpub--epyc b { letter-spacing: .12em; }
.cpub--xeon { background: linear-gradient(150deg, #1679e0, #06357a 75%); }
.cpub--xeon::before { background: linear-gradient(180deg, #7fd0ff, #00b7ff); }
.cpub--xeon .cpub__maker, .cpub--core .cpub__maker { font-family: 'Inter', sans-serif; font-style: italic; font-weight: 800; font-size: 14px; letter-spacing: -.02em; }
.cpub--core { background: linear-gradient(150deg, #0a6fd6, #3b1fb8 80%); }
.cpub--core::before { background: linear-gradient(180deg, #c084fc, #60a5fa); }
.cpub--core em { font-size: 24px; color: #fff; }
.cpub--other { background: linear-gradient(150deg, #5b3df5, #2a1c3c); }
.cpub__img { width: 104px; height: 104px; object-fit: contain; border-radius: 14px; background: #fff; padding: 8px; box-shadow: 0 10px 22px rgba(20, 10, 40, .12); }

.stk__live--limited { background: #fff1e0; color: #c2410c; }
.stk__live--limited i { background: #f97316; }
.stk__live--out { background: #fee2e2; color: #b91c1c; }
.stk__live--out i { background: #ef4444; animation: none; }
.stk__item--limited { border-color: #fed7aa; }
.stk__item--limited .stk__buy { background: linear-gradient(180deg, #fff7ed, #fff); }
.stk__hurry { font-weight: 800; color: #c2410c; animation: rsrvBlink 1.6s ease-in-out infinite; }
.stk__item--out { opacity: .72; }
.stk__item--out:hover { transform: none; border-color: #ebe6f6; box-shadow: 0 12px 30px rgba(30, 20, 60, .06); }
.stk__item--out .cpub, .stk__item--out .stk__gauge { filter: grayscale(1); }
.stk__item--out .stk__price b { color: #9a97a8; text-decoration: line-through; text-decoration-thickness: 2px; }
.stk__go--out { background: #e5e2ec; color: #8a86a0; box-shadow: none; cursor: not-allowed; }
.stk__go--out:hover { transform: none; }
.stk__notify { font-size: 12.5px; font-weight: 700; color: #c0265f; }
.stk__notify:hover { text-decoration: underline; }
@media (max-width: 560px) { .cpub, .cpub__img { width: 88px; height: 88px; } .cpub b { font-size: 18px; } .cpub em { font-size: 24px; } }

/* v73 – Stoc instant: locație + Anti-DDoS DATAFOREST pe fiecare server */
.stk__loc, .stk__ddos { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: #f3eefe; color: #3d3a48; font-size: 12px; font-weight: 700; }
.stk__ddos { background: #e8f9ef; color: #15803d; }
.stk__de { width: 16px; height: 11px; border-radius: 2px; background: linear-gradient(#000 0 33.3%, #dd0000 33.3% 66.6%, #ffce00 66.6%); box-shadow: 0 0 0 1px rgba(0,0,0,.08); }

/* =====================================================================
   v74 – Anunț sub lista de servere dedicate (se activează din panou)
   ===================================================================== */
.stkn { position: relative; display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 28px; align-items: center; margin-top: 36px; padding: 30px 34px; border-radius: 22px; overflow: hidden; color: #fff; text-align: left;
  background: radial-gradient(circle at 90% 10%, rgba(255, 79, 139, .35), transparent 45%), linear-gradient(110deg, #1e1a2c 0%, #2a1c3c 50%, #461c3c 100%);
  box-shadow: 0 30px 60px rgba(42, 28, 60, .3); border: 1px solid rgba(255,255,255,.08); }
.stkn::before { content: ''; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 40px 40px; }
.stkn__art { position: relative; display: grid; place-items: center; width: 150px; height: 150px; }
.stkn__ring { position: absolute; inset: 10px; border-radius: 50%; border: 2px dashed rgba(255, 154, 107, .55); animation: hrkSpin 14s linear infinite; }
.stkn__ring--2 { inset: 28px; border-style: solid; border-color: rgba(255, 79, 139, .35); animation: iphPulse 2.6s ease-in-out infinite; }
.stkn__ico { position: relative; display: grid; place-items: center; width: 74px; height: 74px; border-radius: 22px; background: linear-gradient(135deg, #ff7a4d, #ff2d6f); box-shadow: 0 16px 34px rgba(255, 45, 111, .45); animation: aFloat 4s ease-in-out infinite; }
.stkn__ico svg { width: 38px; height: 38px; }
.stkn__clock { position: absolute; right: -10px; bottom: -10px; width: 32px; height: 32px; border-radius: 50%; background: #fff; box-shadow: 0 6px 14px rgba(0,0,0,.3); }
.stkn__clock::before, .stkn__clock::after { content: ''; position: absolute; left: 50%; top: 50%; width: 2px; border-radius: 2px; background: #2a1c3c; transform-origin: 50% 0; }
.stkn__clock::before { height: 10px; transform: rotate(180deg); animation: hrkSpin 3s linear infinite; }
.stkn__clock::after { height: 7px; transform: rotate(90deg); background: #ff2d6f; }
.stkn__body { position: relative; }
.stkn__tag { display: inline-flex; align-items: center; gap: 7px; padding: 6px 13px; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16); font-size: 12.5px; font-weight: 700; color: #ffc6a8; }
.stkn__tag i { width: 7px; height: 7px; border-radius: 50%; background: #ffb020; box-shadow: 0 0 8px #ffb020; animation: rsrvBlink 1.2s ease-in-out infinite; }
.stkn h3 { margin-top: 12px; font-family: 'Outfit', sans-serif; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.2; color: #fff; }
.stkn p { margin-top: 10px; max-width: 720px; font-size: 15.5px; line-height: 1.65; color: #e4ddf0; }
.stkn__btns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.stkn__go { gap: 8px; padding: 13px 24px; border-radius: 999px; background: linear-gradient(90deg, #ff7a4d, #ff2d6f); color: #fff; font-weight: 700; box-shadow: 0 12px 26px rgba(255, 45, 111, .35); }
.stkn__go .icon { width: 17px; height: 17px; }
.stkn__go:hover { transform: translateY(-2px); }
.stkn__alt { padding: 13px 24px; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.6); color: #fff; font-weight: 700; }
.stkn__alt:hover { background: #fff; color: #2a1c3c; }
@media (max-width: 700px) {
  .stkn { grid-template-columns: 1fr; justify-items: center; gap: 14px; padding: 26px 20px; text-align: center; }
  .stkn__art { width: 120px; height: 120px; }
  .stkn__ico { width: 62px; height: 62px; } .stkn__ico svg { width: 32px; height: 32px; }
  .stkn__btns { justify-content: center; }
  .stkn__btns .btn { flex: 1 1 100%; justify-content: center; }
}

/* v75 – anunțul de la servere dedicate stă deasupra titlului secțiunii */
[data-stock-notice] .stkn { margin: 0 0 56px; }
@media (max-width: 700px) { [data-stock-notice] .stkn { margin-bottom: 36px; } }

/* =====================================================================
   v76 – Pagina 404: hero mov + fereastră cu eroare și cablu deconectat
   ===================================================================== */
.e404 { position: relative; overflow: hidden; min-height: 100vh; display: grid; align-items: center; padding: 150px 0 90px; color: #fff; background: linear-gradient(100deg, #1e1a2c 0%, #2a1c3c 45%, #3d1d45 75%, #461c3c 100%); }
.e404__inner { position: relative; display: grid; grid-template-columns: 1.05fr 1fr; gap: 50px; align-items: center; }
.e404__num { margin-top: 14px; font-family: 'Outfit', sans-serif; font-size: clamp(96px, 14vw, 190px); font-weight: 900; line-height: .9; letter-spacing: -.04em; }
.e404__num span { position: relative; display: inline-block; background: linear-gradient(90deg, #ff9a6b, #ff4f8b 55%, #a78bfa); -webkit-background-clip: text; background-clip: text; color: transparent; animation: e404Float 4s ease-in-out infinite; }
.e404__num span::before, .e404__num span::after { content: attr(data-t); position: absolute; left: 0; top: 0; background: inherit; -webkit-background-clip: text; background-clip: text; color: transparent; opacity: .7; }
.e404__num span::before { animation: e404Glitch1 3.2s steps(1) infinite; }
.e404__num span::after { animation: e404Glitch2 3.2s steps(1) infinite; }
@keyframes e404Float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes e404Glitch1 { 0%, 88%, 100% { transform: none; clip-path: inset(0 0 100% 0); } 90% { transform: translate(-6px, 2px); clip-path: inset(20% 0 50% 0); } 94% { transform: translate(5px, -2px); clip-path: inset(60% 0 10% 0); } }
@keyframes e404Glitch2 { 0%, 89%, 100% { transform: none; clip-path: inset(0 0 100% 0); } 91% { transform: translate(6px, -1px); clip-path: inset(40% 0 30% 0); filter: hue-rotate(60deg); } 95% { transform: translate(-4px, 1px); clip-path: inset(5% 0 75% 0); } }
.e404 h1 { margin-top: 14px; font-size: clamp(30px, 3.6vw, 48px); line-height: 1.12; }
.e404 h1 span { font-family: 'Inter', sans-serif; font-weight: 200; background: linear-gradient(90deg, #ff9a6b, #ff4f8b); -webkit-background-clip: text; background-clip: text; color: transparent; }
.e404__lead { margin-top: 16px; max-width: 560px; font-size: clamp(16px, 1.4vw, 18.5px); line-height: 1.65; color: #e4ddf0; font-weight: 300; }
.e404__btns { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 28px; }
.e404__go { gap: 10px; padding: 16px 28px; border-radius: 999px; background: linear-gradient(90deg, #ff7a4d, #ff2d6f); color: #fff; font-weight: 700; box-shadow: 0 14px 30px rgba(255, 45, 111, .35); }
.e404__go svg { width: 19px; height: 19px; }
.e404__go:hover { transform: translateY(-2px); }
.e404__alt { padding: 16px 28px; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.7); color: #fff; font-weight: 700; }
.e404__alt:hover { background: #fff; color: #2a1c3c; }
.e404__links { margin-top: 30px; }
.e404__links small { font-size: 13px; color: #c9c1db; }
.e404__links div { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.e404__links a { padding: 8px 14px; border-radius: 999px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); color: #fff; font-size: 13.5px; font-weight: 600; transition: background .2s, border-color .2s, transform .2s; }
.e404__links a:hover { background: rgba(255, 79, 139, .18); border-color: rgba(255, 79, 139, .5); transform: translateY(-2px); }

.e404__art { position: relative; width: 100%; max-width: 520px; aspect-ratio: 520 / 440; margin-left: auto; }
.e404__glow { position: absolute; left: 50%; top: 45%; width: 80%; aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; background: radial-gradient(circle, rgba(255, 79, 139, .3), transparent 65%); animation: iphPulse 4s ease-in-out infinite; }
.e404__win { position: absolute; left: 6%; top: 8%; width: 66%; border-radius: 16px; overflow: hidden; background: #1b1726; border: 1px solid rgba(255,255,255,.12); box-shadow: 0 30px 70px rgba(0,0,0,.5); animation: aFloat 6s ease-in-out infinite; }
.e404__bar { display: flex; align-items: center; gap: 6px; padding: 10px 12px; background: #2a2338; }
.e404__bar i { width: 9px; height: 9px; border-radius: 50%; background: #ff5f57; }
.e404__bar i:nth-child(2) { background: #febc2e; } .e404__bar i:nth-child(3) { background: #28c840; }
.e404__bar span { flex: 1; margin-left: 8px; padding: 4px 10px; border-radius: 6px; background: #1b1726; font-family: ui-monospace, monospace; font-size: 11px; color: #ff9ab2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.e404__screen { display: grid; justify-items: center; padding: 22px 16px 24px; text-align: center; }
.e404__face { position: relative; width: 70px; height: 70px; border-radius: 50%; background: linear-gradient(135deg, #ff7a4d, #ff2d6f); box-shadow: 0 10px 24px rgba(255, 45, 111, .4); animation: e404Shake 4s ease-in-out infinite; }
.e404__face b { position: absolute; top: 24px; width: 8px; height: 8px; border-radius: 50%; background: #fff; animation: e404Blink 4s infinite; }
.e404__face b:nth-child(1) { left: 20px; } .e404__face b:nth-child(2) { right: 20px; }
.e404__face span { position: absolute; left: 50%; bottom: 17px; width: 26px; height: 12px; translate: -50% 0; border: 3px solid #fff; border-bottom: 0; border-radius: 14px 14px 0 0; }
@keyframes e404Blink { 0%, 92%, 100% { transform: scaleY(1); } 95% { transform: scaleY(.1); } }
@keyframes e404Shake { 0%, 80%, 100% { transform: rotate(0); } 84% { transform: rotate(-8deg); } 88% { transform: rotate(8deg); } 92% { transform: rotate(-4deg); } }
.e404__screen strong { margin-top: 12px; font-family: 'Outfit', sans-serif; font-size: 38px; line-height: 1; color: #fff; }
.e404__screen small { font-size: 13px; color: #a9a3b8; letter-spacing: .08em; text-transform: uppercase; }
.e404__lines { display: grid; justify-items: center; gap: 7px; width: 100%; margin-top: 14px; }
.e404__lines i { width: 70%; height: 7px; border-radius: 4px; background: #2e2840; }
.e404__lines i.s { width: 45%; }

.e404__cable { position: absolute; left: 40%; bottom: 4%; width: 58%; overflow: visible; }
.e404__plug { transform-box: fill-box; transform-origin: left center; animation: e404Plug 2.4s ease-in-out infinite; }
@keyframes e404Plug { 0%, 100% { transform: rotate(-6deg) translateY(0); } 50% { transform: rotate(6deg) translateY(6px); } }
.e404__spark { animation: e404Spark 1.2s steps(2) infinite; }
@keyframes e404Spark { 0%, 100% { opacity: 0; } 50% { opacity: 1; } }
.e404__card { position: absolute; z-index: 2; display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 14px; background: rgba(255,255,255,.96); color: #15121c; box-shadow: 0 16px 34px rgba(0,0,0,.35); animation: aFloat 6s ease-in-out infinite; }
.e404__card b { display: block; font-size: 13.5px; white-space: nowrap; }
.e404__card small { font-size: 11px; color: #6c6a75; white-space: nowrap; }
.e404__ico { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; font-weight: 900; }
.e404__ico--red { background: #fee2e2; color: #dc2626; }
.e404__ico--ok { background: #dcfce7; color: #16a34a; }
.e404__card--1 { right: 0; top: 4%; animation-delay: -2s; }
.e404__card--2 { left: 0; bottom: 6%; animation-delay: -4s; }
.e404__q { position: absolute; font-family: 'Outfit', sans-serif; font-weight: 900; color: rgba(255, 154, 178, .5); animation: e404Q 5s ease-in-out infinite; }
.e404__q--1 { right: 14%; top: 30%; font-size: 40px; }
.e404__q--2 { right: 4%; top: 48%; font-size: 26px; animation-delay: -1.6s; }
.e404__q--3 { left: 2%; top: 30%; font-size: 30px; animation-delay: -3.2s; }
@keyframes e404Q { 0%, 100% { transform: translateY(0) rotate(-8deg); opacity: .4; } 50% { transform: translateY(-12px) rotate(8deg); opacity: .9; } }

@media (max-width: 1000px) {
  .e404 { min-height: 0; }
  .e404__inner { grid-template-columns: 1fr; }
  .e404__art { margin: 10px auto 0; }
}
@media (max-width: 640px) {
  .e404 { padding: 120px 0 60px; }
  .e404__btns .btn { flex: 1; justify-content: center; padding: 15px 18px; }
  .e404__card { padding: 7px 10px; gap: 7px; }
  .e404__card b { font-size: 11.5px; } .e404__card small { font-size: 9.5px; }
  .e404__ico { width: 26px; height: 26px; }
  .e404__win { width: 72%; }
  .e404__screen strong { font-size: 28px; }
  .e404__face { width: 56px; height: 56px; }
  .e404__face b { top: 19px; width: 7px; height: 7px; } .e404__face b:nth-child(1) { left: 15px; } .e404__face b:nth-child(2) { right: 15px; }
  .e404__face span { bottom: 13px; width: 22px; height: 10px; }
}

/* =====================================================================
   v77 – Header la derulare: alunecă lin în sus (fără salturi)
   Bara de sus nu-și mai schimbă înălțimea; tot headerul urcă cu înălțimea ei.
   ===================================================================== */
.header { transition: transform .38s cubic-bezier(.22, .61, .36, 1), background .3s, border-color .3s; will-change: transform; }
.header.scrolled { transform: translateY(calc(-1 * var(--tb-h, 0px))); }
.header .topbar, .header.scrolled .topbar { max-height: none; transition: opacity .25s; }
.header.scrolled .topbar { opacity: 0; pointer-events: none; }
.header.scrolled .logo--header img { height: var(--logo-h, 62px); }
.logo--header img { transition: none; }
@media (max-width: 1024px) {
  .header.scrolled .logo--header img { height: min(var(--logo-m, 46px), 66px); }
}
@media (max-width: 640px) {
  .header.scrolled .logo--header img { height: min(var(--logo-m, 46px), 58px); }
}
/* v77b – alunecarea se face cu „top” (nu cu transform), ca meniul de pe telefon să rămână la locul lui */
.header { transform: none !important; will-change: auto; transition: top .38s cubic-bezier(.22, .61, .36, 1), background .3s, border-color .3s; }
.header.scrolled { top: calc(-1 * var(--tb-h, 0px)); }

/* v78 – logo-urile metodelor de plată din subsol: plutesc ușor și au o strălucire care trece peste ele */
.paylogo { position: relative; overflow: hidden; animation: payFloat 3.6s ease-in-out infinite; }
.paylogo:nth-child(2) { animation-delay: -.7s; } .paylogo:nth-child(3) { animation-delay: -1.4s; } .paylogo:nth-child(4) { animation-delay: -2.1s; } .paylogo:nth-child(5) { animation-delay: -2.8s; }
.paylogo::after { content: ''; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.75), transparent); transform: skewX(-20deg); animation: payShine 4.5s ease-in-out infinite; pointer-events: none; }
.paylogo:nth-child(2)::after { animation-delay: .4s; } .paylogo:nth-child(3)::after { animation-delay: .8s; } .paylogo:nth-child(4)::after { animation-delay: 1.2s; } .paylogo:nth-child(5)::after { animation-delay: 1.6s; }
.paylogo:hover { animation-play-state: paused; transform: translateY(-4px) scale(1.05); }
@keyframes payFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
@keyframes payShine { 0%, 60% { left: -60%; } 100% { left: 130%; } }
@media (prefers-reduced-motion: reduce) { .paylogo, .paylogo::after { animation: none; } }
.fab--wa { transition: right .25s, bottom .25s, transform .2s, opacity .3s; }