html{scroll-behavior:smooth;scroll-padding-top:100px}img{max-width:100%;height:auto}main:focus{outline:0}.primary-nav__list .sub-menu{list-style:none;padding:12px}.hl-table-editor{overflow:auto}a:focus-visible,button:focus-visible{outline:3px solid #f2a625;outline-offset:4px}@media(max-width:767px){.email-comparison-table{font-size:13px}.email-comparison-table td,.email-comparison-table th{overflow-wrap:anywhere}.hero-v20__copy{min-width:0}.server-card{min-width:0}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
/* Mobile QA: the legacy logo width forced the menu outside narrow viewports. */
@media(max-width:1180px){
 .navbar__inner{grid-template-columns:minmax(0,1fr) 44px;gap:12px;}
 .brand{min-width:0;max-width:100%;padding-right:0;margin-right:0;}
 .brand::after{display:none;}
 .brand a{min-width:0;max-width:100%;}
 .brand__default-logo,.custom-logo{max-width:100%;width:auto;height:auto;max-height:58px;}
 .menu-toggle{width:44px;min-width:44px;min-height:44px;margin:0;justify-self:end;}
 .primary-nav{position:static;inset:auto;width:100%;box-sizing:border-box;}
 .primary-nav__list{padding:8px 0;}
 .primary-nav__list a{min-height:44px;display:flex;align-items:center;}
}
@media(max-width:480px){.topbar__links--v10{gap:10px;flex-wrap:wrap;}.topbar__links--v10 a{font-size:11px;}.navbar__inner{min-height:76px;}}
/* Keep all comparison columns readable without requiring horizontal swipes. */
@media(max-width:820px){
 .email-comparison-table{min-width:0;width:100%;table-layout:fixed;font-size:13px;line-height:1.45;}
 .email-comparison-table th,.email-comparison-table td{padding:12px 8px;white-space:normal;overflow-wrap:anywhere;vertical-align:top;}
 .email-comparison-table th:first-child,.email-comparison-table td:first-child{width:44%;}
 .email-comparison-table th:nth-child(2),.email-comparison-table th:nth-child(3),.email-comparison-table td:nth-child(2),.email-comparison-table td:nth-child(3){width:28%;}
 .email-comparison-table th{font-size:12px;line-height:1.4;}
}
@media(max-width:360px){
 .email-comparison-table th{font-size:11px;letter-spacing:-.02em;padding:12px 4px;overflow-wrap:normal;}
 .email-comparison-table th:first-child,.email-comparison-table td:first-child{width:40%;}
 .email-comparison-table th:nth-child(2),.email-comparison-table th:nth-child(3),.email-comparison-table td:nth-child(2),.email-comparison-table td:nth-child(3){width:30%;}
}
/* v1.2: the supplied anniversary logo keeps its exact colors and transparency. */
.brand{width:300px;max-width:100%;padding:0;margin:0;background:transparent;border:0;border-radius:0;box-shadow:none;box-sizing:border-box;}
.brand::after{display:none;}
.brand a{display:block;max-width:100%;}
.brand .brand__default-logo,.brand .custom-logo{display:block;width:100%;max-width:100%;height:auto;max-height:none;object-fit:contain;filter:none;}
.site-footer .footer-logo{display:block;width:360px;max-width:100%;padding:8px 12px;background:#fff;border:1px solid #dfe7df;border-radius:12px;box-sizing:border-box;}
.site-footer .footer-logo img{display:block;width:100%;max-width:100%;height:auto;max-height:none;object-fit:contain;filter:none;}
@media(max-width:1180px){.brand{width:100%;max-width:330px;}.navbar__inner{padding-top:10px;padding-bottom:10px;}}

/* Light navigation pairs with the anniversary logo’s original black lettering. */
.site-header .navbar {
  background: #f8faf6;
  border-bottom: 2px solid #8fc641;
}
.site-header .navbar::before { display: none; }
.site-header .primary-nav__list a { color: #171e19; }
.site-header .primary-nav__list a:hover,
.site-header .primary-nav__list .current-menu-item > a,
.site-header .primary-nav__list .current_page_item > a { color: #176632; }
.site-header .menu-toggle span:not(.screen-reader-text) { background: #171e19; }
.site-header .topbar__links--v10 a { color: #17251a; }
@media (max-width: 1180px) {
  .site-header .primary-nav {
    background: #fff;
    border: 1px solid #dce6d9;
    box-shadow: none;
  }
  .site-header .navbar__inner { padding-block: 4px; }
}

.hl-home-carousel.is-ready .hl-carousel-track { display: grid; }
.hl-home-carousel.is-ready .hl-carousel-panel { grid-area: 1 / 1; min-width: 0; visibility: hidden; }
.hl-home-carousel.is-ready .hl-carousel-panel.is-current { visibility: visible; }
.hl-carousel-promo { display: grid; align-items: center; min-height: 380px; background: #eaf4e5; color: #162d22; }
.hl-promo-layout { display: flex; align-items: center; gap: clamp(24px, 6vw, 88px); padding-block: clamp(48px, 7vw, 100px); }
.hl-promo-layout > div { flex: 1; min-width: 0; }
.hl-promo-layout h2 { color: inherit; font-size: clamp(2rem, 4.8vw, 4.25rem); overflow-wrap: anywhere; }
.hl-promo-layout p { max-width: 56ch; }
.hl-promo-eyebrow { color: #206341; font-size: .8rem; font-weight: 800; letter-spacing: .08em; }
.hl-promo-image { width: min(42%, 480px); height: auto; object-fit: contain; }
.hl-carousel-controls:not([hidden]) { display: flex; align-items: center; justify-content: center; gap: 4px; padding: 6px 0; background: #f8faf6; }
.hl-carousel-controls button { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: transparent; color: #173b29; cursor: pointer; font-size: 1.65rem; }
.hl-carousel-controls button:hover { background: #e1eedf; }
.hl-carousel-controls [data-hl-dot] span { width: 9px; height: 9px; border: 1px solid #416451; border-radius: 50%; }
.hl-carousel-controls [aria-pressed="true"] span { background: #246542; }
@media (max-width: 767px) {
  .hl-promo-layout { flex-direction: column; align-items: flex-start; }
  .hl-promo-image { width: min(100%, 400px); }
}

/* Black Month promotion */
.hl-carousel-promo {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #081710;
  color: #f8fff6;
}
.hl-carousel-promo .hl-promo-image {
  position: absolute;
  inset: 0 0 0 auto;
  width: 56%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: -2;
}
.hl-carousel-promo::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, #081710 35%, #081710 43%, transparent 69%),
    radial-gradient(ellipse at 25% 80%, #1b482a, transparent 65%);
}
.hl-promo-layout {
  position: relative;
  padding-block: clamp(40px, 6vw, 88px);
}
.hl-promo-layout > div { flex: 0 1 49%; }
.hl-promo-layout h2 {
  margin: 0 0 18px;
  font: 850 clamp(1.45rem, 3vw, 3rem)/1.08 system-ui, sans-serif;
  letter-spacing: -.045em;
  text-wrap: balance;
}
.hl-promo-layout .hl-promo-offer { margin: 0 0 18px; }
.hl-promo-offer strong {
  display: block;
  color: #c3f36a;
  font: 950 clamp(5rem, 11vw, 10rem)/.88 system-ui, sans-serif;
  letter-spacing: -.09em;
}
.hl-promo-offer span {
  display: block;
  margin-top: 10px;
  font: 750 clamp(1rem, 1.9vw, 1.65rem)/1.2 system-ui, sans-serif;
}
.hl-promo-layout p { line-height: 1.5; }
.hl-promo-layout .btn { background: #c3f36a; color: #122114; }
.hl-promo-layout .hl-promo-terms { margin: 14px 0 0; font-size: .83rem; color: #d7e8d6; }
@media (max-width: 767px) {
  .hl-carousel-promo { display: flex; flex-direction: column; align-items: stretch; }
  .hl-carousel-promo::before { background: radial-gradient(ellipse at top left, #1b482a, transparent 75%); }
  .hl-carousel-promo .hl-promo-image {
    position: static;
    order: 2;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    z-index: auto;
  }
  .hl-promo-layout { padding-block: 32px; }
}

@media (prefers-reduced-motion: no-preference) {
  .hl-home-carousel.is-ready .hl-carousel-panel.is-current { animation: hl-slide-in .42s ease-out; }
  @keyframes hl-slide-in {
    from { opacity: .55; transform: translateX(12px); }
    to { opacity: 1; transform: translateX(0); }
  }
  .hl-home-carousel { overflow: clip; }
}

/* Give the help center a recognizable treatment in the home and header. */
.site-header .topbar a[href="https://ayuda.hostingleon.com"],
.site-header .topbar a[href="https://ayuda.hostingleon.com/"] {
  background: #183b29;
  color: #fff;
  border: 1px solid #183b29;
  border-radius: 8px;
  padding: 7px 12px;
}
.site-header .topbar a[href="https://ayuda.hostingleon.com"]:hover,
.site-header .topbar a[href="https://ayuda.hostingleon.com/"]:hover { background: #255a40; color: #fff; }
.hl-help-ticker {
  display: flex;
  align-items: stretch;
  background: linear-gradient(100deg, #10291e, #154438 60%, #10291e);
  border-bottom: 1px solid #679649;
  color: #fff;
  min-height: 42px;
  font: 700 .86rem/1.2 system-ui, sans-serif;
}
.hl-help-ticker-window { flex: 1; min-width: 0; overflow: hidden; align-self: center; }
.hl-help-ticker-group { display: flex; flex-wrap: wrap; justify-content: center; row-gap: 6px; padding-block: 7px; }
.hl-help-ticker-group span { padding-inline: 14px; overflow-wrap: anywhere; }
.hl-help-ticker-group b { margin-inline-start: 16px; color: #c3f36a; }
.hl-help-ticker.is-moving .hl-help-ticker-track {
  display: flex;
  width: max-content;
  animation: hl-ticker-scroll var(--hl-ticker-duration, 21s) linear infinite;
}
.hl-help-ticker.is-moving .hl-help-ticker-group { flex: none; flex-wrap: nowrap; white-space: nowrap; }
@keyframes hl-ticker-scroll { to { transform: translateX(-50%); } }
.hl-help-ticker:hover .hl-help-ticker-track,
.hl-help-ticker:focus-within .hl-help-ticker-track,
.hl-help-ticker.is-paused .hl-help-ticker-track { animation-play-state: paused; }
.hl-help-ticker > button:not([hidden]) {
  flex: 0 0 44px;
  background: transparent;
  border: 0;
  color: #fff;
  cursor: pointer;
}
.hl-help-cta {
  margin: 28px auto 0;
  padding: clamp(22px, 4vw, 40px);
  text-align: center;
  background: #122e22;
  color: #fff;
  border-radius: 18px;
}
.hl-help-cta p { margin: 0 0 14px; color: #fff; }
.hl-help-cta .hl-help-cta-button {
  min-height: 52px;
  padding: 13px clamp(14px, 4vw, 32px);
  background: #c3f36a;
  color: #10291e;
  font-size: clamp(1rem, 2vw, 1.2rem);
  white-space: normal;
}
.hl-help-cta .hl-help-cta-button:hover { background: #dbffa4; color: #10291e; }
@media (prefers-reduced-motion: reduce) {
  .hl-help-ticker.is-moving .hl-help-ticker-track { animation: none; }
  .hl-help-ticker > button:not([hidden]) { display: none; }
}