
:root {
  --ink: #08142a;
  --text: #203049;
  --muted: #64748b;
  --line: rgba(220,230,245,1);
  --white: #fff;
  --primary: #0b5fff;
  --primary-dark: #083a9a;
  --green: #15b79e;
  --purple: #7b57e8;
  --surface: #f7faff;
  --shadow-sm: 0 16px 38px rgba(10,24,47,.08);
  --shadow-md: 0 24px 72px rgba(10,24,47,.12);
  --shadow-lg: 0 34px 110px rgba(5,19,43,.22);
  --container: 1240px;
  --header-h: 78px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--text);
  background: #fff;
  line-height: 1.5;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; }
.container { width: min(var(--container), calc(100% - 40px)); margin: 0 auto; }
main { overflow: clip; }

/* Header */
.site-header {
  position: sticky; top: 0; z-index: 60;
  background: rgba(255,255,255,.9);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(220,230,245,.9);
  transition: background .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.site-header.is-scrolled {
  background: rgba(255,255,255,.96);
  box-shadow: 0 10px 30px rgba(10,20,39,.08);
  border-color: rgba(220,230,245,1);
}
.nav-wrap { min-height: var(--header-h); display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.brand-logo, .brand-logo-dark { height: 40px; width: auto; }
.site-nav { display: flex; align-items: center; gap: 28px; }
.site-nav > a, .nav-dropdown-toggle {
  border: 0; background: none; padding: 0; cursor: pointer; font-weight: 700; color: #20324d;
  font-size: .94rem;
}
.site-nav > a:hover, .nav-dropdown-toggle:hover { color: var(--primary-dark); }
.nav-dropdown { position: relative; }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 14px); left: 0; min-width: 278px; display: grid; gap: 6px; padding: 14px;
  background: rgba(255,255,255,.98); border: 1px solid rgba(223,231,243,.96); border-radius: 18px; box-shadow: var(--shadow-sm);
  opacity: 0; visibility: hidden; transform: translateY(10px); transition: .24s ease;
}
.nav-dropdown:hover .nav-dropdown-menu, .nav-dropdown.is-open .nav-dropdown-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.nav-dropdown-menu a { padding: 12px 14px; border-radius: 12px; font-weight: 700; color: #243652; }
.nav-dropdown-menu a:hover { background: #f4f8ff; }
.nav-dropdown-menu span { margin-left: 8px; padding: 4px 8px; border-radius: 999px; font-size: .75rem; background: #eef4ff; color: var(--primary-dark); }
.nav-actions { display: flex; align-items: center; gap: 12px; }
.nav-toggle { display: none; width: 46px; height: 46px; border: 0; background: transparent; padding: 0; border-radius: 14px; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: #20324d; margin: 5px auto; border-radius: 99px; }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 46px; padding: 0 20px; border-radius: 10px; border: 1px solid transparent;
  font-weight: 800; transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn-lg { min-height: 54px; padding: 0 28px; border-radius: 12px; }
.btn-primary { background: linear-gradient(135deg, var(--primary), #2d7bff); color: #fff; box-shadow: 0 14px 34px rgba(11,95,255,.26); }
.btn-primary:hover { box-shadow: 0 18px 40px rgba(11,95,255,.30); }
.btn-outline { background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.35); }
.btn-outline:hover { background: rgba(255,255,255,.14); }
.btn-ghost { background: #eef4ff; color: var(--primary-dark); border-color: #dce8ff; }
.btn-light { background: rgba(255,255,255,.16); color: #fff; border-color: rgba(255,255,255,.20); }
.btn-secondary { background: #edf4ff; color: var(--primary-dark); }
.full { width: 100%; }

/* Hero */
.hero-slider { position: relative; background: #06142d; }
.hero-track { position: relative; min-height: calc(100vh - var(--header-h)); }
.hero-slide {
  position: absolute; inset: 0; opacity: 0; visibility: hidden; transform: translateX(24px);
  transition: opacity .75s ease, transform .8s ease, visibility .75s ease; overflow: hidden;
}
.hero-slide.is-active { opacity: 1; visibility: visible; transform: translateX(0); }
.hero-image-bg { position: absolute; inset: 0; }
.hero-image-bg img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(3,10,26,.92) 0%, rgba(5,15,36,.76) 38%, rgba(5,15,36,.28) 72%, rgba(5,15,36,.54) 100%); }
.hero-slide-green .hero-overlay { background: linear-gradient(90deg, rgba(2,24,20,.92) 0%, rgba(5,42,30,.72) 42%, rgba(5,42,30,.26) 72%, rgba(2,24,20,.56) 100%); }
.hero-slide-purple .hero-overlay { background: linear-gradient(90deg, rgba(22,10,50,.92) 0%, rgba(43,20,83,.72) 42%, rgba(43,20,83,.24) 74%, rgba(22,10,50,.56) 100%); }
.hero-layout {
  position: relative; z-index: 2; min-height: calc(100vh - var(--header-h));
  display: grid; grid-template-columns: minmax(0, 620px) 1fr; align-items: center; padding: 56px 0 94px;
}
.hero-copy { color: #fff; }
.hero-kicker {
  display: inline-flex; align-items: center; padding: 9px 14px; border-radius: 999px;
  background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.18); color: #fff;
  text-transform: uppercase; letter-spacing: .08em; font-size: .82rem; font-weight: 900;
}

.icon-inline { margin-right: 8px; color: var(--primary-dark); }
.metric-icon { display: inline-flex; width: 30px; height: 30px; align-items: center; justify-content: center; border-radius: 10px; background: rgba(255,255,255,.14); color: #fff; margin-bottom: 10px; font-size: .86rem; }
.domain-icon { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; margin: 0 auto 10px; border-radius: 12px; background: #eef4ff; color: var(--primary-dark); font-size: .92rem; }
.benefit-icon { color: #fff; font-size: .98rem; margin-top: 2px; }
.proof-icon { display: inline-flex; width: 38px; height: 38px; align-items: center; justify-content: center; border-radius: 14px; background: rgba(255,255,255,.14); color: #fff; margin-bottom: 12px; font-size: 1rem; }
.bundle-icon, .bento-icon { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; margin-bottom: 14px; border-radius: 14px; background: #eef4ff; color: var(--primary-dark); font-size: 1rem; }
.hero-copy h1 { margin: 14px 0 12px; color: #fff; font-size: clamp(2.35rem, 4.35vw, 3.85rem); line-height: 1.02; letter-spacing: -.045em; font-weight: 820; max-width: 13.5ch; }
.hero-copy p { margin: 0; max-width: 590px; color: rgba(255,255,255,.86); font-size: .98rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.hero-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 18px; max-width: 620px; }
.hero-metrics article {
  min-height: 68px; padding: 11px 13px; border-radius: 16px; background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(10px);
}
.hero-metrics strong { display: block; font-size: 1.1rem; color: #fff; }
.hero-metrics span { display: block; margin-top: 4px; font-size: .84rem; color: rgba(255,255,255,.78); }
.hero-note { margin-top: 12px !important; font-size: .82rem !important; color: rgba(255,255,255,.72) !important; }
.hero-controls { position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%); display: flex; gap: 12px; z-index: 5; }
.hero-dot { width: 10px; height: 10px; border-radius: 999px; border: 0; background: rgba(255,255,255,.40); cursor: pointer; transition: .24s ease; }
.hero-dot.is-active { width: 38px; background: #fff; }
.hero-arrow {
  position: absolute; z-index: 6; top: 50%; transform: translateY(-50%);
  width: 48px; height: 48px; border-radius: 50%; border: 0; background: rgba(255,255,255,.14);
  color: #fff; font-size: 2rem; cursor: pointer; backdrop-filter: blur(10px);
}
.hero-arrow:hover { background: rgba(255,255,255,.24); }
.hero-arrow-prev { left: 28px; }
.hero-arrow-next { right: 28px; }

/* Shared sections */
.section-screen { min-height: min(calc(100vh - var(--header-h)), 760px); display: grid; align-content: center; padding: 42px 0; }
.section-kicker {
  display: inline-flex; align-items: center; padding: 9px 14px; border-radius: 999px; font-size: .82rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase;
  color: var(--primary-dark); background: #edf4ff; border: 1px solid #dae6ff;
}
.kicker-light { color: #fff; background: rgba(255,255,255,.10); border-color: rgba(255,255,255,.16); }
.section-head { max-width: 650px; }
.section-head h2, .domain-heading h2, .infra-copy h2, .vps-copy h2, .contact-copy h2 {
  margin: 14px 0 12px; font-size: clamp(2rem, 3.5vw, 3.1rem); line-height: 1.04; letter-spacing: -.045em; color: var(--ink);
}
.section-head p, .domain-heading p, .infra-copy p, .vps-copy p, .contact-copy p { margin: 0; color: var(--muted); font-size: 1rem; }

/* Domain */
.domain-section { background: linear-gradient(180deg, #fff 0%, #f7faff 100%); }
.domain-shell { display: grid; grid-template-columns: .8fr 1.2fr; gap: 28px; align-items: center; }
.domain-card { padding: 20px; border-radius: 24px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-md); }
.domain-topline { display: inline-flex; align-items: center; font-weight: 900; color: var(--ink); margin-bottom: 14px; font-size: 1.05rem; }
.domain-input-row { display: grid; grid-template-columns: 1fr auto; gap: 12px; }
.domain-input-row input { min-height: 56px; border-radius: 14px; border: 1px solid var(--line); background: #f8fbff; padding: 0 18px; color: var(--ink); }
.domain-extension-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 16px; }
.domain-extension-grid article { padding: 14px 12px; border-radius: 14px; background: #f8fbff; border: 1px solid var(--line); text-align: center; }
.domain-extension-grid strong { display: block; color: var(--ink); font-size: 1.45rem; }
.domain-extension-grid span { display: block; color: var(--muted); font-size: .86rem; }

/* Hosting */
.hosting-section {
  position: relative;
  background:
    radial-gradient(circle at 8% 18%, rgba(111, 183, 255, .36), transparent 28%),
    radial-gradient(circle at 88% 78%, rgba(21, 183, 158, .22), transparent 30%),
    linear-gradient(135deg, #071831 0%, #0b3f95 48%, #0b5fff 100%);
  overflow: hidden;
}
.hosting-section::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .18;
  background-image: radial-gradient(circle, rgba(255,255,255,.35) 1px, transparent 1px);
  background-size: 24px 24px;
  pointer-events: none;
}
.hosting-layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: .78fr 1.22fr;
  gap: 34px;
  align-items: center;
}
.hosting-section .section-head h2,
.hosting-section .section-head p { color: #fff; }
.hosting-section .section-head h2 { max-width: 12.8ch; font-size: clamp(2.05rem, 3.5vw, 3.25rem); line-height: 1.02; }
.side-benefits {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px 14px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
  color: rgba(255,255,255,.9);
}
.side-benefits li {
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: 9px;
  align-items: start;
  padding-left: 0;
  font-weight: 750;
  font-size: .92rem;
}
.side-benefits li::before { content: none; }

.plan-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.plan-card {
  position: relative;
  padding: 22px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid rgba(220,230,245,.92);
  color: var(--text);
  box-shadow: 0 22px 54px rgba(4, 18, 45, .18);
  display: flex;
  flex-direction: column;
  min-height: 470px;
}
.plan-card-featured {
  background: #fff;
  color: var(--text);
  transform: none;
  border: 2px solid rgba(96, 157, 255, .82);
}
.plan-card p, .plan-card li, .plan-card .plan-price small { color: var(--muted); }
.plan-card .plan-price { color: var(--ink); }
.plan-tag, .bundle-label, .plan-tag-vps {
  display: inline-flex; margin-bottom: 14px; padding: 8px 12px; border-radius: 999px;
  background: #eef4ff; color: var(--primary-dark); font-weight: 900; font-size: .82rem;
}
.highlight-badge { position: absolute; top: 16px; right: 16px; padding: 7px 10px; border-radius: 999px; background: linear-gradient(135deg, var(--primary), #3d83ff); color: #fff; font-size: .74rem; font-weight: 900; }
.plan-card h3, .bundle-card h3, .vps-card-blur h3 { margin: 0 0 7px; font-size: 1.15rem; color: var(--ink); }
.plan-card p, .bundle-card p, .vps-card-blur p { margin: 0 0 12px; font-size: .9rem; }
.plan-price, .bundle-price, .vps-price { margin-bottom: 12px; font-size: 1.45rem; line-height: 1.05; font-weight: 850; letter-spacing: -.04em; }
.plan-price small, .bundle-price small { display: inline-block; margin-top: 0; margin-left: 6px; font-size: .72em; letter-spacing: 0; font-weight: 750; color: var(--muted); vertical-align: baseline; }
.plan-card ul, .bundle-card ul, .vps-card-blur ul { margin: 0 0 14px; padding: 0; list-style: none; display: grid; gap: 8px; }
.plan-card li, .bundle-card li, .vps-card-blur li { position: relative; padding-left: 22px; font-size: .88rem; }
.plan-card li::before, .bundle-card li::before, .vps-card-blur li::before {
  content: ''; position: absolute; left: 0; top: 7px; width: 16px; height: 16px; border-radius: 50%; background: linear-gradient(135deg, var(--primary), var(--green)); box-shadow: inset 0 0 0 4px rgba(255,255,255,.94);
}

/* Bundles */
.bundle-section { background: #fff; }
.bundle-layout { display: grid; grid-template-columns: .68fr 1.32fr; gap: 28px; align-items: center; }
.bundle-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; align-items: stretch; }
.bundle-card {
  padding: 22px;
  background: linear-gradient(180deg, #fff, #fbfdff);
  color: var(--text);
  border: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  min-height: 470px;
}
.bundle-card p, .bundle-card li, .bundle-card .bundle-price small { color: var(--muted); }
.bundle-card .bundle-price { color: var(--ink); }
.bundle-card .bundle-label { background: #eef4ff; color: var(--primary-dark); }
.bundle-card-featured { transform: none; border-color: rgba(11,95,255,.24); box-shadow: var(--shadow-md); }

/* VPS */
.vps-section { background: linear-gradient(135deg, #071831 0%, #061f4d 60%, #071831 100%); min-height: auto; padding: 56px 0; }
.vps-shell { display: grid; grid-template-columns: .62fr 1.38fr; gap: 24px; align-items: center; }
.vps-copy h2, .vps-copy p { color: #fff; }
.text-link { display: inline-flex; margin-top: 18px; color: #fff; font-weight: 900; }
.vps-ghosts { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.vps-card-blur { padding: 20px; background: rgba(255,255,255,.94); color: var(--text); filter: blur(1px); opacity: .86; }
.vps-card-blur p, .vps-card-blur li { color: var(--muted); }
.vps-card-blur .plan-tag-vps { background: #eef4ff; color: var(--primary-dark); }
.vps-card-featured { transform: scale(1.03); }
.vps-overlay {
  position: absolute; inset: 50% auto auto 50%; transform: translate(-50%, -50%);
  padding: 16px 24px; border-radius: 999px; background: rgba(11,95,255,.96); color: #fff; font-weight: 900; letter-spacing: .04em; box-shadow: 0 20px 50px rgba(11,95,255,.24); z-index: 3;
}

/* Infra */
.infra-section { background: #fff; }
.infra-shell { display: grid; grid-template-columns: .78fr 1.22fr; gap: 28px; align-items: center; }
.infra-bento { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.bento-card { padding: 18px; border-radius: 20px; background: #f8fbff; border: 1px solid var(--line); color: var(--text); box-shadow: var(--shadow-sm); }
.bento-card h3 { margin: 0 0 10px; font-size: 1.15rem; color: var(--ink); }
.bento-card p { margin: 0; color: var(--muted); }
.bento-card-main { grid-column: 1 / -1; min-height: 150px; display: flex; flex-direction: column; justify-content: flex-end; background: linear-gradient(135deg, #edf4ff, #fff); }
.infra-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 24px; }
.infra-stats article { padding: 16px; border-radius: 18px; background: #f8fbff; border: 1px solid var(--line); text-align: center; }
.infra-stats strong { display: block; color: var(--primary-dark); font-size: 1.8rem; line-height: 1; }
.infra-stats span { display: block; margin-top: 8px; color: var(--muted); font-size: .88rem; }

/* Contact */
.contact-section { background: linear-gradient(135deg, #071831 0%, #0b3f95 48%, #0b5fff 100%); }
.contact-shell { display: grid; grid-template-columns: .8fr 1.2fr; gap: 28px; align-items: center; }
.contact-copy h2, .contact-copy p { color: #fff; }
.contact-pills { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.contact-pills span { padding: 10px 12px; border-radius: 999px; background: rgba(255,255,255,.12); color: #fff; font-weight: 700; border: 1px solid rgba(255,255,255,.12); }
.contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 22px; border-radius: 22px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.18); backdrop-filter: blur(12px); box-shadow: var(--shadow-md); }
.contact-form label { display: grid; gap: 8px; font-weight: 800; color: #fff; }
.contact-form input, .contact-form select, .contact-form textarea { min-height: 50px; padding: 0 14px; border-radius: 12px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.96); color: var(--ink); }
.contact-form textarea { min-height: 120px; resize: vertical; padding: 12px 14px; }
.field-full { grid-column: 1 / -1; }

/* Footer */
.site-footer { background: #07111f; color: rgba(255,255,255,.72); }
.footer-grid { display: grid; grid-template-columns: 1.3fr .8fr .8fr .8fr; gap: 24px; padding: 64px 0 34px; }
.footer-brand p { max-width: 350px; color: rgba(255,255,255,.58); }
.footer-col h3 { margin: 0 0 16px; color: #fff; font-size: 1rem; }
.footer-col a, .footer-col span { display: block; margin-bottom: 10px; color: rgba(255,255,255,.64); }
.footer-col a:hover { color: #fff; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.08); }
.footer-bottom-wrap { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 0 24px; }
.footer-bottom a { color: rgba(255,255,255,.58); margin-left: 18px; }
.payment-strip { margin-top: 18px; }
.payment-strip img { display: block; width: min(100%, 336px); height: auto; border-radius: 10px; }
.whatsapp-float { position: fixed; right: 24px; bottom: 24px; z-index: 40; min-height: 54px; padding: 0 18px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: #0abf53; color: #fff; font-weight: 800; box-shadow: 0 20px 46px rgba(10,191,83,.28); }
.back-to-top { position: fixed; right: 24px; bottom: 92px; z-index: 39; width: 48px; height: 48px; border: 0; border-radius: 50%; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; background: rgba(7,17,31,.92); color: #fff; box-shadow: 0 16px 38px rgba(7,17,31,.22); opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .25s ease, transform .25s ease, visibility .25s ease; }
.back-to-top span { font-size: 1.1rem; font-weight: 900; line-height: 1; }
.back-to-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }

/* Reveal */
.reveal { opacity: 0; transform: translateY(32px); transition: opacity .75s ease, transform .75s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: .08s; }
.delay-2 { transition-delay: .14s; }

/* Responsive */
@media (max-width: 1180px) {
  .hosting-layout, .bundle-layout, .vps-shell, .infra-shell, .contact-shell, .domain-shell { grid-template-columns: 1fr; }
  .section-screen { min-height: auto; }
  .contact-people img { height: 300px; }
}
@media (max-width: 980px) {
  .nav-toggle { display: inline-block; }
  .site-nav { position: absolute; left: 20px; right: 20px; top: calc(100% + 12px); display: none; flex-direction: column; align-items: stretch; gap: 14px; padding: 18px; background: rgba(255,255,255,.98); border: 1px solid rgba(220,228,241,.96); border-radius: 18px; box-shadow: var(--shadow-sm); }
  .site-nav.is-open { display: flex; }
  .nav-dropdown-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; padding: 10px 0 0; min-width: 0; background: rgba(255,255,255,.06); }
  .nav-dropdown-menu a { color: #243652; }
  .plan-grid, .bundle-grid, .vps-ghosts, .infra-bento, .infra-stats { grid-template-columns: 1fr; }
  .plan-card-featured, .bundle-card-featured, .vps-card-featured { transform: none; }
  .hero-arrow { display: none; }
}
@media (max-width: 760px) {
  :root { --header-h: 72px; }
  .container { width: min(var(--container), calc(100% - 24px)); }
  .nav-actions { display: none; }
  .brand-logo { height: 36px; }
  .hero-track { min-height: calc(100svh - var(--header-h)); }
  .hero-layout { min-height: calc(100svh - var(--header-h)); padding: 36px 0 76px; grid-template-columns: 1fr; }
  .hero-overlay { background: linear-gradient(180deg, rgba(4,11,28,.88) 0%, rgba(4,11,28,.70) 58%, rgba(4,11,28,.88) 100%); }
  .hero-image-bg img { object-position: 62% center; }
  .hero-copy h1 { font-size: clamp(2.35rem, 10vw, 3.35rem); max-width: 12ch; }
  .hero-copy p { font-size: .98rem; }
  .hero-actions { flex-direction: column; }
  .hero-actions .btn, .domain-input-row .btn { width: 100%; }
  .hero-metrics { grid-template-columns: 1fr; gap: 8px; }
  .hero-metrics article { min-height: auto; padding: 12px 14px; }
  .section-screen { padding: 42px 0; }
  .domain-input-row, .contact-form { grid-template-columns: 1fr; }
  .domain-extension-grid { grid-template-columns: repeat(2, 1fr); }
    .field-full { grid-column: auto; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom-wrap { flex-direction: column; align-items: flex-start; }
  .footer-bottom a { margin-left: 0; margin-right: 16px; }
  .back-to-top { right: 16px; bottom: 84px; width: 44px; height: 44px; }
  .whatsapp-float { right: 16px; bottom: 18px; }
}

.plan-card .btn, .bundle-card .btn { margin-top: auto; }

.bundle-note { margin: 16px 0 0; color: var(--muted); font-size: .88rem; text-align: right; }

.plan-price, .bundle-price { white-space: nowrap; display: flex; align-items: baseline; gap: 2px; }
.plan-price small, .bundle-price small { display: inline-block; margin-top: 0; margin-left: 6px; font-size: .72em; letter-spacing: 0; font-weight: 750; color: var(--muted); vertical-align: baseline; }

/* CMS-added integrations */
.upmind-widget-wrap {
  width: 100%;
  min-height: 76px;
}
.domain-widget-note {
  margin: 12px 0 0;
  color: var(--muted);
  font-size: .9rem;
}
.service-status-section {
  background: #fff;
}
.service-status-shell {
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: 28px;
  align-items: center;
}
.service-status-section .section-head h2 {
  color: var(--ink);
}
.service-status-section .section-head p {
  color: var(--muted);
}
.status-frame-card {
  min-height: 360px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 26px;
  background: linear-gradient(180deg, #fff, #f8fbff);
  box-shadow: var(--shadow-md);
  overflow: hidden;
}
.status-frame-card iframe {
  display: block;
  width: 100%;
  min-height: 320px;
}
@media (max-width: 1180px) {
  .service-status-shell { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .hero-slider { min-height: auto; }
  .hero-track { min-height: auto; }
  .hero-slide {
    position: relative;
    display: none;
    min-height: calc(100svh - var(--header-h));
  }
  .hero-slide.is-active {
    display: block;
  }
  .hero-layout {
    min-height: calc(100svh - var(--header-h));
    padding: 28px 0 92px;
    align-items: end;
  }
  .hero-copy {
    max-width: 100%;
  }
  .hero-copy h1 {
    font-size: clamp(2rem, 8.8vw, 2.85rem);
    max-width: 100%;
    line-height: 1.04;
  }
  .hero-copy p {
    max-width: 100%;
    font-size: .94rem;
  }
  .hero-metrics {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .hero-metrics article {
    display: grid;
    grid-template-columns: 32px 1fr;
    column-gap: 10px;
    align-items: center;
    min-height: auto;
    padding: 10px 12px;
  }
  .hero-metrics .metric-icon {
    grid-row: 1 / span 2;
    margin-bottom: 0;
  }
  .hero-metrics strong,
  .hero-metrics span {
    margin: 0;
  }
  .hero-note {
    font-size: .76rem !important;
    margin-top: 9px !important;
  }
  .hero-image-bg img {
    object-position: 65% center;
  }
  .hero-overlay {
    background: linear-gradient(180deg, rgba(3,10,26,.72) 0%, rgba(3,10,26,.58) 42%, rgba(3,10,26,.96) 100%);
  }
  .status-frame-card {
    padding: 12px;
    border-radius: 20px;
    min-height: 300px;
  }
  .status-frame-card iframe {
    min-height: 280px;
  }
}

/* Hosting technology logos */
.hosting-plans-area {
  display: grid;
  gap: 16px;
}
.hosting-tech-stack {
  padding: 14px;
  border-radius: 22px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(10px);
}
.hosting-tech-copy {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 14px;
  margin-bottom: 12px;
  color: #fff;
}
.hosting-tech-copy strong {
  font-size: .98rem;
}
.hosting-tech-copy span {
  color: rgba(255,255,255,.78);
  font-size: .86rem;
}
.tech-logo-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}
.tech-logo-grid article {
  min-height: 52px;
  display: grid;
  place-items: center;
  padding: 6px;
  border-radius: 14px;
  background: rgba(255,255,255,.95);
  border: 1px solid rgba(255,255,255,.32);
}
.tech-logo-grid img {
  width: 100%;
  max-height: 38px;
  object-fit: contain;
}
@media (max-width: 1180px) {
  .tech-logo-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .tech-logo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hosting-tech-stack { padding: 12px; }
}

/* Lawyers landing page */
.law-hero {
  position: relative;
  overflow: hidden;
  background: #06142d;
}
.law-hero-bg { position: absolute; inset: 0; }
.law-hero-bg img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.law-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(3,10,26,.94) 0%, rgba(7,24,56,.82) 38%, rgba(7,24,56,.28) 72%, rgba(3,10,26,.56) 100%);
}
.law-hero-layout {
  position: relative;
  z-index: 2;
  min-height: min(calc(100vh - var(--header-h)), 780px);
  display: grid;
  align-items: center;
  grid-template-columns: minmax(0, 650px) 1fr;
  padding: 52px 0 82px;
}
.law-hero-copy { color: #fff; }
.law-hero-copy h1 {
  margin: 14px 0 12px;
  font-size: clamp(2.45rem, 4.6vw, 4.2rem);
  line-height: 1.01;
  letter-spacing: -.045em;
  max-width: 12.8ch;
  color: #fff;
}
.law-hero-copy p { max-width: 620px; color: rgba(255,255,255,.86); }
.law-metrics { margin-top: 20px; }
.law-intro-section,
.law-comparison-section,
.law-extras-section { background: #fff; }
.law-intro-layout,
.law-comparison-layout,
.law-extras-layout { display: grid; gap: 28px; align-items: center; }
.law-intro-layout { grid-template-columns: .76fr 1.24fr; }
.law-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.law-benefit-card {
  min-height: 210px;
  padding: 20px;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #fff, #f8fbff);
  box-shadow: var(--shadow-sm);
}
.law-benefit-card h3,
.law-process-grid h3 { margin: 0 0 8px; color: var(--ink); font-size: 1.08rem; }
.law-benefit-card p,
.law-process-grid p { margin: 0; color: var(--muted); font-size: .92rem; }
.law-plans-section,
.law-process-section,
.law-cta-section {
  background:
    radial-gradient(circle at 8% 18%, rgba(111, 183, 255, .28), transparent 28%),
    radial-gradient(circle at 88% 78%, rgba(21, 183, 158, .18), transparent 30%),
    linear-gradient(135deg, #071831 0%, #0b3f95 50%, #0b5fff 100%);
}
.law-plans-layout,
.law-process-layout { display: grid; gap: 24px; }
.law-plans-section .section-head h2,
.law-plans-section .section-head p,
.law-process-section .section-head h2,
.law-process-section .section-head p { color: #fff; }
.law-plan-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  align-items: stretch;
}
.law-price-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 500px;
  padding: 20px;
  border-radius: 22px;
  background: #fff;
  border: 1px solid rgba(220,230,245,.92);
  color: var(--text);
  box-shadow: 0 22px 54px rgba(4, 18, 45, .18);
}
.law-price-featured { border: 2px solid rgba(96,157,255,.92); }
.law-price-card h3 { margin: 0 0 7px; color: var(--ink); font-size: 1.14rem; }
.law-price-card p { margin: 0 0 12px; color: var(--muted); font-size: .9rem; }
.law-price-card ul { margin: 0 0 14px; padding: 0; list-style: none; display: grid; gap: 8px; }
.law-price-card li { position: relative; padding-left: 22px; color: var(--muted); font-size: .86rem; }
.law-price-card li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 7px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--primary), var(--green));
  box-shadow: inset 0 0 0 4px rgba(255,255,255,.94);
}
.law-price-card .btn { margin-top: auto; }
.law-note { margin: 0; color: rgba(255,255,255,.78); font-size: .88rem; text-align: right; }
.law-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #fff;
  box-shadow: var(--shadow-sm);
}
.law-compare-table { width: 100%; border-collapse: collapse; min-width: 980px; }
.law-compare-table th,
.law-compare-table td { padding: 14px 16px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.law-compare-table th { background: #f3f7ff; color: var(--ink); font-size: .9rem; }
.law-compare-table td { color: var(--muted); font-size: .9rem; }
.law-compare-table td:first-child { color: var(--ink); font-weight: 800; }
.law-process-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; }
.law-process-grid article {
  padding: 20px;
  border-radius: 22px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  color: #fff;
  min-height: 210px;
  backdrop-filter: blur(10px);
}
.law-process-grid h3 { color: #fff; }
.law-process-grid p { color: rgba(255,255,255,.78); }
.law-cta-card {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: center;
  padding: 34px;
  border-radius: 30px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: var(--shadow-lg);
  color: #fff;
}
.law-cta-card h2 { margin: 14px 0 10px; font-size: clamp(2rem,3vw,3rem); color: #fff; line-height: 1.04; letter-spacing: -.04em; }
.law-cta-card p { margin: 0; max-width: 760px; color: rgba(255,255,255,.82); }
@media (max-width: 1320px) {
  .law-plan-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .law-card-grid, .law-process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .law-intro-layout { grid-template-columns: 1fr; }
  .law-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .law-price-card { min-height: auto; }
  .law-cta-card { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .law-hero { min-height: auto; }
  .law-hero-layout {
    min-height: calc(100svh - var(--header-h));
    grid-template-columns: 1fr;
    padding: 28px 0 92px;
    align-items: end;
  }
  .law-hero-overlay { background: linear-gradient(180deg, rgba(3,10,26,.72) 0%, rgba(3,10,26,.58) 42%, rgba(3,10,26,.96) 100%); }
  .law-hero-bg img { object-position: 65% center; }
  .law-hero-copy h1 { font-size: clamp(2rem, 8.8vw, 2.9rem); max-width: 100%; }
  .law-hero-copy p { font-size: .94rem; }
  .law-card-grid,
  .law-process-grid,
  .law-plan-grid { grid-template-columns: 1fr; }
  .law-benefit-card,
  .law-process-grid article { min-height: auto; }
  .law-note { text-align: left; }
}

/* Tech logos as pure logos */
.hosting-tech-stack {
  padding: 12px 14px;
}
.tech-logo-grid article {
  min-height: 58px;
  padding: 10px 12px;
}
.tech-logo-grid img {
  width: auto;
  max-width: 100%;
  max-height: 36px;
  object-fit: contain;
}

.embed-locale-note {
  display: none;
}

/* Lawyers comparison redesign */
.law-comparison-modern {
  display: grid;
  gap: 24px;
}
.law-comparison-modern .section-head {
  max-width: 780px;
}
.law-compare-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}
.law-compare-plan-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: 24px;
  border-radius: 26px;
  background: linear-gradient(180deg, #fff, #f8fbff);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
}
.law-compare-plan-card.is-featured {
  border-color: rgba(11,95,255,.35);
  box-shadow: var(--shadow-md);
  transform: translateY(-6px);
}
.law-compare-plan-card header {
  padding-bottom: 16px;
  margin-bottom: 16px;
  border-bottom: 1px solid var(--line);
}
.law-compare-plan-card header span {
  display: inline-flex;
  margin-bottom: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #eef4ff;
  color: var(--primary-dark);
  font-weight: 900;
  font-size: .82rem;
}
.law-compare-plan-card header h3 {
  margin: 0 0 10px;
  color: var(--ink);
  font-size: 1.25rem;
}
.law-compare-plan-card header strong {
  display: flex;
  align-items: baseline;
  gap: 6px;
  color: var(--ink);
  font-size: 1.45rem;
  letter-spacing: -.04em;
}
.law-compare-plan-card header small {
  color: var(--muted);
  font-size: .72em;
  letter-spacing: 0;
}
.law-feature-list {
  display: grid;
  gap: 10px;
  margin-bottom: 18px;
}
.law-feature-item {
  display: grid;
  gap: 4px;
  padding: 12px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid rgba(220,230,245,.9);
}
.law-feature-item span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
}
.law-feature-item strong {
  color: var(--text);
  font-size: .92rem;
  line-height: 1.25;
}
.law-compare-plan-card .btn {
  margin-top: auto;
}
@media (max-width: 980px) {
  .law-compare-cards {
    grid-template-columns: 1fr;
  }
  .law-compare-plan-card.is-featured {
    transform: none;
  }
}

.law-table-wrap { overflow-x: auto; }

/* Hidden Google Translate helper */
#google_translate_element,
.goog-te-banner-frame,
.goog-te-balloon-frame,
.skiptranslate {
  display: none !important;
}
body {
  top: 0 !important;
}

/* Trusted clients slider */
.trusted-clients-section {
  background: #fff;
  padding: 56px 0;
}
.trusted-clients-shell {
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: 28px;
  align-items: center;
}
.trusted-clients-head h2 {
  margin: 14px 0 12px;
  color: var(--ink);
  font-size: clamp(1.9rem, 3vw, 2.8rem);
  line-height: 1.04;
  letter-spacing: -.045em;
}
.trusted-clients-head p {
  margin: 0;
  color: var(--muted);
}
.trusted-clients-slider {
  position: relative;
  padding: 18px;
  border-radius: 26px;
  background: linear-gradient(180deg, #fff, #f8fbff);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-md);
  overflow: hidden;
}
.trusted-clients-track {
  position: relative;
  min-height: 260px;
}
.trusted-client-card {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  gap: 18px;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transform: translateX(14px);
  transition: opacity .38s ease, transform .38s ease, visibility .38s ease;
}
.trusted-client-card.is-active {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}
.trusted-client-image {
  height: 220px;
  border-radius: 20px;
  overflow: hidden;
  background: #eef4ff;
}
.trusted-client-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.trusted-client-copy span {
  display: inline-flex;
  margin-bottom: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #eef4ff;
  color: var(--primary-dark);
  font-weight: 900;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.trusted-client-copy h3 {
  margin: 0 0 8px;
  color: var(--ink);
  font-size: 1.45rem;
}
.trusted-client-copy p {
  margin: 0 0 12px;
  color: var(--muted);
}
.trusted-client-copy a {
  display: inline-flex;
  color: var(--primary-dark);
  font-weight: 900;
}
.trusted-clients-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 16px;
}
.trusted-clients-controls > button {
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  font-size: 1.5rem;
  cursor: pointer;
}
.trusted-clients-dots {
  display: flex;
  gap: 8px;
}
.trusted-clients-dots button {
  width: 9px;
  height: 9px;
  border: 0;
  border-radius: 999px;
  background: #c4d4ee;
  cursor: pointer;
}
.trusted-clients-dots button.is-active {
  width: 30px;
  background: var(--primary);
}
@media (max-width: 980px) {
  .trusted-clients-shell {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .trusted-clients-section {
    padding: 42px 0;
  }
  .trusted-client-card {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .trusted-clients-track {
    min-height: 430px;
  }
  .trusted-client-image {
    height: 210px;
  }
}

/* Google Translate UI hard-hide */
#google_translate_element,
#goog-gt-tt,
.goog-te-banner-frame,
.goog-te-balloon-frame,
.goog-te-menu-frame,
.goog-te-menu-value,
.goog-te-gadget,
.goog-te-combo,
.goog-logo-link,
.goog-te-spinner-pos,
.VIpgJd-ZVi9od-ORHb-OEVmcd,
.VIpgJd-ZVi9od-aZ2wEe-wOHMyf,
.VIpgJd-yAWNEb-L7lbkb,
.VIpgJd-yAWNEb-hvhgNd,
.VIpgJd-yAWNEb-VIpgJd-fmcmS-sn54Q,
iframe.goog-te-banner-frame,
iframe.skiptranslate,
body > .skiptranslate {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}
html.translated-ltr,
html.translated-rtl,
body {
  top: 0 !important;
  margin-top: 0 !important;
}
font[style*="background-color"] {
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Translate scope protection */
.notranslate {
  unicode-bidi: inherit;
}

/* Lawyers 3-plan layout fix */
.law-plan-grid {
  grid-template-columns: repeat(3, minmax(280px, 360px)) !important;
  justify-content: center;
  gap: 22px;
}
.law-price-card {
  width: 100%;
  min-height: 470px;
}
.law-plans-layout {
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}
.law-comparison-modern {
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}
@media (max-width: 980px) {
  .law-plan-grid {
    grid-template-columns: minmax(280px, 520px) !important;
    justify-content: center;
  }
}
@media (max-width: 560px) {
  .law-plan-grid {
    grid-template-columns: 1fr !important;
  }
}

.domain-widget-warning {
  margin: 12px 0;
  padding: 14px 16px;
  border-radius: 14px;
  background: #fff8e5;
  color: #8a5a00;
  border: 1px solid #ffe0a3;
  font-weight: 750;
  line-height: 1.4;
}

/* Hosting commercial note and Enhance included features */
.hosting-note {
  margin: 2px 0 0;
  color: rgba(255,255,255,.78);
  font-size: .82rem;
  text-align: right;
}
.enhance-feature-strip {
  padding: 14px;
  border-radius: 22px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(10px);
}
.enhance-feature-strip > strong {
  display: block;
  margin-bottom: 10px;
  color: #fff;
  font-size: .95rem;
}
.enhance-feature-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.enhance-feature-grid article {
  display: grid;
  gap: 6px;
  place-items: center;
  min-height: 74px;
  padding: 10px 8px;
  border-radius: 14px;
  background: rgba(255,255,255,.95);
  border: 1px solid rgba(255,255,255,.32);
  text-align: center;
}
.enhance-feature-grid i {
  color: var(--primary-dark);
  font-size: 1rem;
}
.enhance-feature-grid span {
  color: var(--ink);
  font-size: .74rem;
  font-weight: 850;
  line-height: 1.15;
}
@media (max-width: 1180px) {
  .enhance-feature-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .hosting-note { text-align: left; }
  .enhance-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Legal pages */
.legal-page {
  background: #f6f9ff;
}
.legal-hero {
  padding: 84px 0 54px;
  background:
    radial-gradient(circle at 12% 18%, rgba(96,157,255,.35), transparent 28%),
    linear-gradient(135deg, #071831 0%, #0b3f95 58%, #0b5fff 100%);
  color: #fff;
}
.legal-hero-inner {
  max-width: 940px;
}
.legal-hero h1 {
  margin: 14px 0 12px;
  color: #fff;
  font-size: clamp(2.2rem, 4.8vw, 4.2rem);
  line-height: 1.02;
  letter-spacing: -.045em;
}
.legal-hero p {
  margin: 0;
  max-width: 760px;
  color: rgba(255,255,255,.82);
}
.legal-content-section {
  padding: 54px 0;
}
.legal-content-shell {
  max-width: 1040px;
}
.legal-card {
  padding: clamp(24px, 4vw, 46px);
  border-radius: 28px;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-md);
}
.legal-updated {
  display: inline-flex;
  margin-bottom: 22px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #eef4ff;
  color: var(--primary-dark);
  font-weight: 850;
  font-size: .86rem;
}
.legal-card h1 {
  margin: 0 0 20px;
  color: var(--ink);
  font-size: clamp(1.75rem, 3vw, 2.7rem);
  line-height: 1.05;
}
.legal-card h2 {
  margin: 32px 0 12px;
  color: var(--ink);
  font-size: 1.35rem;
  line-height: 1.18;
}
.legal-card h3 {
  margin: 24px 0 10px;
  color: var(--primary-dark);
  font-size: 1.08rem;
}
.legal-card p,
.legal-card li {
  color: var(--text);
  line-height: 1.7;
  font-size: .98rem;
}
.legal-card ul {
  display: grid;
  gap: 8px;
  padding-left: 20px;
}

/* Offer pricing */
.offer-badge {
  position: absolute;
  top: 16px;
  right: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 11px;
  border-radius: 999px;
  background: linear-gradient(135deg, #ff7a18, #ff3d71);
  color: #fff;
  font-size: .76rem;
  font-weight: 950;
  letter-spacing: .02em;
  box-shadow: 0 12px 28px rgba(255,61,113,.24);
  z-index: 2;
}
.plan-price-offer {
  display: flex !important;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
}
.plan-price-offer .old-price {
  color: var(--muted);
  text-decoration: line-through;
  text-decoration-thickness: 2px;
  font-size: .72em;
  font-weight: 750;
}
.plan-price-offer .new-price {
  color: var(--primary-dark);
  font-size: 1em;
  font-weight: 900;
}
.offer-reason {
  margin: -4px 0 12px !important;
  padding: 8px 10px;
  border-radius: 12px;
  background: #fff8e5;
  color: #8a5a00 !important;
  font-size: .8rem !important;
  font-weight: 800;
  line-height: 1.25;
}
.law-price.plan-price-offer,
.law-compare-plan-card .plan-price-offer {
  color: var(--ink);
}
@media (max-width: 760px) {
  .legal-hero { padding: 58px 0 38px; }
  .legal-content-section { padding: 36px 0; }
  .legal-card { border-radius: 22px; }
}

/* CMS organization and layout stability */
.admin-shell {
  grid-template-columns: 250px minmax(0, 1fr);
  align-items: start;
}
.admin-shell > .alert {
  grid-column: 1 / -1;
  order: -1;
}
.editor {
  min-width: 0;
}
.cms-editor-intro {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #ffffff;
  color: var(--muted);
  font-weight: 800;
  box-shadow: var(--shadow);
}
.admin-menu {
  max-height: calc(100vh - 108px);
  overflow: auto;
  gap: 6px;
}
.menu-group-title {
  display: block;
  margin: 12px 8px 4px;
  color: #8ca0bc;
  font-size: .72rem;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.menu-group-title:first-child {
  margin-top: 0;
}
.panel {
  margin-bottom: 4px;
}
.panel-compact {
  padding-bottom: 18px;
}

/* WhatsApp floating button as brand icon */
.whatsapp-float {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  padding: 0;
  display: grid;
  place-items: center;
  background: #25D366;
  color: #fff;
  box-shadow: 0 16px 38px rgba(37, 211, 102, .34);
}
.whatsapp-float span {
  display: none;
}
.whatsapp-icon {
  width: 30px;
  height: 30px;
}

/* Web hosting anchor and card clipping fix */
#web-hosting {
  scroll-margin-top: calc(var(--header-h) + 36px);
}
.hosting-section {
  overflow: visible;
}
.hosting-layout {
  padding-top: 22px;
}
.hosting-plans-area,
.plan-grid {
  overflow: visible;
}
.plan-card {
  overflow: visible;
}
@media (max-width: 980px) {
  .admin-shell {
    grid-template-columns: 1fr;
  }
  .admin-menu {
    max-height: none;
  }
  .hosting-layout {
    padding-top: 8px;
  }
}

/* Anchor positioning fix for fixed header */
#top,
#dominios,
#web-hosting,
#soluciones-digitales,
#vps,
#infraestructura,
#cotizar,
#clientes,
#planes-abogados,
#cotizar-abogados {
  scroll-margin-top: calc(var(--header-h) + 36px);
}

#web-hosting,
#vps,
#soluciones-digitales,
#infraestructura,
#cotizar,
#clientes {
  position: relative;
}

@media (max-width: 760px) {
  #top,
  #dominios,
  #web-hosting,
  #soluciones-digitales,
  #vps,
  #infraestructura,
  #cotizar,
  #clientes,
  #planes-abogados,
  #cotizar-abogados {
    scroll-margin-top: calc(var(--header-h) + 22px);
  }
}

.anchor-target-padding-fix { display: none; }

/* Offer priority behavior: offer replaces recommendation badge in the same visual slot */

/* Offer replaces recommendation badge */
.plan-card .highlight-badge,
.bundle-card .highlight-badge,
.law-price-card .highlight-badge,
.law-compare-plan-card .highlight-badge,
.plan-card .offer-badge,
.bundle-card .offer-badge,
.law-price-card .offer-badge,
.law-compare-plan-card .offer-badge {
  top: 16px;
  right: 16px;
  z-index: 3;
}

.plan-card:has(.offer-badge),
.bundle-card:has(.offer-badge),
.law-price-card:has(.offer-badge),
.law-compare-plan-card:has(.offer-badge) {
  padding-top: 22px;
}

@supports not selector(:has(*)) {
  .plan-card .offer-badge,
  .bundle-card .offer-badge,
  .law-price-card .offer-badge,
  .law-compare-plan-card .offer-badge {
    top: 16px;
    right: 16px;
  }
}

/* WhatsApp visibility by device */
.whatsapp-visibility-all {
  display: grid;
}
.whatsapp-visibility-mobile,
.whatsapp-visibility-desktop {
  display: none;
}
@media (max-width: 760px) {
  .whatsapp-visibility-mobile {
    display: grid;
  }
}
@media (min-width: 761px) {
  .whatsapp-visibility-desktop {
    display: grid;
  }
}

/* About and FAQ SEO pages */
.about-content-section,
.faq-content-section {
  padding: 56px 0;
  background: #f6f9ff;
}
.about-content-shell,
.faq-content-shell {
  max-width: 1100px;
}
.about-card-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-bottom: 22px;
}
.about-info-card {
  padding: 24px;
  border-radius: 24px;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
}
.about-info-card i {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: #eef4ff;
  color: var(--primary-dark);
  margin-bottom: 14px;
}
.about-info-card h2 {
  margin: 0 0 8px;
  color: var(--ink);
  font-size: 1.15rem;
}
.about-info-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}
.about-story-card {
  display: grid;
  gap: 16px;
  padding: clamp(24px, 4vw, 42px);
  border-radius: 28px;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: var(--shadow-md);
}
.about-story-card h2 {
  margin: 0 0 8px;
  color: var(--ink);
}
.about-story-card p {
  margin: 0;
  color: var(--text);
  line-height: 1.7;
}
.faq-list {
  display: grid;
  gap: 12px;
  max-width: 940px;
  margin: 0 auto;
}
.faq-item {
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}
.faq-item summary {
  cursor: pointer;
  padding: 18px 22px;
  color: var(--ink);
  font-weight: 900;
  list-style: none;
}
.faq-item summary::-webkit-details-marker {
  display: none;
}
.faq-item summary::after {
  content: '+';
  float: right;
  color: var(--primary-dark);
  font-weight: 950;
}
.faq-item[open] summary::after {
  content: '–';
}
.faq-item p {
  margin: 0;
  padding: 0 22px 20px;
  color: var(--muted);
  line-height: 1.65;
}
@media (max-width: 860px) {
  .about-card-grid {
    grid-template-columns: 1fr;
  }
}

/* Hosting annual/monthly billing switch */
.hosting-billing-toggle {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  margin: 0 0 16px;
}
.hosting-billing-toggle > span {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.22);
  color: #fff;
  font-size: .78rem;
  font-weight: 950;
}
.billing-switch {
  display: inline-flex;
  padding: 5px;
  border-radius: 999px;
  background: rgba(255,255,255,.95);
  border: 1px solid rgba(255,255,255,.35);
  box-shadow: 0 14px 34px rgba(1,15,40,.16);
}
.billing-switch button {
  border: 0;
  border-radius: 999px;
  padding: 9px 14px;
  background: transparent;
  color: var(--muted);
  font-weight: 900;
  cursor: pointer;
}
.billing-switch button.is-active {
  background: var(--primary);
  color: #fff;
}
.annual-badge {
  position: absolute;
  top: 16px;
  left: 16px;
  display: inline-flex;
  padding: 7px 11px;
  border-radius: 999px;
  background: linear-gradient(135deg, #10b981, #0b5fff);
  color: #fff;
  font-size: .74rem;
  font-weight: 950;
  z-index: 3;
  box-shadow: 0 12px 26px rgba(11,95,255,.22);
}
.billing-note {
  margin: -4px 0 12px !important;
  color: var(--muted) !important;
  font-size: .78rem !important;
  font-weight: 800;
  line-height: 1.25;
}
.plan-price [data-price-value] {
  display: inline-block;
}
@media (max-width: 760px) {
  .hosting-billing-toggle {
    align-items: stretch;
    justify-content: flex-start;
    flex-direction: column;
  }
  .billing-switch {
    width: 100%;
  }
  .billing-switch button {
    flex: 1;
  }
}

/* Recenter menu anchor targets */
#top,
#dominios,
#web-hosting,
#soluciones-digitales,
#vps,
#infraestructura,
#cotizar,
#clientes,
#planes-abogados,
#cotizar-abogados {
  scroll-margin-top: calc(var(--header-h) + 18px);
}
