:root {
    --sh-navy: #071226;
    --sh-navy-2: #0a1933;
    --sh-panel: #0e203f;
    --sh-blue: #3978ff;
    --sh-cyan: #35d8ff;
    --sh-violet: #8057ff;
    --sh-mint: #a9ffcb;
    --sh-ink: #0a1830;
    --sh-muted: #61708a;
    --sh-paper: #f4f7fb;
    --sh-line: #dfe6ef;
    --sh-white: #fff;
    --sh-font-body: "DM Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --sh-font-heading: Manrope, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* ---------------------------------------------------------------------------
   Tokens de diseño de Nexus.

   El CSS de Nexus está escrito sobre una capa de tokens —`var(--text)`,
   `var(--rounding-md)`, `var(--grayscale-lifted)`…— que esta instalación no
   declara en ninguna parte: 38 variables usadas en 367 declaraciones, con cero
   definiciones entre theme.min.css y all.min.css.

   Una declaración que apoya su valor en una variable indefinida es inválida y se
   descarta, así que todas esas reglas caían en silencio. De ahí venía buena
   parte de lo que se veía «sin integrar»: bordes y radios que no llegaban, y
   sobre todo `.btn-default:hover`, que fija `color:#fff` y toma el fondo de
   `var(--grayscale-lifted)`; al no resolverse el fondo volvía a transparente y
   el botón desaparecía al pasar el cursor.

   Se declaran aquí con la paleta del sitio, de modo que el CSS de Nexus funcione
   como fue escrito en lugar de pelearlo regla por regla.
   --------------------------------------------------------------------------- */
:root {
    --text: #0a1830;
    --text-lifted: #34455f;
    --text-muted: #61708a;
    --text-accented: #071226;
    --text-inverted: #fff;

    --bg: #fff;
    --bg-muted: #f8faff;
    --bg-lifted: #f4f7fb;
    --bg-accented: #eaf1fb;
    --bg-inverted: #071226;

    --border: #d8e2ee;
    --border-muted: #eaf0f7;
    --border-lifted: #c4d1e1;
    --border-accented: #93a8c4;

    --grayscale: #6b7a92;
    --grayscale-lifted: #8695ab;
    --grayscale-accented: #4a5668;

    --neutral: #64738a;
    --neutral-lifted: #7d8b9f;
    --neutral-accented: #4a5668;

    --error: #d1344b;
    --error-lifted: #e0576b;
    --success-accented: #0f7650;
    --warning-accented: #a8730f;
    --info-accented: #0d688f;
    --notice: #8057ff;
    --notice-lifted: #9b7aff;

    --rounding-sm: 6px;
    --rounding-md: 8px;
    --rounding-lg: 14px;
    --letter-spacing: normal;
    --disabled-opacity: .55;

    --emerald-300: #6ee7b7;
    --teal-300: #5eead4;
    --teal-400: #2dd4bf;
    --pink-400: #f472b6;
    --yellow-200: #fde68a;
    --yellow-300: #fcd34d;
}

* { box-sizing: border-box; }
body { overflow-x: hidden; color: var(--sh-ink); font-family: var(--sh-font-body); }
.sh-public-page { margin: 0; background: var(--sh-navy); }
.sh-skip-link { position: fixed; z-index: 9999; top: 12px; left: 12px; padding: 12px 16px; border-radius: 8px; color: var(--sh-navy) !important; background: #fff; font-weight: 700; transform: translateY(-150%); transition: transform .15s; }
.sh-skip-link:focus { transform: translateY(0); }
.sh-container { width: min(1240px, calc(100% - 48px)); margin-inline: auto; }
#sh-main { display: block; width: 100%; overflow: hidden; }
.sh-header { position: relative; z-index: 30; border-bottom: 1px solid rgba(255,255,255,.09); color: #fff; background: rgba(7,18,38,.94); backdrop-filter: blur(18px); }
.sh-nav { display: flex; min-height: 82px; align-items: center; gap: 32px; }
.sh-brand { display: inline-flex; flex-shrink: 0; align-items: center; }
.sh-brand img { display: block; width: 225px; height: 50px; object-fit: contain; object-position: left center; }
.sh-menu { display: flex; align-self: stretch; align-items: stretch; gap: 3px; }
.sh-menu-item { display: flex; position: relative; align-items: stretch; }
.sh-menu-trigger { display: inline-flex; padding: 0 12px; align-items: center; gap: 6px; border: 0; color: #b9c5da; background: transparent; font: 700 12px var(--sh-font-body); white-space: nowrap; cursor: pointer; }
.sh-menu-trigger span { color: #62728d; transition: transform .2s; }
.sh-menu-item:hover .sh-menu-trigger, .sh-menu-item:focus-within .sh-menu-trigger, .sh-menu-trigger[aria-expanded="true"] { color: #fff; }
.sh-menu-trigger[aria-expanded="true"] span { transform: rotate(180deg); }
.sh-submenu { display: none; position: absolute; z-index: 80; top: calc(100% - 2px); left: -18px; width: min(920px, calc(100vw - 48px)); padding: 22px; grid-template-columns: 225px 1fr; gap: 18px; border: 1px solid rgba(122,153,204,.22); border-top: 3px solid var(--sh-cyan); border-radius: 0 0 18px 18px; background: #0b1a35; box-shadow: 0 30px 70px rgba(0,0,0,.42); }
.sh-submenu-compact { width: min(660px, calc(100vw - 48px)); }.sh-submenu-right { right: -20px; left: auto; }
.sh-menu-item:hover > .sh-submenu, .sh-submenu.is-open { display: grid; }
.sh-submenu-intro { padding: 20px; border-radius: 13px; background: linear-gradient(145deg, rgba(53,216,255,.11), rgba(57,120,255,.08)); }
.sh-submenu-intro strong { display: block; margin-bottom: 9px; color: #fff; font: 700 17px var(--sh-font-heading); }.sh-submenu-intro span { color: #91a1b9; font-size: 11px; line-height: 1.6; }
.sh-submenu-links { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }.sh-submenu-compact .sh-submenu-links { grid-template-columns: 1fr 1fr; }
.sh-submenu-links a { display: flex; position: relative; min-width: 0; min-height: 72px; padding: 13px 13px 13px 52px; justify-content: center; flex-direction: column; border: 1px solid transparent; border-radius: 11px; text-decoration: none !important; }
/* El icono estaba clavado a `top: 15px` mientras el texto se centra vertical-
   mente en el enlace. En cuanto el título ocupa dos líneas —«Registrar un
   dominio»— el texto se recentra y el icono queda descolgado hacia arriba. Se
   centra con el mismo criterio que el contenido. */
.sh-submenu-links a::before, .sh-submenu-groups a::before { display: grid; position: absolute; top: 50%; left: 13px; width: 28px; height: 28px; place-items: center; content: "↗"; border: 1px solid rgba(53,216,255,.2); border-radius: 8px; color: var(--sh-cyan); background: rgba(53,216,255,.07); font-size: 12px; transform: translateY(-50%); }
.sh-submenu-links a:hover, .sh-submenu-links a:focus-visible, .sh-submenu-groups a:hover, .sh-submenu-groups a:focus-visible { border-color: rgba(53,216,255,.18); background: rgba(255,255,255,.06); transform: translateY(-1px); }
/* Las descripciones se cortaban con puntos suspensivos —«Email · Calendar ·
   Cont…»— porque estaban forzadas a una sola línea. Ahora envuelven. */
.sh-submenu-links b { color: #eef4ff; font-size: 12px; }.sh-submenu-links a > span { margin-top: 5px; color: #91a1b9; font-size: 10px; line-height: 1.45; overflow-wrap: anywhere; }
.sh-submenu-wide { width: min(940px, calc(100vw - 48px)); grid-template-columns: 1fr; }
.sh-submenu-infrastructure { right: auto; left: 50%; transform: translateX(-50%); }
.sh-submenu-groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.sh-submenu-groups-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sh-submenu-groups section { min-width: 0; padding: 10px; border-radius: 12px; background: rgba(255,255,255,.025); }
.sh-submenu-groups section > strong { display: block; margin: 3px 10px 8px; color: var(--sh-cyan); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.sh-submenu-groups a { display: flex; position: relative; min-width: 0; min-height: 64px; padding: 10px 10px 10px 48px; justify-content: center; flex-direction: column; border: 1px solid transparent; border-radius: 9px; text-decoration: none !important; }
.sh-submenu-groups a:hover, .sh-submenu-groups a:focus-visible { background: rgba(255,255,255,.06); }
.sh-submenu-groups a b { color: #eef4ff; font-size: 11px; }
.sh-submenu-groups a span { margin-top: 3px; color: #91a1b9; font-size: 9px; line-height: 1.4; overflow-wrap: anywhere; }
.sh-submenu a.sh-submenu-promo { border-color: rgba(53,216,255,.2); background: linear-gradient(135deg, rgba(53,216,255,.12), rgba(57,120,255,.12)); }
.sh-submenu a.sh-submenu-promo::before { content: "→"; color: #071226; background: var(--sh-cyan); }
.sh-mobile-login { display: none; }
.sh-mobile-languages { display: none; }
.sh-login { display: inline-flex; align-items: center; gap: 8px; color: #b9c5da !important; font-size: 12px; font-weight: 700; white-space: nowrap; text-decoration: none !important; transition: color .2s; }
.sh-login:hover { color: #fff !important; }
.sh-nav-actions { display: flex; margin-left: auto; align-items: center; gap: 20px; }
/* Icons ride along with the labels and only take over at constrained widths. */
.sh-action-icon { display: none; width: 19px; height: 19px; flex-shrink: 0; }
.sh-action-label { white-space: nowrap; }
.sh-language-switch { display: flex; align-items: center; gap: 5px; color: #60718e; font-size: 10px; font-weight: 700; }
.sh-language-switch a { color: #8493aa; text-decoration: none; }.sh-language-switch a[aria-current="true"] { color: var(--sh-cyan); }
.sh-currency-switch { margin: 0; }
.sh-currency-switch select { min-width: 66px; min-height: 38px; padding: 0 25px 0 10px; border: 1px solid rgba(255,255,255,.16); border-radius: 8px; color: #dfe9f8; background-color: rgba(255,255,255,.06); font: 700 10px var(--sh-font-body); cursor: pointer; }
.sh-currency-switch select option { color: var(--sh-ink); background: #fff; }
.sh-nav-cta { display: inline-flex; min-height: 42px; padding: 0 15px; align-items: center; gap: 8px; border: 1px solid rgba(53,216,255,.36); border-radius: 9px; color: #071226 !important; background: var(--sh-cyan); font-size: 10px; font-weight: 800; white-space: nowrap; text-decoration: none !important; }
.sh-nav-cta:hover, .sh-nav-cta:focus-visible { color: #071226 !important; background: #77e9ff; transform: translateY(-1px); }
.sh-cart-link { display: inline-grid; position: relative; width: 40px; height: 40px; place-items: center; border: 1px solid rgba(255,255,255,.16); border-radius: 9px; color: #dfe9f8 !important; text-decoration: none !important; }
.sh-action-icon-always { display: block; width: 18px; height: 18px; }
.sh-cart-count { display: grid; position: absolute; top: -7px; right: -7px; min-width: 19px; height: 19px; padding: 0 5px; place-items: center; border-radius: 999px; color: #061326; background: var(--sh-cyan); font-size: 9px; font-weight: 800; }
.sh-menu-button { display: none; width: 42px; height: 42px; margin-left: auto; padding: 9px; border: 1px solid rgba(255,255,255,.18); border-radius: 10px; background: transparent; }
.sh-menu-button > span:not(.sr-only) { display: block; height: 2px; margin: 4px 0; background: #fff; }

.sh-hero { position: relative; min-height: 820px; padding: 112px 0 0; color: #fff; background: radial-gradient(circle at 76% 35%, rgba(57,120,255,.18), transparent 28%), radial-gradient(circle at 43% 22%, rgba(128,87,255,.12), transparent 24%), var(--sh-navy); }
.sh-grid-lines { position: absolute; inset: 0; opacity: .16; background-image: linear-gradient(rgba(130,158,200,.2) 1px, transparent 1px), linear-gradient(90deg, rgba(130,158,200,.2) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(to bottom, #000, transparent 82%); }
.sh-hero-grid { display: grid; position: relative; z-index: 2; grid-template-columns: minmax(0, 1.05fr) minmax(0, .78fr); align-items: center; gap: 88px; }
.sh-hero-copy, .sh-console { min-width: 0; }
.sh-availability, .sh-status { display: inline-flex; align-items: center; gap: 9px; color: #aab9d1; font-size: 11px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.sh-availability i, .sh-status i { width: 8px; height: 8px; border-radius: 50%; background: var(--sh-mint); box-shadow: 0 0 15px var(--sh-mint); }
.sh-hero h1 { max-width: 790px; margin: 24px 0; font-family: var(--sh-font-heading); font-size: clamp(50px, 5.35vw, 76px); font-weight: 700; line-height: 1.03; letter-spacing: -.055em; }
.sh-hero h1 span, .sh-final-cta h2 span { color: transparent; background: linear-gradient(90deg, var(--sh-cyan), #7398ff 53%, #ad83ff); -webkit-background-clip: text; background-clip: text; }
.sh-hero-copy > p { max-width: 680px; color: #aab7cc; font-size: 18px; line-height: 1.7; }
.sh-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.sh-button { display: inline-flex; min-height: 54px; padding: 0 22px; justify-content: center; align-items: center; gap: 20px; border: 1px solid transparent; border-radius: 10px; font-size: 13px; font-weight: 700; text-decoration: none !important; transition: transform .2s, box-shadow .2s; }
.sh-button:hover { transform: translateY(-2px); }
.sh-button-primary { color: #061326 !important; background: linear-gradient(135deg, var(--sh-cyan), #76edff); box-shadow: 0 15px 40px rgba(53,216,255,.17); }
.sh-button-secondary { color: #fff !important; border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.04); }
.sh-proof { display: grid; max-width: 680px; margin-top: 60px; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(255,255,255,.1); }
.sh-proof div { display: flex; padding: 24px 18px 0 0; flex-direction: column; }
.sh-proof strong { font-family: var(--sh-font-heading); font-size: 22px; }.sh-proof span { margin-top: 5px; color: #7f8da6; font-size: 11px; }
.sh-console { position: relative; overflow: hidden; border: 1px solid rgba(111,151,221,.25); border-radius: 18px; background: rgba(10,25,51,.8); box-shadow: 0 45px 100px rgba(0,0,0,.38); backdrop-filter: blur(18px); }
.sh-console:after { position: absolute; width: 280px; height: 280px; right: -140px; bottom: -150px; content: ""; border-radius: 50%; background: rgba(53,216,255,.14); filter: blur(45px); }
.sh-console-top { display: flex; min-height: 48px; padding: 0 16px; align-items: center; gap: 14px; border-bottom: 1px solid rgba(255,255,255,.08); }
.sh-console-top > span { display: flex; gap: 5px; }.sh-console-top i { width: 7px; height: 7px; border-radius: 50%; background: #52627f; }.sh-console-top i:nth-child(2){background:#3978ff}.sh-console-top i:nth-child(3){background:#35d8ff}
.sh-console-top small { color: #647590; font-family: monospace; }.sh-console-top b { margin-left: auto; padding: 5px 7px; border-radius: 4px; color: var(--sh-mint); background: rgba(169,255,203,.08); font-size: 8px; letter-spacing: .12em; }
.sh-console-body { padding: 32px; }.sh-console-label, .sh-eyebrow { color: var(--sh-cyan); font-size: 10px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.sh-console h2 { margin: 11px 0 0; font-family: var(--sh-font-heading); font-size: 30px; line-height: 1.18; letter-spacing: -.035em; }
.sh-stack-map { position: relative; height: 280px; margin-top: 10px; }
.sh-node { display: grid; position: absolute; z-index: 3; width: 55px; height: 55px; place-items: center; border: 1px solid rgba(94,137,207,.33); border-radius: 14px; color: #91a1bb; background: #0b1a35; font-family: monospace; font-size: 10px; font-weight: 700; box-shadow: 0 12px 30px rgba(0,0,0,.3); }
.sh-node-main { top: 91px; left: calc(50% - 39px); width: 78px; height: 78px; padding: 10px; border-color: rgba(53,216,255,.35); }.sh-node-main img { width: 100%; height: 100%; }
.sh-node.n1 { top: 15px; left: 15px; }.sh-node.n2 { top: 18px; right: 20px; }.sh-node.n3 { bottom: 12px; left: 28px; }.sh-node.n4 { right: 36px; bottom: 8px; }
.sh-map-line { position: absolute; z-index: 1; top: 50%; left: 50%; width: 75%; height: 1px; background: linear-gradient(90deg, transparent, rgba(53,216,255,.65), transparent); transform-origin: center; }.sh-map-line.l1{transform:translate(-50%,-50%) rotate(28deg)}.sh-map-line.l2{transform:translate(-50%,-50%) rotate(-29deg)}.sh-map-line.l3{width:45%;transform:translate(-50%,-50%) rotate(90deg)}
.sh-metrics { display: flex; gap: 26px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.08); color: #71819b; font-size: 10px; }.sh-metrics span { display: flex; align-items: center; gap: 6px; }.sh-metrics i { width: 6px; height: 6px; border-radius: 50%; }.sh-metrics .cyan{background:var(--sh-cyan)}.sh-metrics .green{background:var(--sh-mint)}.sh-metrics b { color: #c7d1e0; }
.sh-tech-strip { display: flex; position: relative; z-index: 2; min-height: 105px; margin-top: 92px; align-items: center; justify-content: space-between; gap: 25px; border-top: 1px solid rgba(255,255,255,.09); color: #586983; }.sh-tech-strip span { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }.sh-tech-strip b { color: #93a1b8; font-size: 13px; }

.sh-solutions { padding: 120px 0; background: #fff; }
.sh-section-heading { display: grid; grid-template-columns: 1.2fr .65fr; align-items: end; gap: 70px; margin-bottom: 55px; }
.sh-section-heading h2, .sh-control h2, .sh-domain h2 { max-width: 760px; margin: 13px 0 0; font-family: var(--sh-font-heading); font-size: clamp(38px, 4vw, 58px); line-height: 1.08; letter-spacing: -.05em; }
.sh-section-heading p { color: var(--sh-muted); line-height: 1.75; }
.sh-solution-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.sh-solution-card { position: relative; min-height: 460px; padding: 34px; overflow: hidden; border: 1px solid var(--sh-line); border-radius: 18px; color: var(--sh-ink) !important; background: #fff; text-decoration: none !important; transition: transform .25s, box-shadow .25s; }
.sh-solution-card:hover { transform: translateY(-5px); box-shadow: 0 30px 70px rgba(15,42,78,.12); }
.sh-card-featured { color: #fff !important; border-color: transparent; background: radial-gradient(circle at 85% 15%, rgba(53,216,255,.2), transparent 30%), var(--sh-navy-2); }
.sh-card-number { color: #71809a; font-family: monospace; font-size: 10px; letter-spacing: .12em; }.sh-card-featured .sh-card-number { color: var(--sh-cyan); }
.sh-card-symbol { display: grid; position: absolute; top: 30px; right: 30px; width: 58px; height: 58px; place-items: center; border: 1px solid #dbe5f1; border-radius: 15px; color: var(--sh-blue); background: #f5f8fd; font-family: var(--sh-font-heading); font-weight: 800; }.sh-card-featured .sh-card-symbol { border-color: rgba(53,216,255,.22); color: var(--sh-cyan); background: rgba(53,216,255,.08); }
.sh-solution-card h3 { margin: 80px 0 12px; font-family: var(--sh-font-heading); font-size: 32px; letter-spacing: -.04em; }.sh-solution-card p { max-width: 490px; color: var(--sh-muted); line-height: 1.65; }.sh-card-featured p { color: #9faec5; }
.sh-solution-card ul { display: flex; padding: 22px 0 0; flex-wrap: wrap; gap: 10px; list-style: none; }.sh-solution-card li { padding: 7px 10px; border-radius: 6px; color: #53637b; background: #f2f5f9; font-size: 10px; }.sh-card-featured li { color: #a9b8ce; background: rgba(255,255,255,.06); }
.sh-solution-card > b { display: flex; position: absolute; right: 34px; bottom: 34px; left: 34px; justify-content: space-between; padding-top: 19px; border-top: 1px solid var(--sh-line); font-size: 12px; }.sh-card-featured > b { border-color: rgba(255,255,255,.12); }

.sh-live-plans { padding: 120px 0; background: var(--sh-paper); }
.sh-anchor-target { scroll-margin-top: 24px; }
.sh-plan-tabs { display: flex; margin-bottom: 28px; flex-wrap: wrap; gap: 8px; }
.sh-plan-tab { min-height: 44px; padding: 0 17px; border: 1px solid #ced9e7; border-radius: 999px; color: #4c5d76; background: #fff; font: 700 12px var(--sh-font-body); cursor: pointer; }
.sh-plan-tab:hover { border-color: var(--sh-blue); color: var(--sh-blue); }
.sh-plan-tab.is-active { border-color: var(--sh-navy); color: #fff; background: var(--sh-navy); }
.sh-live-plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; transition: opacity .2s; }
.sh-live-plan-grid.sh-plan-count-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sh-live-plan-grid.sh-plan-count-4 .sh-live-plan-card { min-height: 620px; padding: 24px; }
.sh-live-plan-grid.sh-plan-count-4 .sh-live-plan-card h3 { font-size: 22px; }
.sh-live-plan-grid[aria-busy="true"] { opacity: .55; }
.sh-live-plan-card { display: flex; min-height: 650px; padding: 30px; border: 1px solid #d9e2ed; border-radius: 18px; flex-direction: column; background: #fff; box-shadow: 0 15px 45px rgba(22,47,83,.06); }
.sh-live-plan-type { color: var(--sh-blue); font: 700 10px monospace; letter-spacing: .12em; text-transform: uppercase; }
.sh-live-plan-card h3 { margin: 22px 0 10px; font: 700 25px/1.2 var(--sh-font-heading); letter-spacing: -.035em; }
.sh-live-plan-card > p { min-height: 52px; color: var(--sh-muted); line-height: 1.6; }
.sh-plan-feature-heading { display: block; margin-bottom: 4px; color: var(--sh-ink); font-size: 12px; }
.sh-plan-features { margin-bottom: 25px; }
.sh-plan-feature-section + .sh-plan-feature-section { margin-top: 19px; }
.sh-plan-feature-section h4 { margin: 0 0 8px; color: var(--sh-ink); font: 700 13px/1.35 var(--sh-font-heading); }
.sh-plan-feature-section ul { margin-bottom: 0; }
.sh-plan-details { margin-top: 20px; border: 1px solid var(--sh-line); border-radius: 10px; background: #f8faff; }
.sh-plan-details summary { padding: 13px 15px; color: var(--sh-blue); font-size: 12px; font-weight: 800; cursor: pointer; }
.sh-plan-details > div { padding: 2px 15px 15px; border-top: 1px solid var(--sh-line); }
.sh-live-plan-price { display: flex; margin: 18px 0; padding: 20px 0; align-items: baseline; gap: 7px; border-top: 1px solid var(--sh-line); border-bottom: 1px solid var(--sh-line); }
.sh-live-plan-price strong { font: 700 27px var(--sh-font-heading); }.sh-live-plan-price span { color: var(--sh-muted); font-size: 11px; }
.sh-live-plan-card ul { padding: 0; margin: 0 0 25px; list-style: none; }.sh-live-plan-card li { position: relative; margin: 10px 0; padding-left: 20px; color: #4d5d74; font-size: 12px; }.sh-live-plan-card li:before { position: absolute; left: 0; content: "✓"; color: var(--sh-blue); font-weight: 800; }
.sh-button-plan { width: 100%; margin-top: auto; justify-content: space-between; color: #fff !important; background: var(--sh-blue); }
.sh-landing-plans { padding: 110px 0; background: var(--sh-paper); }
.sh-section-heading-single { display: block; max-width: 780px; }
.sh-resource-slider { position: relative; }
.sh-resource-controls { display: flex; margin: -12px 0 18px; justify-content: flex-end; gap: 8px; }
.sh-resource-controls button { display: grid; width: 44px; height: 44px; place-items: center; border: 1px solid #ced9e7; border-radius: 10px; color: var(--sh-navy); background: #fff; font-size: 18px; cursor: pointer; }
.sh-resource-controls button:hover, .sh-resource-controls button:focus-visible { border-color: var(--sh-blue); color: #fff; background: var(--sh-blue); }
.sh-resource-controls button:disabled { opacity: .4; cursor: default; }
.sh-resource-plan-track { display: flex; padding: 5px 2px 22px; gap: 16px; overflow-x: auto; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-color: #a9b9cf transparent; scrollbar-width: thin; }
.sh-resource-plan-card { min-width: min(360px, calc(100vw - 56px)); min-height: 610px; scroll-snap-align: start; }
.sh-resource-plan-card .sh-plan-feature-section:first-child ul { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.sh-resource-plan-card .sh-plan-feature-section:first-child li { margin: 0; padding: 10px 8px 10px 25px; border-radius: 8px; background: #f5f8fc; }

.sh-action-section { padding: 100px 0; background: var(--sh-paper); }
.sh-action-layout { display: grid; grid-template-columns: .8fr 1.2fr; align-items: start; gap: 70px; }
.sh-action-copy h2 { margin: 14px 0 18px; font: 700 clamp(36px, 4vw, 56px)/1.08 var(--sh-font-heading); letter-spacing: -.05em; }
.sh-action-copy p { color: var(--sh-muted); font-size: 16px; line-height: 1.75; }
.sh-integrated-form { display: flex; padding: 34px; flex-direction: column; gap: 11px; border: 1px solid var(--sh-line); border-radius: 18px; background: #fff; box-shadow: 0 22px 60px rgba(22,47,83,.08); }
.sh-integrated-form label { margin-top: 5px; color: #2c3f5b; font-size: 12px; font-weight: 800; }
.sh-integrated-form input, .sh-integrated-form textarea { width: 100%; min-height: 52px; padding: 12px 14px; border: 1px solid #c7d4e3; border-radius: 9px; color: var(--sh-ink); background: #fff; font: 500 14px var(--sh-font-body); }
.sh-integrated-form textarea { min-height: 150px; resize: vertical; }
.sh-integrated-form input:hover, .sh-integrated-form textarea:hover { border-color: #9db1ca; }
.sh-integrated-form .sh-button { margin-top: 10px; border: 0; cursor: pointer; }
.sh-integrated-form > a { margin-top: 5px; color: var(--sh-blue); font-size: 12px; font-weight: 800; text-align: center; }
.sh-domain-input-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; }
.sh-domain-input-row .sh-button { min-width: 175px; margin-top: 0; }
.sh-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.sh-form-grid > div { display: flex; flex-direction: column; gap: 11px; }
.sh-form-captcha { padding: 12px; border-radius: 9px; background: #f6f9fd; text-align: center; }
.sh-use-cases { background: #f8faff; }
.sh-use-case-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sh-use-case-grid article { padding: 30px; border: 1px solid var(--sh-line); border-radius: 16px; background: #fff; }
.sh-use-case-grid h3 { margin: 0 0 12px; font: 700 21px/1.25 var(--sh-font-heading); }
.sh-use-case-grid p { margin: 0; color: var(--sh-muted); line-height: 1.7; }

a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid var(--sh-mint); outline-offset: 3px; }

/* Transactional and authenticated surfaces */
.sh-auth { display: grid; max-width: 960px; margin: 56px auto; grid-template-columns: .9fr 1fr; overflow: hidden; border: 1px solid var(--sh-line); border-radius: 22px; background: #fff; box-shadow: 0 30px 80px rgba(14, 39, 74, .13); }
.sh-auth-intro { padding: 52px; color: #fff; background: radial-gradient(circle at 85% 15%, rgba(53,216,255,.24), transparent 35%), var(--sh-navy); }
.sh-auth-intro h1 { margin: 16px 0; font: 700 42px/1.1 var(--sh-font-heading); letter-spacing: -.04em; }
.sh-auth-intro p { color: #aab7cc; line-height: 1.7; }
.sh-auth-intro ul { padding: 20px 0 0; list-style: none; }
.sh-auth-intro li { margin: 14px 0; color: #dce7f7; }
.sh-auth-intro li::before { margin-right: 10px; content: "✓"; color: var(--sh-mint); font-weight: 800; }
.sh-auth-card { padding: 52px; }
.sh-auth-card label { color: #293b55; font-size: 12px; font-weight: 700; }
.sh-auth-card .form-control { min-height: 50px; border-color: #cbd7e6; border-radius: 9px; }
.sh-auth-card .btn-primary { min-height: 50px; border-color: var(--sh-blue); border-radius: 9px; background: var(--sh-blue); font-weight: 700; }
.sh-field-label { display: flex; justify-content: space-between; align-items: center; }
.sh-field-label a { font-size: 11px; font-weight: 700; }
.sh-remember { display: flex; margin: 20px 0; align-items: center; gap: 9px; }
.sh-auth-register { margin: 22px 0 0; text-align: center; }

.client-home-cards .card, .tiles .tile, .table-container, .main-content .card {
    border: 1px solid var(--sh-line);
    border-radius: 14px;
    box-shadow: 0 14px 38px rgba(18, 44, 78, .06);
}
.tiles .tile { margin: 6px; overflow: hidden; background: #fff; transition: transform .2s, box-shadow .2s; }
.tiles .tile:hover { transform: translateY(-3px); box-shadow: 0 20px 44px rgba(18, 44, 78, .11); }
.tiles .tile .stat { color: var(--sh-navy); font-family: var(--sh-font-heading); font-weight: 800; }
.client-home-cards .card-header { border-bottom: 1px solid var(--sh-line); background: #f8faff; }
.table-list thead th { border: 0; color: #fff; background: var(--sh-navy); }
.table-list tbody tr { cursor: pointer; }
.table-list tbody tr:focus-within { outline: 3px solid rgba(53,216,255,.45); outline-offset: -3px; }

.sh-control { padding: 120px 0; background: var(--sh-paper); }
.sh-control-grid { display: grid; grid-template-columns: .8fr 1.15fr; align-items: center; gap: 90px; }
.sh-control-copy > p { color: var(--sh-muted); font-size: 17px; line-height: 1.75; }.sh-feature-list { display: grid; margin: 28px 0; grid-template-columns: 1fr 1fr; gap: 13px; }.sh-feature-list span { color: #3d4f69; font-size: 13px; }.sh-feature-list i { margin-right: 9px; color: var(--sh-blue); font-style: normal; }.sh-control-copy > a { color: var(--sh-blue); font-weight: 700; }
.sh-dashboard { display: grid; grid-template-columns: 74px 1fr; overflow: hidden; border: 1px solid #d5deea; border-radius: 20px; background: #fff; box-shadow: 0 35px 80px rgba(22,45,80,.14); transform: rotate(1.2deg); }
.sh-dashboard-nav { display: flex; min-height: 480px; padding: 18px; align-items: center; flex-direction: column; gap: 23px; background: var(--sh-navy); }.sh-dashboard-nav img { width: 38px; height: 38px; margin-bottom: 20px; }.sh-dashboard-nav span { width: 24px; height: 5px; border-radius: 5px; background: #34445f; }.sh-dashboard-nav span:nth-child(2){background:var(--sh-cyan)}.sh-dashboard-nav i { width: 30px; height: 30px; margin-top: auto; border-radius: 50%; background: #263a5b; }
.sh-dashboard-content { padding: 40px; }.sh-dashboard-content small { color: var(--sh-blue); font-weight: 700; letter-spacing: .15em; }.sh-dashboard-content h3 { margin: 14px 0 4px; font: 700 32px var(--sh-font-heading); letter-spacing: -.04em; }.sh-dashboard-content > p { color: var(--sh-muted); }
.sh-dashboard-cards { display: grid; margin-top: 32px; grid-template-columns: 1fr 1fr; gap: 12px; }.sh-dashboard-cards article { display: flex; padding: 17px; border: 1px solid var(--sh-line); border-radius: 12px; flex-direction: column; }.sh-dashboard-cards span { color: var(--sh-muted); font-size: 9px; text-transform: uppercase; }.sh-dashboard-cards b { margin: 7px 0 14px; font-size: 13px; }.sh-dashboard-cards em { color: #1aaf72; font-size: 9px; font-style: normal; }
.sh-chart { display: flex; height: 130px; margin-top: 28px; align-items: flex-end; gap: 8px; padding: 14px; border-radius: 12px; background: #f5f8fc; }.sh-chart span { flex: 1; border-radius: 4px 4px 0 0; background: linear-gradient(var(--sh-cyan), var(--sh-blue)); }.sh-chart span:nth-child(1){height:35%}.sh-chart span:nth-child(2){height:55%}.sh-chart span:nth-child(3){height:43%}.sh-chart span:nth-child(4){height:78%}.sh-chart span:nth-child(5){height:62%}.sh-chart span:nth-child(6){height:91%}.sh-chart span:nth-child(7){height:74%}.sh-chart span:nth-child(8){height:98%}

.sh-domain { padding: 90px 0; color: #fff; background: var(--sh-navy-2); }.sh-domain-grid { display: grid; grid-template-columns: 1fr .85fr; align-items: center; gap: 70px; }.sh-domain form { display: flex; padding: 7px; border: 1px solid rgba(255,255,255,.14); border-radius: 12px; background: rgba(255,255,255,.07); }.sh-domain input { min-width: 0; min-height: 54px; padding: 0 17px; flex: 1; border: 0; outline: 0; color: #fff; background: transparent; }.sh-domain button { padding: 0 20px; border: 0; border-radius: 8px; color: #061326; background: var(--sh-cyan); font-weight: 700; }
.sh-final-cta { padding: 120px 0; text-align: center; color: #fff; background: radial-gradient(circle at 50% 100%, rgba(57,120,255,.34), transparent 40%), var(--sh-navy); }.sh-final-cta h2 { margin: 18px auto; font: 700 clamp(50px, 6vw, 82px)/1.02 var(--sh-font-heading); letter-spacing: -.06em; }.sh-final-cta p { color: #96a6bf; font-size: 17px; }.sh-final-cta .sh-hero-actions { justify-content: center; }.sh-button-light { color: var(--sh-navy) !important; background: #fff; }.sh-button-outline { color: #fff !important; border-color: rgba(255,255,255,.22); }
.sh-decision { padding: 120px 0; background: #fff; }
.sh-decision-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.sh-decision-grid a { display: flex; min-height: 300px; padding: 28px; flex-direction: column; border: 1px solid var(--sh-line); border-radius: 16px; color: var(--sh-ink) !important; background: var(--sh-paper); text-decoration: none !important; }
.sh-decision-grid a:hover { border-color: var(--sh-blue); transform: translateY(-3px); }
.sh-decision-grid span { color: var(--sh-blue); font: 700 10px monospace; letter-spacing: .12em; }
.sh-decision-grid h3 { margin: 54px 0 12px; font: 700 23px/1.2 var(--sh-font-heading); letter-spacing: -.035em; }
.sh-decision-grid p { color: var(--sh-muted); line-height: 1.65; }
.sh-decision-grid b { margin-top: auto; color: var(--sh-blue); font-size: 12px; }
.sh-assurance { padding: 100px 0; color: #fff; background: var(--sh-navy); }
.sh-assurance-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 90px; }
.sh-assurance-grid h2 { margin: 17px 0; font: 700 clamp(38px, 4vw, 58px)/1.05 var(--sh-font-heading); letter-spacing: -.05em; }
.sh-assurance-grid > div > p { color: #9cabc0; font-size: 16px; line-height: 1.7; }
.sh-assurance-list { display: grid; gap: 12px; }
.sh-assurance-list article { padding: 24px; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; background: rgba(255,255,255,.035); }
.sh-assurance-list strong { color: var(--sh-cyan); }
.sh-assurance-list p { margin: 8px 0 0; color: #a6b4c7; line-height: 1.6; }

.sh-landing { background: var(--sh-paper); }
.sh-landing-hero { padding: 150px 0 100px; color: #fff; background: radial-gradient(circle at 85% 20%, rgba(53,216,255,.18), transparent 30%), var(--sh-navy); }
.sh-landing-hero-grid { display: grid; grid-template-columns: 1.35fr .65fr; align-items: center; gap: 80px; }
.sh-landing-hero-grid > * { min-width: 0; }
.sh-landing-hero h1 { max-width: 850px; margin: 18px 0; font: 700 clamp(46px, 6vw, 78px)/1.02 var(--sh-font-heading); letter-spacing: -.055em; }
.sh-landing-hero p { max-width: 720px; color: #aab7ca; font-size: 18px; line-height: 1.7; }
.sh-landing-summary { padding: 30px; border: 1px solid rgba(53,216,255,.22); border-radius: 18px; background: rgba(255,255,255,.045); }
.sh-landing-summary > span { color: var(--sh-cyan); font: 700 10px monospace; letter-spacing: .12em; text-transform: uppercase; }
.sh-landing-summary > strong { display: block; margin: 18px 0 25px; font: 700 24px/1.25 var(--sh-font-heading); }
.sh-landing-summary ul { padding: 0; margin: 0; list-style: none; }
.sh-landing-summary li { padding: 13px 0; border-top: 1px solid rgba(255,255,255,.09); color: #b5c1d2; }
.sh-landing-summary li:before { margin-right: 9px; content: "✓"; color: var(--sh-cyan); }
.sh-landing-section { padding: 105px 0; }
.sh-landing-section-dark { color: #fff; background: var(--sh-navy-2); }
.sh-value-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sh-value-grid article { min-height: 270px; padding: 30px; border: 1px solid var(--sh-line); border-radius: 16px; background: #fff; }
.sh-value-grid span { color: var(--sh-blue); font: 700 10px monospace; }
.sh-value-grid h3 { margin: 52px 0 12px; font: 700 24px var(--sh-font-heading); }
.sh-value-grid p { color: var(--sh-muted); line-height: 1.65; }
.sh-migration-grid, .sh-faq-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 90px; }
.sh-migration-grid h2, .sh-faq-layout h2 { margin: 17px 0; font: 700 clamp(38px, 4vw, 58px)/1.08 var(--sh-font-heading); letter-spacing: -.045em; }
.sh-migration-grid p { color: #a8b6ca; font-size: 17px; line-height: 1.75; }
.sh-faq-list details { padding: 22px 0; border-bottom: 1px solid var(--sh-line); }
.sh-faq-list summary { cursor: pointer; font-weight: 700; }
.sh-faq-list p { color: var(--sh-muted); line-height: 1.7; }
.sh-footer { padding: 74px 0 26px; color: #91a0b7; background: #040c1b; }
.sh-footer-top { display: flex; padding-bottom: 46px; align-items: end; justify-content: space-between; gap: 45px; border-bottom: 1px solid rgba(255,255,255,.08); }
.sh-footer-intro img { display: block; width: 245px; height: auto; }.sh-footer-intro p { max-width: 600px; margin: 18px 0 0; color: #8998ae; line-height: 1.75; }.sh-status { display: inline-flex; margin-top: 14px; align-items: center; color: #8290a7; font-size: 9px; }
.sh-footer-social { display: flex; margin-top: 17px; flex-wrap: wrap; gap: 8px 14px; }
.sh-footer-social a { color: #8290a7 !important; font-size: 10px; font-weight: 700; text-decoration: none !important; }
.sh-footer-social a:hover, .sh-footer-social a:focus-visible { color: var(--sh-cyan) !important; }
.sh-footer-sales { display: flex; min-width: 310px; padding: 20px 22px; justify-content: space-between; flex-direction: column; border: 1px solid rgba(53,216,255,.2); border-radius: 14px; color: #fff !important; background: rgba(53,216,255,.06); text-decoration: none !important; }
.sh-footer-sales > span { color: #7f8da4; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }.sh-footer-sales strong { display: flex; margin-top: 8px; justify-content: space-between; font-size: 12px; }.sh-footer-sales i { color: var(--sh-cyan); font-style: normal; }
.sh-footer-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 44px; padding-top: 48px; }
.sh-footer-grid nav h2 { margin: 0 0 19px; color: #fff; font: 700 11px var(--sh-font-body); letter-spacing: .12em; text-transform: uppercase; }
.sh-footer-grid nav a { display: block; margin: 11px 0; color: #8493aa; font-size: 11px; text-decoration: none; }.sh-footer-grid nav a:hover { color: #fff; }
.sh-footer-trust { display: grid; margin-top: 44px; padding: 20px 0; grid-template-columns: repeat(4, 1fr); gap: 20px; border-top: 1px solid rgba(255,255,255,.08); border-bottom: 1px solid rgba(255,255,255,.08); }
.sh-footer-trust span { display: flex; align-items: center; gap: 8px; color: #75849b; font-size: 9px; }.sh-footer-trust i { color: var(--sh-cyan); font-style: normal; }.sh-footer-trust .sh-live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--sh-mint); box-shadow: 0 0 12px rgba(169,255,203,.65); }
.sh-footer-bottom { display: flex; padding-top: 22px; justify-content: space-between; color: #56647a; font-size: 10px; }
.sh-footer-legal { display: flex; flex-wrap: wrap; gap: 17px; }.sh-footer-legal a { color: #718098; text-decoration: none; }.sh-footer-legal a[aria-current="true"] { color: var(--sh-cyan); }

/* Nexus internal area */
.sh-internal-page { min-height: 100vh; color: var(--sh-ink); background: #f4f7fb; }
.sh-internal-page #header { color: #fff; background: var(--sh-navy); box-shadow: 0 10px 35px rgba(3, 13, 30, .16); }
.sh-internal-page #header .topbar { border-bottom: 1px solid rgba(255,255,255,.08); background: #050e20; }
.sh-internal-page #header .topbar .btn,
.sh-internal-page #header .topbar .input-group-text { color: #bdc9da; border-color: rgba(255,255,255,.12); background: transparent; }
/* La etiqueta «Conectado como:» medía 27 px de alto contra los 40 px de los
   controles vecinos, así que su centro quedaba 6 px más arriba; y la fila no
   centraba verticalmente, con lo que el bloque de notificaciones tampoco caía
   en el eje de la barra. */
.sh-internal-page #header .topbar .d-flex,
.sh-internal-page #header .topbar .active-client,
.sh-internal-page #header .topbar .btn-group { align-items: center; }
.sh-internal-page #header .topbar .input-group-text {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
}
.sh-internal-page #header .topbar .btn { display: inline-flex; min-height: 40px; align-items: center; }
.sh-internal-page #header .topbar > .container { display: flex; align-items: center; min-height: 46px; }
.sh-internal-page #header .topbar > .container > .d-flex { width: 100%; }
.sh-internal-page .navbar-light { min-height: 76px; background: var(--sh-navy) !important; }
.sh-internal-page .navbar-light > .container,
.sh-internal-page .main-navbar-wrapper > .container,
.sh-internal-page .master-breadcrumb > .container,
.sh-internal-page #main-body > .container,
.sh-internal-page #footer > .container { width: min(1440px, calc(100% - 40px)); max-width: none; }
.sh-internal-page .navbar-brand img { width: 235px; height: 48px; object-fit: contain; object-position: left center; }
/* El ancho fijo de 320px más el botón excedía el grupo y el input caía a una
   segunda línea, dejando el buscador partido en dos. El grupo define el ancho y
   el campo ocupa lo que queda. */
.sh-internal-page .navbar-light .search { flex-wrap: nowrap; width: 340px; }
.sh-internal-page .navbar-light .search .form-control { flex: 1 1 auto; width: auto; min-width: 0; height: 44px; border: 1px solid rgba(255,255,255,.14); color: #fff; background: rgba(255,255,255,.07); }
.sh-internal-page .navbar-light .search .form-control::placeholder { color: #93a2b9; }
/* El botón de la lupa quedaba blanco sobre la cabecera oscura: la capa de
   componentes del área privada pinta `.btn-default` en blanco y le ganaba a la
   regla del navbar. Se declara con la misma especificidad para que el buscador
   acompañe al selector de moneda y al carrito. */
.sh-internal-page .navbar-light .search .btn,
.sh-internal-page:not(.sh-shopping-cart) .navbar-light .search .btn-default,
.sh-internal-page .navbar-light .toolbar .nav-link { min-width: 44px; min-height: 44px; color: #dfe9f8 !important; border: 1px solid rgba(255,255,255,.14) !important; background: rgba(255,255,255,.05) !important; }
.sh-internal-page:not(.sh-shopping-cart) .navbar-light .search .btn-default:hover,
.sh-internal-page:not(.sh-shopping-cart) .navbar-light .search .btn-default:focus-visible { border-color: rgba(255,255,255,.3) !important; background: rgba(255,255,255,.12) !important; }
.sh-internal-page .navbar-light .search .input-group-text { border-color: rgba(255,255,255,.14); background: rgba(255,255,255,.05); }
.sh-currency-switch-internal { margin-right: 8px; }
.sh-currency-switch-internal select { min-height: 44px; }

/* WHMCS product descriptions: semantic headings and features without native bullets. */
.sh-internal-page .package-features { padding-left: 0 !important; list-style: none !important; }
.sh-internal-page .package-features > li,
.sh-internal-page .package-features .card-body li { position: relative; margin: 10px 0; padding-left: 24px; list-style: none !important; line-height: 1.55; }
.sh-internal-page .package-features li > i { position: absolute; top: .28em; left: 0; width: 16px; text-align: center; }
.sh-internal-page .package-features li > strong { display: block; margin: 24px 0 4px; color: var(--sh-navy); font-size: 15px; }
.sh-internal-page .package-features br { display: none; }
.sh-internal-page .package-features .card { margin-top: 20px; border: 1px solid var(--sh-line); border-radius: 12px; }
.sh-internal-page .package-features .card-header { padding: 0; background: #f8faff; }
.sh-internal-page .package-features .card-header .btn { width: 100%; min-height: 48px; justify-content: center; }
.sh-product-description { display: grid; gap: 18px; margin: 22px 0; text-align: left; }
.sh-product-feature-section { padding: 20px; border: 1px solid #dce5f0; border-radius: 12px; background: #fff; }
.sh-product-feature-section h3 { margin: 0 0 13px; color: var(--sh-navy); font: 800 16px/1.35 var(--sh-font-heading); }
.sh-product-feature-section ul { display: grid; margin: 0; padding: 0; gap: 9px; list-style: none; }
.sh-product-feature-section li { position: relative; padding-left: 23px; color: #4e5f76; line-height: 1.55; }
.sh-product-feature-section li::before { position: absolute; top: 0; left: 0; content: "✓"; color: #159c68; font-weight: 900; }
.sh-product-details { overflow: hidden; border: 1px solid #cfdbea; border-radius: 12px; background: #f8faff; }
.sh-product-details summary { position: relative; padding: 17px 48px 17px 20px; color: var(--sh-blue); font-weight: 800; cursor: pointer; list-style: none; }
.sh-product-details summary::-webkit-details-marker { display: none; }
.sh-product-details summary::after { position: absolute; top: 50%; right: 20px; content: "+"; font-size: 22px; transform: translateY(-50%); }
.sh-product-details[open] summary::after { content: "−"; }
.sh-product-details-body { display: grid; padding: 18px; gap: 14px; border-top: 1px solid #dce5f0; }
.sh-product-details-body .sh-product-feature-section { padding: 16px; }
.sh-internal-page .main-navbar-wrapper { min-height: 54px; border-top: 1px solid rgba(255,255,255,.07); background: var(--sh-navy-2); }
.sh-internal-page .main-navbar-wrapper #nav > li > a,
.sh-internal-page .main-navbar-wrapper .navbar-nav > li > a { display: flex; min-height: 54px; padding: 0 17px; align-items: center; color: #c3cee0 !important; font-size: 12px; font-weight: 700; text-decoration: none; }
.sh-internal-page .main-navbar-wrapper #nav > li > a:hover,
.sh-internal-page .main-navbar-wrapper #nav > li > a:focus,
.sh-internal-page .main-navbar-wrapper .navbar-nav > li > a:hover,
.sh-internal-page .main-navbar-wrapper .navbar-nav > li > a:focus { color: #fff !important; background: rgba(255,255,255,.06); }
.sh-internal-page .main-navbar-wrapper .dropdown-menu { padding: 10px; border: 1px solid var(--sh-line); border-radius: 12px; box-shadow: 0 20px 55px rgba(8, 27, 54, .16); }
.sh-internal-page .main-navbar-wrapper .dropdown-item a { padding: 9px 11px !important; border-radius: 7px; color: #34445b; }
.sh-internal-page .master-breadcrumb { border: 0; background: #fff; box-shadow: 0 1px 0 var(--sh-line); }
.sh-internal-page .master-breadcrumb .breadcrumb { margin: 0; padding: 14px 0; background: transparent; }
.sh-internal-page #main-body { min-height: 60vh; padding: 38px 0 75px; background: linear-gradient(180deg, #f4f7fb 0, #fff 420px); }
.sh-internal-page #main-body > .container > .row { align-items: flex-start; }
.sh-internal-page .primary-content { min-width: 0; }
.sh-internal-page .primary-content > .header-lined h1 { color: var(--sh-navy); font: 700 clamp(30px, 3vw, 44px)/1.1 var(--sh-font-heading); letter-spacing: -.04em; }
.sh-internal-page .btn-primary { border-color: var(--sh-blue); border-radius: 8px; background: var(--sh-blue); font-weight: 700; box-shadow: 0 10px 25px rgba(57,120,255,.18); }
.sh-internal-page .btn-success { border-color: #159c68; border-radius: 8px; background: #159c68; }
.sh-internal-page .form-control,
.sh-internal-page .custom-select { min-height: 44px; border-color: #cbd7e6; border-radius: 8px; }

.sh-internal-page .sidebar .card-sidebar { overflow: hidden; margin-bottom: 14px !important; border: 1px solid #d8e2ee; border-radius: 13px; background: #fff; box-shadow: 0 12px 32px rgba(22, 47, 82, .06); }
.sh-internal-page .sidebar .card-sidebar .card-header { padding: 15px 17px; border-bottom: 1px solid #e5ebf3; color: var(--sh-navy); background: #f8faff; }
.sh-internal-page .sidebar .card-sidebar .card-title { font-size: 12px; font-weight: 800; }
.sh-internal-page .sidebar .list-group-item { padding: 12px 17px; border-color: #edf1f6; color: #506079; font-size: 12px; }
.sh-internal-page .sidebar .list-group-item:hover,
.sh-internal-page .sidebar .list-group-item.active { color: var(--sh-blue); background: #edf4ff; }
.sh-internal-page .sidebar .list-group-item.active { border-left: 3px solid var(--sh-blue); font-weight: 700; }
.sh-internal-page .sidebar .card-body { color: #56667d; font-size: 12px; line-height: 1.6; }

.sh-internal-page .tiles { margin: -6px -6px 30px; }
.sh-internal-page .tiles .tile { min-height: 132px; padding: 24px; border: 1px solid #d8e2ee; border-radius: 15px; background: #fff; box-shadow: 0 14px 36px rgba(22,47,82,.07); }
.sh-internal-page .tiles .tile i { color: #9fb0c6; }
.sh-internal-page .tiles .tile .stat { color: var(--sh-navy); font-size: 34px; }
.sh-internal-page .tiles .tile .title { color: #64738a; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.sh-internal-page .client-home-cards .card,
.sh-internal-page .primary-content > .card,
.sh-internal-page .table-container { overflow: hidden; border: 1px solid #d8e2ee; border-radius: 14px; background: #fff; box-shadow: 0 14px 38px rgba(18,44,78,.06); }
.sh-internal-page .client-home-cards .card-header,
.sh-internal-page .primary-content > .card > .card-header { padding: 16px 19px; border-color: #e5ebf3; background: #f8faff; }
.sh-internal-page .table-list thead th,
.sh-internal-page .table-list thead th.sorting,
.sh-internal-page .table-list thead th.sorting_asc,
.sh-internal-page .table-list thead th.sorting_desc {
    padding: 14px;
    border-color: #1b2e4c !important;
    color: #fff !important;
    background-color: var(--sh-navy) !important;
}
.sh-internal-page .table-list td { padding: 14px; vertical-align: middle; border-color: #e7edf4; }
/* ---------------------------------------------------------------------------
   Área de clientes: componentes compartidos.

   Nexus arma las 81 pantallas del área privada con un puñado de componentes de
   Bootstrap. En lugar de una hoja por pantalla se estilan esos componentes una
   sola vez: .card aparece en 61 de las 81 plantillas y .btn-default en 51, así
   que casi todo el área hereda de aquí.

   Se excluye .sh-shopping-cart porque el proceso de compra tiene su propia hoja
   en el order form y no debe recibir estos valores.
   --------------------------------------------------------------------------- */
.sh-internal-page:not(.sh-shopping-cart) .card {
    margin-bottom: 22px;
    border: 1px solid #d8e2ee;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 14px 38px rgba(18, 44, 78, .06);
}
.sh-internal-page:not(.sh-shopping-cart) .card > .card-header {
    padding: 16px 20px;
    border-bottom: 1px solid #e5ebf3;
    border-radius: 14px 14px 0 0;
    background: #f8faff;
}
.sh-internal-page:not(.sh-shopping-cart) .card-title {
    margin: 0;
    color: var(--sh-navy);
    font: 700 14px/1.35 var(--sh-font-heading);
    letter-spacing: -.01em;
}
.sh-internal-page:not(.sh-shopping-cart) .card-body { padding: 20px; }
.sh-internal-page:not(.sh-shopping-cart) .card-footer {
    padding: 15px 20px;
    border-top: 1px solid #e5ebf3;
    border-radius: 0 0 14px 14px;
    background: #fbfdff;
}
/* Tarjetas anidadas: sin sombra ni margen para no apilar profundidad. */
.sh-internal-page:not(.sh-shopping-cart) .card .card { margin-bottom: 0; box-shadow: none; }

/* ---------------------------------------------------------------------------
   Sistema de botones del área privada.

   WHMCS y sus módulos describen una misma acción con clases distintas según la
   pantalla (`primary`, `success`, `info`, `default` y `bg-color-*`). Se reducen
   a tres tratamientos funcionales:

   1. Primario: avanzar, guardar, pagar, crear o abrir una gestión.
   2. Secundario: volver, cancelar, filtrar o consultar sin modificar.
   3. Destructivo: eliminar, terminar o confirmar una acción irreversible.

   Los tamaños expresan jerarquía, no crean variantes visuales nuevas.
   --------------------------------------------------------------------------- */
.sh-internal-page:not(.sh-shopping-cart) .btn {
    display: inline-flex;
    min-height: 40px;
    padding: 0 16px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid transparent;
    border-radius: 8px !important;
    font-family: var(--sh-font-body);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    white-space: normal;
    box-shadow: none;
    transition: border-color .16s ease, background-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.sh-internal-page:not(.sh-shopping-cart) .btn:hover { text-decoration: none; transform: translateY(-1px); }
.sh-internal-page:not(.sh-shopping-cart) .btn:active { transform: translateY(0); }
.sh-internal-page:not(.sh-shopping-cart) .btn i,
.sh-internal-page:not(.sh-shopping-cart) .btn .fas,
.sh-internal-page:not(.sh-shopping-cart) .btn .far,
.sh-internal-page:not(.sh-shopping-cart) .btn .fab {
    width: auto;
    margin: 0;
    flex: 0 0 auto;
    font-size: 1em;
    line-height: 1;
}
.sh-internal-page:not(.sh-shopping-cart) .btn-sm { min-height: 34px; padding: 0 12px; font-size: 12px; }
.sh-internal-page:not(.sh-shopping-cart) .btn-lg { min-height: 48px; padding: 0 22px; font-size: 14px; }

/* Primario: se incluyen success/info porque WHMCS los usa para acciones
   positivas, no como mensajes de estado. */
.sh-internal-page:not(.sh-shopping-cart) .btn-primary,
.sh-internal-page:not(.sh-shopping-cart) .btn-success,
.sh-internal-page:not(.sh-shopping-cart) .btn-info,
.sh-internal-page:not(.sh-shopping-cart) .input-group .btn-primary,
.sh-internal-page:not(.sh-shopping-cart) .input-group .btn-success,
.sh-internal-page:not(.sh-shopping-cart) .input-group .btn-info {
    border-color: var(--sh-blue) !important;
    color: #fff !important;
    background: var(--sh-blue) !important;
    box-shadow: 0 9px 22px rgba(57, 120, 255, .18);
}
.sh-internal-page:not(.sh-shopping-cart) .btn-primary:hover,
.sh-internal-page:not(.sh-shopping-cart) .btn-primary:focus-visible,
.sh-internal-page:not(.sh-shopping-cart) .btn-success:hover,
.sh-internal-page:not(.sh-shopping-cart) .btn-success:focus-visible,
.sh-internal-page:not(.sh-shopping-cart) .btn-info:hover,
.sh-internal-page:not(.sh-shopping-cart) .btn-info:focus-visible,
.sh-internal-page:not(.sh-shopping-cart) .input-group .btn-primary:hover,
.sh-internal-page:not(.sh-shopping-cart) .input-group .btn-primary:focus-visible,
.sh-internal-page:not(.sh-shopping-cart) .input-group .btn-success:hover,
.sh-internal-page:not(.sh-shopping-cart) .input-group .btn-success:focus-visible,
.sh-internal-page:not(.sh-shopping-cart) .input-group .btn-info:hover,
.sh-internal-page:not(.sh-shopping-cart) .input-group .btn-info:focus-visible {
    border-color: #245fd8 !important;
    color: #fff !important;
    background: #245fd8 !important;
    box-shadow: 0 11px 26px rgba(36, 95, 216, .24);
}

/* Secundario. */
.sh-internal-page:not(.sh-shopping-cart) .btn-default,
.sh-internal-page:not(.sh-shopping-cart) .btn-secondary,
.sh-internal-page:not(.sh-shopping-cart) .btn-light,
.sh-internal-page:not(.sh-shopping-cart) .btn-outline-primary,
.sh-internal-page:not(.sh-shopping-cart) .btn-outline-secondary {
    border: 1px solid #cbd7e6 !important;
    color: #34455f !important;
    background: #fff !important;
}
/* El hover anterior —azul sobre azul muy claro— medía 3.68:1, por debajo del
   mínimo de 4.5:1, y el botón casi desaparecía. Se invierte a navy sólido, que
   además es el gesto de énfasis del sitio público. */
.sh-internal-page:not(.sh-shopping-cart) .btn-default:hover,
.sh-internal-page:not(.sh-shopping-cart) .btn-default:focus-visible,
.sh-internal-page:not(.sh-shopping-cart) .btn-secondary:hover,
.sh-internal-page:not(.sh-shopping-cart) .btn-secondary:focus-visible,
.sh-internal-page:not(.sh-shopping-cart) .btn-light:hover,
.sh-internal-page:not(.sh-shopping-cart) .btn-light:focus-visible,
.sh-internal-page:not(.sh-shopping-cart) .btn-outline-primary:hover,
.sh-internal-page:not(.sh-shopping-cart) .btn-outline-primary:focus-visible,
.sh-internal-page:not(.sh-shopping-cart) .btn-outline-secondary:hover,
.sh-internal-page:not(.sh-shopping-cart) .btn-outline-secondary:focus-visible {
    border-color: var(--sh-navy) !important;
    color: #fff !important;
    background: var(--sh-navy) !important;
}

/* Los paneles del dashboard piden su botón con `btn btn-default bg-color-<color>
   btn-xs`: `bg-color-red` pinta el fondo con el rojo de error de Nexus y
   `btn-xs` es una clase de Bootstrap 3 que en Bootstrap 4 no existe, así que el
   botón quedaba a tamaño completo dentro de la cabecera. Se unifica el color con
   el resto de los secundarios y se le devuelve el tamaño reducido. */
.sh-internal-page:not(.sh-shopping-cart) .card-header .btn-xs,
.sh-internal-page:not(.sh-shopping-cart) .btn-xs {
    min-height: 32px;
    padding: 0 12px;
    border-radius: 8px !important;
    font-size: 11.5px;
}
.sh-internal-page:not(.sh-shopping-cart) .btn[class*="bg-color-"] {
    border-color: #cbd7e6 !important;
    color: #34455f !important;
    background: #fff !important;
}
.sh-internal-page:not(.sh-shopping-cart) .btn[class*="bg-color-"]:hover,
.sh-internal-page:not(.sh-shopping-cart) .btn[class*="bg-color-"]:focus-visible {
    border-color: var(--sh-navy) !important;
    color: #fff !important;
    background: var(--sh-navy) !important;
}
/* En los paneles de inicio, rojo y azul se usaban indistintamente para acciones
   positivas (pagar, adherir, abrir ticket). Se leen como primarias; los demás
   colores heredados quedan como consultas secundarias. */
.sh-internal-page:not(.sh-shopping-cart) .card-header .btn.bg-color-red,
.sh-internal-page:not(.sh-shopping-cart) .card-header .btn.bg-color-blue {
    border-color: var(--sh-blue) !important;
    color: #fff !important;
    background: var(--sh-blue) !important;
}
.sh-internal-page:not(.sh-shopping-cart) .card-header .btn.bg-color-red:hover,
.sh-internal-page:not(.sh-shopping-cart) .card-header .btn.bg-color-red:focus-visible,
.sh-internal-page:not(.sh-shopping-cart) .card-header .btn.bg-color-blue:hover,
.sh-internal-page:not(.sh-shopping-cart) .card-header .btn.bg-color-blue:focus-visible {
    border-color: #245fd8 !important;
    color: #fff !important;
    background: #245fd8 !important;
}
/* El botón del panel lateral llega por setFooterHtml() como .btn-success y
   ocupa el ancho de la columna. En una tarjeta de contenido, en cambio, un
   botón a todo el ancho pesa de más. */
.sh-internal-page:not(.sh-shopping-cart) .sidebar .card-footer .btn { width: 100%; justify-content: center; }
.sh-internal-page:not(.sh-shopping-cart) .btn-danger,
.sh-internal-page:not(.sh-shopping-cart) .btn-outline-danger {
    border-color: #c72f47 !important;
    color: #fff !important;
    background: #c72f47 !important;
}
.sh-internal-page:not(.sh-shopping-cart) .btn-danger:hover,
.sh-internal-page:not(.sh-shopping-cart) .btn-danger:focus-visible,
.sh-internal-page:not(.sh-shopping-cart) .btn-outline-danger:hover,
.sh-internal-page:not(.sh-shopping-cart) .btn-outline-danger:focus-visible {
    border-color: #9f2035 !important;
    color: #fff !important;
    background: #9f2035 !important;
}
.sh-internal-page:not(.sh-shopping-cart) .btn-link {
    min-height: 34px;
    padding-inline: 6px;
    color: var(--sh-blue);
    background: transparent;
    box-shadow: none;
}
.sh-internal-page:not(.sh-shopping-cart) .btn-link:hover,
.sh-internal-page:not(.sh-shopping-cart) .btn-link:focus-visible {
    color: #245fd8;
    background: #edf4ff;
    transform: none;
}
.sh-internal-page:not(.sh-shopping-cart) .btn.disabled,
.sh-internal-page:not(.sh-shopping-cart) .btn:disabled {
    border-color: #dfe6ef !important;
    color: #718096 !important;
    background: #edf1f6 !important;
    box-shadow: none !important;
    cursor: not-allowed;
    opacity: 1;
    transform: none;
}
.sh-internal-page:not(.sh-shopping-cart) .btn-group {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 8px;
}
.sh-internal-page:not(.sh-shopping-cart) .btn-group > .btn {
    margin: 0 !important;
    border-radius: 8px !important;
}
.sh-internal-page:not(.sh-shopping-cart) .card-header .btn,
.sh-internal-page:not(.sh-shopping-cart) .table .btn {
    max-width: 100%;
}
.sh-internal-page:not(.sh-shopping-cart) .btn:focus-visible {
    outline: 3px solid rgba(57, 120, 255, .35);
    outline-offset: 2px;
}

/* Tablas fuera de .table-list, que ya tiene su propio tratamiento. */
.sh-internal-page:not(.sh-shopping-cart) .table:not(.table-list) { margin-bottom: 0; }
.sh-internal-page:not(.sh-shopping-cart) .table:not(.table-list) thead th {
    padding: 13px 14px;
    border-bottom: 1px solid #dfe7f1 !important;
    border-top: 0;
    color: #64738a;
    background: #f8faff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}
.sh-internal-page:not(.sh-shopping-cart) .table:not(.table-list) td {
    padding: 13px 14px;
    vertical-align: middle;
    border-color: #eaf0f7;
    font-size: 13px;
}
.sh-internal-page:not(.sh-shopping-cart) .table-hover tbody tr:hover { background: #f6f9ff; }
.sh-internal-page:not(.sh-shopping-cart) .total-row td { color: var(--sh-navy); font-weight: 800; }

/* Alertas: barra lateral de color en lugar del bloque saturado de Bootstrap. */
.sh-internal-page:not(.sh-shopping-cart) .alert {
    padding: 15px 18px;
    border: 1px solid transparent;
    border-left-width: 4px;
    border-radius: 10px;
    font-size: 13px;
}
.sh-internal-page:not(.sh-shopping-cart) .alert-success { border-color: #b6e6d0; border-left-color: #159c68; color: #0d5f41; background: #edfaf4; }
.sh-internal-page:not(.sh-shopping-cart) .alert-info    { border-color: #b9dcef; border-left-color: #1586b8; color: #0d5273; background: #ecf7fd; }
.sh-internal-page:not(.sh-shopping-cart) .alert-warning { border-color: #f2ddb0; border-left-color: #c98a15; color: #7a5307; background: #fdf7ea; }
.sh-internal-page:not(.sh-shopping-cart) .alert-danger  { border-color: #f3c3cb; border-left-color: #d1344b; color: #86182b; background: #fdeef1; }

/* Formularios */
.sh-internal-page:not(.sh-shopping-cart) .form-group { margin-bottom: 18px; }
.sh-internal-page:not(.sh-shopping-cart) .col-form-label,
.sh-internal-page:not(.sh-shopping-cart) .control-label,
.sh-internal-page:not(.sh-shopping-cart) label {
    color: #34455f;
    font-size: 12px;
    font-weight: 700;
}
.sh-internal-page:not(.sh-shopping-cart) .form-control:focus,
.sh-internal-page:not(.sh-shopping-cart) .custom-select:focus {
    border-color: var(--sh-blue);
    box-shadow: 0 0 0 3px rgba(57, 120, 255, .14);
}
.sh-internal-page:not(.sh-shopping-cart) .input-group-text {
    border-color: #cbd7e6;
    color: #64738a;
    background: #f4f7fb;
}
.sh-internal-page:not(.sh-shopping-cart) .form-check-input { margin-top: .3rem; }
.sh-internal-page:not(.sh-shopping-cart) .form-check-label { font-weight: 400; }

/* Pestañas */
.sh-internal-page:not(.sh-shopping-cart) .nav-tabs { border-bottom: 1px solid #dfe7f1; gap: 4px; }
.sh-internal-page:not(.sh-shopping-cart) .nav-tabs .nav-link {
    padding: 11px 16px;
    border: 0;
    border-bottom: 2px solid transparent;
    color: #64738a;
    font-size: 13px;
    font-weight: 700;
}
.sh-internal-page:not(.sh-shopping-cart) .nav-tabs .nav-link:hover { color: var(--sh-blue); background: transparent; }
.sh-internal-page:not(.sh-shopping-cart) .nav-tabs .nav-link.active {
    border-bottom-color: var(--sh-blue);
    color: var(--sh-navy);
    background: transparent;
}

/* Estados y etiquetas */
.sh-internal-page:not(.sh-shopping-cart) .badge {
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .03em;
}
.sh-internal-page:not(.sh-shopping-cart) .badge-success,
.sh-internal-page:not(.sh-shopping-cart) .label-active { color: #0d5f41; background: #d7f2e6; }
.sh-internal-page:not(.sh-shopping-cart) .badge-danger { color: #86182b; background: #fbdde3; }
.sh-internal-page:not(.sh-shopping-cart) .badge-warning { color: #7a5307; background: #fbeed2; }
.sh-internal-page:not(.sh-shopping-cart) .badge-info { color: #0d5273; background: #d9eefa; }

/* Estados de servicios, facturas, dominios y tickets.
   Nexus los pinta como etiquetas de Bootstrap 3 —rectángulo saturado, texto
   blanco, `display: inline`— y además apoya varios de ellos en variables que su
   propio `:root` no define: `.status-unpaid` usa `var(--error)` y
   `.status-suspended` usa `var(--yellow-300)`, ninguna de las dos declarada. La
   declaración queda inválida, el fondo vuelve a transparente y, con el texto en
   blanco que impone `.label`, la etiqueta desaparece: eso es lo que dejaba en
   blanco la columna Estado de los tickets y la factura «Sin pagar».

   El color base se fija primero para que cualquier estado —incluidos los que no
   estén enumerados abajo— sea legible, y después se afinan los conocidos. */
.sh-internal-page:not(.sh-shopping-cart) .label.status,
.sh-internal-page:not(.sh-shopping-cart) span.label {
    display: inline-block;
    padding: 5px 11px;
    border-radius: 999px;
    color: #4a5668;
    background-color: #e7ecf3;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.35;
    letter-spacing: .02em;
}
/* `status-custom` trae el color en un atributo style, que gana por ser inline;
   ahí el texto se mantiene en blanco como espera Nexus. */
.sh-internal-page:not(.sh-shopping-cart) .label.status-custom { color: #fff; }
.sh-internal-page:not(.sh-shopping-cart) .label.status-active,
.sh-internal-page:not(.sh-shopping-cart) .label.status-paid { color: #0d5f41; background-color: #d7f2e6; }
.sh-internal-page:not(.sh-shopping-cart) .label.status-pending,
.sh-internal-page:not(.sh-shopping-cart) .label.status-suspended { color: #7a5307; background-color: #fbeed2; }
.sh-internal-page:not(.sh-shopping-cart) .label.status-unpaid,
.sh-internal-page:not(.sh-shopping-cart) .label.status-overdue { color: #86182b; background-color: #fbdde3; }
.sh-internal-page:not(.sh-shopping-cart) .label.status-cancelled,
.sh-internal-page:not(.sh-shopping-cart) .label.status-terminated,
.sh-internal-page:not(.sh-shopping-cart) .label.status-closed,
.sh-internal-page:not(.sh-shopping-cart) .label.status-expired { color: #4a5668; background-color: #e7ecf3; }

/* Listas y paginación */
.sh-internal-page:not(.sh-shopping-cart) .list-group-item { border-color: #eaf0f7; font-size: 13px; }
.sh-internal-page:not(.sh-shopping-cart) .pagination { gap: 5px; }
.sh-internal-page:not(.sh-shopping-cart) .page-link {
    min-width: 38px;
    border: 1px solid #dfe7f1;
    border-radius: 8px !important;
    color: #4d5d74;
    text-align: center;
}
.sh-internal-page:not(.sh-shopping-cart) .page-item.active .page-link {
    border-color: var(--sh-navy);
    color: #fff;
    background: var(--sh-navy);
}

/* Modales */
.sh-internal-page:not(.sh-shopping-cart) .modal-content { border: 0; border-radius: 16px; box-shadow: 0 30px 80px rgba(8, 27, 54, .25); }
.sh-internal-page:not(.sh-shopping-cart) .modal-header { padding: 18px 22px; border-bottom: 1px solid #e5ebf3; }
.sh-internal-page:not(.sh-shopping-cart) .modal-footer { padding: 15px 22px; border-top: 1px solid #e5ebf3; background: #fbfdff; }

/* Compatibilidad con marcado de Bootstrap 3.
   El hook de detalles de producto genera su HTML con `col-xs-*` y con paneles
   (`panel`, `panel-heading`, `panel-body`). Nexus es Bootstrap 4 y ninguna de
   esas clases existe: las columnas no tienen ancho —todo queda apilado a ancho
   completo— y los paneles se ven sin recuadro. Se traducen aquí en lugar de
   reescribir las 900 líneas del hook, de modo que el marcado heredado siga
   funcionando aunque el hook cambie. */
.sh-internal-page:not(.sh-shopping-cart) .col-xs-1,
.sh-internal-page:not(.sh-shopping-cart) .col-xs-2,
.sh-internal-page:not(.sh-shopping-cart) .col-xs-3,
.sh-internal-page:not(.sh-shopping-cart) .col-xs-4,
.sh-internal-page:not(.sh-shopping-cart) .col-xs-5,
.sh-internal-page:not(.sh-shopping-cart) .col-xs-6,
.sh-internal-page:not(.sh-shopping-cart) .col-xs-7,
.sh-internal-page:not(.sh-shopping-cart) .col-xs-8,
.sh-internal-page:not(.sh-shopping-cart) .col-xs-9,
.sh-internal-page:not(.sh-shopping-cart) .col-xs-10,
.sh-internal-page:not(.sh-shopping-cart) .col-xs-11,
.sh-internal-page:not(.sh-shopping-cart) .col-xs-12 {
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}
.sh-internal-page:not(.sh-shopping-cart) .col-xs-1  { flex: 0 0 8.333333%;  max-width: 8.333333%; }
.sh-internal-page:not(.sh-shopping-cart) .col-xs-2  { flex: 0 0 16.666667%; max-width: 16.666667%; }
.sh-internal-page:not(.sh-shopping-cart) .col-xs-3  { flex: 0 0 25%;        max-width: 25%; }
.sh-internal-page:not(.sh-shopping-cart) .col-xs-4  { flex: 0 0 33.333333%; max-width: 33.333333%; }
.sh-internal-page:not(.sh-shopping-cart) .col-xs-5  { flex: 0 0 41.666667%; max-width: 41.666667%; }
.sh-internal-page:not(.sh-shopping-cart) .col-xs-6  { flex: 0 0 50%;        max-width: 50%; }
.sh-internal-page:not(.sh-shopping-cart) .col-xs-7  { flex: 0 0 58.333333%; max-width: 58.333333%; }
.sh-internal-page:not(.sh-shopping-cart) .col-xs-8  { flex: 0 0 66.666667%; max-width: 66.666667%; }
.sh-internal-page:not(.sh-shopping-cart) .col-xs-9  { flex: 0 0 75%;        max-width: 75%; }
.sh-internal-page:not(.sh-shopping-cart) .col-xs-10 { flex: 0 0 83.333333%; max-width: 83.333333%; }
.sh-internal-page:not(.sh-shopping-cart) .col-xs-11 { flex: 0 0 91.666667%; max-width: 91.666667%; }
.sh-internal-page:not(.sh-shopping-cart) .col-xs-12 { flex: 0 0 100%;       max-width: 100%; }

.sh-internal-page:not(.sh-shopping-cart) .panel:not(.panel-sidebar) {
    margin-bottom: 22px;
    border: 1px solid #d8e2ee;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 14px 38px rgba(18, 44, 78, .06);
}
.sh-internal-page:not(.sh-shopping-cart) .panel:not(.panel-sidebar) > .panel-heading {
    padding: 16px 20px;
    border-bottom: 1px solid #e5ebf3;
    border-radius: 14px 14px 0 0;
    background: #f8faff;
}
.sh-internal-page:not(.sh-shopping-cart) .panel:not(.panel-sidebar) > .panel-heading .panel-title {
    margin: 0;
    color: var(--sh-navy);
    font: 700 14px/1.35 var(--sh-font-heading);
}
.sh-internal-page:not(.sh-shopping-cart) .panel:not(.panel-sidebar) > .panel-body { padding: 20px; }
/* Pares etiqueta/valor del detalle de servicio. */
.sh-internal-page:not(.sh-shopping-cart) .panel-body > .row { margin-bottom: 9px; font-size: 13px; }
.sh-internal-page:not(.sh-shopping-cart) .panel-body > .row:last-child { margin-bottom: 0; }

.sh-internal-page #footer { padding: 44px 0; color: #8595ad; background: #040c1b; }
.sh-internal-page #footer .nav-link { color: #aebbd0; }
.sh-internal-page #footer .copyright { color: #66758c; }

@media (max-width: 1199px) {
    .sh-internal-page .main-navbar-wrapper .navbar-collapse { padding: 12px 0 18px; }
    .sh-internal-page .main-navbar-wrapper #nav > li > a,
    .sh-internal-page .main-navbar-wrapper .navbar-nav > li > a { min-height: 44px; padding-inline: 12px; }
}

/* The nav needs more room than the body copy: capping it at the 1240px content
   width is what forced the Spanish labels onto a second line at every desktop
   size, no matter how wide the monitor was. Desktop only — the narrow
   breakpoints below set their own container width. */
@media (min-width: 1081px) {
    .sh-header .sh-container { width: min(1400px, calc(100% - 48px)); }
}

/* Between the widened layout and the hamburger the Spanish labels still do not
   fit on one line, so the utility actions collapse to icons and give the menu
   back its horizontal space. The labels stay in the DOM for assistive tech. */
@media (min-width: 1081px) and (max-width: 1447px) {
    .sh-nav { gap: 18px; }
    .sh-nav-actions { gap: 12px; }
    .sh-menu-trigger { padding: 0 9px; }
    .sh-brand img { width: 195px; }
    .sh-action-icon { display: block; }
    .sh-action-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .sh-login, .sh-nav-cta { justify-content: center; width: 43px; min-width: 43px; padding: 0; gap: 0; }
    .sh-login { height: 43px; border: 1px solid rgba(255,255,255,.16); border-radius: 10px; }
    .sh-login:hover, .sh-login:focus-visible { border-color: rgba(255,255,255,.34); background: rgba(255,255,255,.06); }
    .sh-currency-switch select { min-width: 0; padding: 0 22px 0 8px; }
}

@media (max-width: 1080px) {
    .sh-menu-button { display: block; }
    .sh-menu { display: none; position: absolute; top: 72px; right: 24px; left: 24px; max-height: calc(100vh - 90px); padding: 10px; overflow-y: auto; align-items: stretch; flex-direction: column; gap: 0; border: 1px solid rgba(255,255,255,.12); border-radius: 14px; background: #0b1a35; box-shadow: 0 30px 70px rgba(0,0,0,.45); }
    .sh-menu.is-open { display: flex; }.sh-menu-item { display: block; }.sh-menu-trigger { width: 100%; min-height: 48px; padding: 0 12px; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.07); }.sh-submenu, .sh-submenu-compact, .sh-submenu-wide, .sh-submenu-right, .sh-submenu-infrastructure { display: none; position: static; width: auto; padding: 8px; grid-template-columns: 1fr; border: 0; border-radius: 0; background: rgba(255,255,255,.025); box-shadow: none; transform: none; }.sh-menu-item:hover > .sh-submenu { display: none; }.sh-menu-item:hover > .sh-submenu.is-open, .sh-submenu.is-open { display: grid; }.sh-submenu-intro { display: none; }.sh-submenu-links, .sh-submenu-compact .sh-submenu-links, .sh-submenu-groups, .sh-submenu-groups-two { grid-template-columns: 1fr; }.sh-submenu-links a { padding: 11px 13px 11px 52px; }.sh-login { display: none; }
    .sh-mobile-login { display: flex; min-height: 48px; padding: 0 12px; align-items: center; color: #fff !important; font-size: 12px; font-weight: 800; text-decoration: none !important; }
    .sh-mobile-languages { display: flex; padding: 10px 12px 4px; gap: 8px; }
    .sh-mobile-languages a { padding: 8px 11px; border: 1px solid rgba(255,255,255,.12); border-radius: 8px; color: #aebbd0; font-size: 11px; font-weight: 800; text-decoration: none; }
    .sh-mobile-languages a[aria-current="true"] { border-color: rgba(53,216,255,.35); color: var(--sh-cyan); }
    /* The burger held margin-left:auto and pushed the actions off-screen. Let
       the actions claim the free space and keep the burger last on the right. */
    .sh-nav-actions { order: 2; margin-left: auto; }
    .sh-menu-button { order: 3; margin-left: 0; }
    .sh-hero-grid { grid-template-columns: minmax(0, 1fr); }.sh-console { width: 100%; max-width: 650px; }.sh-tech-strip { flex-wrap: wrap; justify-content: flex-start; padding: 30px 0; }
    .sh-live-plan-grid, .sh-live-plan-grid.sh-plan-count-4, .sh-use-case-grid { grid-template-columns: 1fr 1fr; }
    .sh-action-layout { grid-template-columns: 1fr; gap: 35px; }
    .sh-control-grid { grid-template-columns: 1fr; }.sh-dashboard { max-width: 760px; }
    .sh-decision-grid { grid-template-columns: 1fr 1fr; }.sh-assurance-grid, .sh-landing-hero-grid { grid-template-columns: 1fr; gap: 45px; }
    .sh-value-grid { grid-template-columns: 1fr 1fr; }.sh-migration-grid, .sh-faq-layout { grid-template-columns: 1fr; gap: 35px; }
    .sh-footer-top { align-items: flex-start; flex-direction: column; }.sh-footer-sales { width: 100%; min-width: 0; }.sh-footer-grid { grid-template-columns: 1fr 1fr; }.sh-footer-trust { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
    .sh-container { width: min(100% - 28px, 1240px); }.sh-nav { min-height: 72px; gap: 7px; }.sh-brand img { width: 150px; }.sh-nav-cta { display: none; }
    /* Brand + currency + language + burger measured ~350px against a 332px
       container at 360px wide, so the row overflowed and pushed the burger
       off-screen. Everything here exists to make that row actually fit. */
    .sh-brand { min-width: 0; flex-shrink: 1; }
    .sh-brand img { max-width: 100%; }
    .sh-nav-actions { gap: 8px; flex-shrink: 0; }
    .sh-menu-button { flex-shrink: 0; }
    .sh-currency-switch select { min-width: 0; padding: 0 18px 0 6px; }
    .sh-language-switch { flex-shrink: 0; gap: 3px; }
    .sh-cart-link { width: 38px; height: 38px; }
    .sh-hero { padding-top: 72px; }.sh-availability { max-width: 100%; flex-wrap: wrap; font-size: 9px; line-height: 1.5; }.sh-hero h1 { overflow-wrap: anywhere; font-size: 42px; }.sh-hero h1 span { display: block; }.sh-hero-copy > p { font-size: 16px; }.sh-hero .sh-hero-actions { align-items: stretch; flex-direction: column; }.sh-hero .sh-button { width: 100%; }.sh-proof { grid-template-columns: 1fr; }.sh-proof div { padding-top: 16px; }
    .sh-console-body { padding: 22px; }.sh-tech-strip { margin-top: 60px; }
    .sh-solutions, .sh-live-plans, .sh-landing-plans, .sh-control, .sh-final-cta, .sh-decision, .sh-assurance, .sh-landing-section, .sh-action-section { padding: 80px 0; }.sh-section-heading { grid-template-columns: 1fr; gap: 16px; }.sh-solution-grid, .sh-live-plan-grid, .sh-live-plan-grid.sh-plan-count-4, .sh-decision-grid, .sh-value-grid, .sh-use-case-grid { grid-template-columns: 1fr; }.sh-solution-card { min-height: 450px; padding: 26px; }
    .sh-integrated-form { padding: 24px 20px; }.sh-domain-input-row, .sh-form-grid { grid-template-columns: 1fr; }.sh-domain-input-row .sh-button { width: 100%; }
    .sh-landing-hero { padding: 90px 0 70px; }.sh-landing-hero h1 { max-width: 100%; font-size: 38px; overflow-wrap: anywhere; }.sh-landing-summary { min-width: 0; padding: 24px 20px; overflow-wrap: anywhere; }.sh-landing-summary > strong { font-size: 21px; }
    .sh-control-grid { gap: 45px; }.sh-dashboard { grid-template-columns: 52px 1fr; }.sh-dashboard-nav { min-height: 430px; padding: 11px; }.sh-dashboard-content { padding: 24px 18px; }.sh-dashboard-cards { grid-template-columns: 1fr; }.sh-chart { display: none; }
    .sh-domain-grid { grid-template-columns: 1fr; gap: 30px; }.sh-domain form { align-items: stretch; flex-direction: column; }.sh-domain button { min-height: 50px; }
    .sh-footer-grid { grid-template-columns: 1fr 1fr; gap: 35px 22px; }.sh-footer-trust { grid-template-columns: 1fr; }.sh-footer-bottom { align-items: flex-start; flex-direction: column; gap: 12px; }.sh-footer-legal { gap: 12px; }
    .sh-auth { margin: 24px 14px; grid-template-columns: 1fr; }.sh-auth-intro, .sh-auth-card { padding: 30px 24px; }.sh-auth-intro h1 { font-size: 34px; }
    .sh-internal-page:not(.sh-shopping-cart) .card-header .btn,
    .sh-internal-page:not(.sh-shopping-cart) .card-footer .btn,
    .sh-internal-page:not(.sh-shopping-cart) .form-actions .btn,
    .sh-internal-page:not(.sh-shopping-cart) .btn-block { width: 100%; }
    .sh-internal-page:not(.sh-shopping-cart) .btn-group { display: flex; width: 100%; }
    .sh-internal-page:not(.sh-shopping-cart) .btn-group > .btn { min-width: 0; flex: 1 1 auto; }
}
@media (max-width: 480px) {
    .sh-header .sh-language-switch { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
.sh-service-access {
    margin: 0 0 1.5rem;
    padding: clamp(1rem, 2vw, 1.5rem);
    border: 1px solid var(--sh-line, #dbe5f1);
    border-radius: 14px;
    color: var(--sh-navy, #071226);
    background: #fff;
}

.sh-service-access h3 {
    margin: 0 0 1rem;
    font-size: 1.25rem;
}

.sh-service-access__list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem 1.25rem;
    margin: 0;
}

.sh-service-access__list > div {
    min-width: 0;
}

.sh-service-access__list dt {
    margin-bottom: .2rem;
    color: #64748b;
    font-size: .8125rem;
    font-weight: 700;
}

.sh-service-access__list dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.sh-service-access__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .625rem;
    margin-top: 1rem;
}

.sh-service-access__security {
    margin: 1rem 0 0;
    color: #64748b;
    font-size: .8125rem;
}

@media (max-width: 575.98px) {
    .sh-service-access__list {
        grid-template-columns: 1fr;
    }
}
.sh-store-index {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
    padding: clamp(24px, 4vw, 48px);
    border: 1px solid #dfe6ef;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 22px 60px rgba(18, 44, 78, .08);
}

.sh-store-index__heading {
    max-width: 720px;
    margin-bottom: 32px;
}

.sh-store-index__eyebrow {
    margin: 0 0 8px;
    color: #3978ff;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.sh-store-index__heading h1 {
    margin: 0 0 12px;
    color: #071226;
    font-size: clamp(2rem, 4vw, 3.5rem);
    font-weight: 800;
    letter-spacing: -.045em;
}

.sh-store-index__heading > p:last-child {
    color: #607089;
    font-size: 1rem;
}

.sh-store-group-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.sh-store-group-card {
    display: flex;
    min-height: 230px;
    padding: 24px;
    flex-direction: column;
    border: 1px solid #dfe6ef;
    border-radius: 15px;
    color: #071226 !important;
    background: linear-gradient(145deg, #fff, #f7faff);
    text-decoration: none !important;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.sh-store-group-card:hover,
.sh-store-group-card:focus-visible {
    border-color: #3978ff;
    box-shadow: 0 14px 35px rgba(57, 120, 255, .12);
    transform: translateY(-2px);
}

.sh-store-group-card__count {
    align-self: flex-start;
    margin-bottom: 28px;
    padding: 5px 9px;
    border-radius: 99px;
    color: #245fd9;
    background: #eaf1ff;
    font-size: .7rem;
    font-weight: 800;
}

.sh-store-group-card h2 {
    margin: 0 0 8px;
    color: #071226;
    font-size: 1.2rem;
    font-weight: 800;
}

.sh-store-group-card p {
    margin: 0 0 22px;
    color: #607089;
    font-size: .875rem;
}

.sh-store-group-card strong {
    margin-top: auto;
    color: #3978ff;
    font-size: .82rem;
}

@media (max-width: 900px) {
    .sh-store-group-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575px) {
    .sh-store-index { width: min(100% - 20px, 1180px); padding: 22px 16px; border-radius: 14px; }
    .sh-store-group-grid { grid-template-columns: 1fr; }
    .sh-store-group-card { min-height: 190px; }
}

/* A product-group page is still catalog discovery. The order-form stylesheet
 * hides sidebars globally to focus cart/checkout; restore the category chooser
 * only on products.tpl, which marks itself with .sh-store-products. */
body.sh-shopping-cart #order-standard_cart.sh-store-products > .row {
    display: flex;
    margin-inline: -12px;
    align-items: flex-start;
    flex-wrap: nowrap;
}

body.sh-shopping-cart #order-standard_cart.sh-store-products .cart-sidebar {
    display: block !important;
    width: 250px !important;
    max-width: 250px !important;
    padding-inline: 12px !important;
    flex: 0 0 250px !important;
}

body.sh-shopping-cart #order-standard_cart.sh-store-products .cart-body {
    width: calc(100% - 250px) !important;
    max-width: calc(100% - 250px) !important;
    padding-inline: 12px !important;
    flex: 1 1 auto !important;
}

body.sh-shopping-cart #order-standard_cart.sh-store-products .cart-sidebar .panel {
    overflow: hidden;
    border: 1px solid #dfe6ef;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(17, 43, 78, .06);
}

body.sh-shopping-cart #order-standard_cart.sh-store-products .cart-sidebar .list-group-item {
    padding: 11px 14px;
    color: #40536d;
    border-color: #e8eef5;
    font-size: .8125rem;
}

body.sh-shopping-cart #order-standard_cart.sh-store-products .cart-sidebar .list-group-item.active {
    color: #fff;
    border-color: #3978ff;
    background: #3978ff;
}

@media (max-width: 767px) {
    body.sh-shopping-cart #order-standard_cart.sh-store-products > .row {
        display: block;
        margin-inline: 0;
    }

    body.sh-shopping-cart #order-standard_cart.sh-store-products .cart-sidebar {
        display: none !important;
    }

    body.sh-shopping-cart #order-standard_cart.sh-store-products .cart-body {
        width: 100% !important;
        max-width: 100% !important;
        padding-inline: 0 !important;
    }
}

/* Self-service block / unblock panel on the service overview tab. It shares the
 * card treatment of .sh-service-access so both read as one column. */
.sh-service-block {
    margin: 0 0 1.5rem;
    padding: clamp(1rem, 2vw, 1.5rem);
    border: 1px solid var(--sh-line, #dbe5f1);
    border-radius: 14px;
    color: var(--sh-navy, #071226);
    background: #fff;
}

.sh-service-block h3 {
    margin: 0 0 1rem;
    font-size: 1.25rem;
}

.sh-service-block__state {
    margin: 0 0 .75rem;
    color: #64748b;
    font-size: .875rem;
}

.sh-service-block__warning {
    margin: 0 0 1rem;
    padding: .875rem 1rem;
    border-left: 3px solid var(--yellow-300, #f0b429);
    border-radius: 0 8px 8px 0;
    background: #fdf6e3;
    font-size: .875rem;
    line-height: 1.55;
}

.sh-service-block form {
    margin: 0;
}

/* The credit balance is the only figure in the sidebar, so it is centred rather
 * than left-aligned like the surrounding menu labels. */
.sh-credit-amount {
    margin: .35rem 0 0;
    text-align: center;
}

/* Lead line and help-centre link inside the technical details card. */
.sh-service-access__intro {
    margin: -.35rem 0 1rem;
    color: #64748b;
    font-size: .875rem;
}

.sh-service-access__help {
    margin: 1rem 0 0;
    font-size: .875rem;
}

.sh-service-access__list dd br {
    line-height: 1.7;
}

/* ---------------------------------------------------------------------------
   Legal documents (/es|en/legal/*)
   Optimised for reading a contract: a measure near 70 characters, clause
   numbers in the margin so they can be scanned and cited, and a table of
   contents that sticks on wide screens.
   --------------------------------------------------------------------------- */
.sh-legal-hero {
    padding: clamp(2.5rem, 6vw, 4.5rem) 0 clamp(2rem, 4vw, 3rem);
    color: #fff;
    background: linear-gradient(135deg, #071226, #102b55);
}

.sh-legal-hero h1 {
    margin: .35rem 0 .75rem;
    font-size: clamp(1.9rem, 4vw, 3rem);
    letter-spacing: -.03em;
}

.sh-legal-lede {
    max-width: 60ch;
    margin: 0;
    color: #b9c7db;
}

/* The page background is navy; without its own surface the clause text rendered
 * dark on dark and the document was unreadable. */
.sh-legal-surface {
    color: var(--sh-ink);
    background: #fff;
}

.sh-legal-body {
    padding: clamp(2rem, 4vw, 3.5rem) 0 4rem;
}

.sh-legal-document h2,
.sh-legal-toc h2,
.sh-legal-clause > span,
.sh-legal-list li,
.sh-legal-table td {
    color: var(--sh-ink);
}

.sh-legal-notice {
    max-width: 72ch;
    margin: 0 0 2rem;
    padding: 1rem 1.25rem;
    border-left: 3px solid var(--sh-cyan, #35d8ff);
    border-radius: 0 10px 10px 0;
    background: #f1f8ff;
    font-size: .9375rem;
    line-height: 1.6;
}

.sh-legal-toc {
    margin: 0 0 3rem;
    padding: clamp(1.25rem, 2.5vw, 1.75rem);
    border: 1px solid var(--sh-line, #dbe5f1);
    border-radius: 14px;
    background: #f8fbff;
}

.sh-legal-toc h2 {
    margin: 0 0 1rem;
    font-size: 1.15rem;
}

.sh-legal-toc ol {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: .5rem 2rem;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: none;
}

.sh-legal-toc a {
    display: block;
    padding: .3rem 0;
    font-size: .9375rem;
    text-decoration: none;
}

.sh-legal-toc a:hover,
.sh-legal-toc a:focus-visible {
    text-decoration: underline;
}

.sh-legal-document > section {
    margin: 0 0 2.75rem;
    /* Anchored clause links land clear of the sticky header. */
    scroll-margin-top: 5rem;
}

.sh-legal-document h2 {
    display: flex;
    gap: .65rem;
    max-width: 46ch;
    margin: 0 0 1.1rem;
    padding-bottom: .6rem;
    align-items: baseline;
    border-bottom: 1px solid var(--sh-line, #dbe5f1);
    font-size: clamp(1.2rem, 2.2vw, 1.5rem);
    letter-spacing: -.02em;
}

.sh-legal-section-number {
    color: var(--sh-blue, #3978ff);
    font-variant-numeric: tabular-nums;
}

.sh-legal-clause {
    display: grid;
    grid-template-columns: 3.75rem 1fr;
    gap: 0 .75rem;
    max-width: 76ch;
    margin: 0 0 1rem;
    scroll-margin-top: 5rem;
}

.sh-legal-clause > span {
    line-height: 1.68;
}

.sh-legal-clause-number {
    color: #64748b;
    font-size: .875rem;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    text-decoration: none;
    /* Sits on the text baseline of the clause it labels. */
    line-height: 1.68;
}

.sh-legal-clause-number:hover,
.sh-legal-clause-number:focus-visible {
    color: var(--sh-blue, #3978ff);
    text-decoration: underline;
}

.sh-legal-list {
    max-width: 72ch;
    margin: -.35rem 0 1.25rem 4.5rem;
    padding: 0;
}

.sh-legal-list li {
    margin-bottom: .4rem;
    line-height: 1.62;
}

/* The two tables left in the documents — the availability credits and the
 * retention periods — have two columns each, so they sit within the reading
 * measure rather than stretching across the page. */
.sh-legal-table-wrap {
    max-width: min(100%, 40rem);
    margin: 0 0 1.5rem 4.5rem;
    overflow-x: auto;
}

.sh-legal-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .9375rem;
}

.sh-legal-table th,
.sh-legal-table td {
    padding: .6rem .9rem;
    border: 1px solid var(--sh-line, #dbe5f1);
    text-align: left;
}

.sh-legal-table th {
    background: #f2f7fd;
    font-weight: 700;
}

.sh-legal-footer {
    margin-top: 3rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--sh-line, #dbe5f1);
    color: #64748b;
    font-size: .875rem;
}

.sh-legal-related {
    display: flex;
    gap: .6rem;
    margin: .5rem 0 0;
    flex-wrap: wrap;
}

@media (max-width: 575.98px) {
    .sh-legal-clause {
        grid-template-columns: 1fr;
        gap: .15rem;
    }

    .sh-legal-list,
    .sh-legal-table-wrap {
        margin-left: 0;
    }
}

@media print {
    .sh-header, .sh-footer, .sh-legal-toc { display: none !important; }
    .sh-legal-hero { padding: 0 0 1rem; color: #000; background: none; }
    .sh-legal-hero h1 { color: #000; }
    .sh-legal-document > section { break-inside: auto; }
    .sh-legal-clause { break-inside: avoid; }
}

/* Citations to the other contract documents. They are the only route to the
 * domain agreement, which the footer does not list, so they have to read as
 * links rather than as running text. */
.sh-legal-link {
    color: var(--sh-blue, #3978ff);
    text-decoration: underline;
    text-underline-offset: 2px;
    overflow-wrap: anywhere;
}

.sh-legal-link:hover,
.sh-legal-link:focus-visible {
    color: var(--sh-navy, #071226);
}

/* Justified body text, the usual setting for a contract. Hyphenation goes with
 * it: justifying without breaking words opens rivers of whitespace between the
 * words, and the clause column is narrow enough for that to show. The document
 * carries lang="es" or lang="en", so the browser hyphenates per language.
 * Headings, the table of contents and table cells stay ragged-right. */
.sh-legal-clause > span,
.sh-legal-list li,
.sh-legal-document p,
.sh-legal-notice {
    text-align: justify;
    hyphens: auto;
    -webkit-hyphens: auto;
}

/* A URL cannot be hyphenated and does not shrink, so a clause that is mostly a
 * citation would stretch its remaining spaces across the line. */
.sh-legal-clause > span:has(.sh-legal-link) {
    text-align: left;
}

/* Los paneles anchos tenían 940 px fijos anclados al borde de su disparador.
 * «Web» y «Cloud y Servidores» están a la derecha de la barra, así que en
 * pantallas de menos de ~1400 px el panel se salía y la tercera columna
 * quedaba cortada. Ahora se anclan a la barra —no al disparador— y ocupan su
 * ancho: como la barra siempre entra en la ventana, el panel tampoco puede
 * desbordar, y las tres columnas se estrechan solas al achicarse la pantalla. */
@media (min-width: 1081px) {
    .sh-nav {
        position: relative;
    }

    .sh-menu-item-wide {
        position: static;
    }

    .sh-submenu-wide {
        left: 0;
        right: 0;
        width: auto;
        transform: none;
    }
}

/* ---------------------------------------------------------------------------
   Reseñas y página de partner
   --------------------------------------------------------------------------- */
.sh-testimonials-hero,
.sh-partner-hero {
    padding: clamp(2.5rem, 6vw, 4.5rem) 0 clamp(2rem, 4vw, 3rem);
    color: #fff;
    background: linear-gradient(135deg, #071226, #102b55);
}

.sh-testimonials-hero h1,
.sh-partner-hero h1 {
    margin: .35rem 0 .75rem;
    font-size: clamp(1.9rem, 4vw, 3rem);
    letter-spacing: -.03em;
}

.sh-testimonials-lede,
.sh-partner-lede {
    max-width: 62ch;
    margin: 0;
    color: #b9c7db;
}

.sh-rating-summary {
    display: flex;
    gap: 1.5rem;
    margin-top: 2rem;
    align-items: center;
    flex-wrap: wrap;
}

.sh-rating-score {
    display: flex;
    align-items: baseline;
    gap: .6rem;
}

.sh-rating-score strong {
    color: #fff;
    font-size: clamp(2rem, 4vw, 2.75rem);
    line-height: 1;
}

.sh-rating-stars,
.sh-review-stars {
    color: #f5b60a;
    letter-spacing: .08em;
}

.sh-review-stars {
    font-size: .8rem;
}

.sh-rating-meta {
    margin: 0;
    color: #b9c7db;
    font-size: .9375rem;
}

/* La aclaración de cuántas se publican va junto al total, no escondida: el
 * promedio corresponde a la ficha completa, no a la selección mostrada. */
.sh-rating-note {
    display: block;
    margin-top: .2rem;
    color: #8fa5c2;
    font-size: .8125rem;
}

.sh-testimonials-body,
.sh-partner-body {
    padding: clamp(2.5rem, 5vw, 4rem) 0 clamp(3rem, 6vw, 5rem);
    color: var(--sh-ink);
    background: #fff;
}

.sh-keyword-cloud {
    margin-bottom: clamp(2rem, 4vw, 3rem);
    padding: clamp(1.25rem, 3vw, 2rem);
    border: 1px solid var(--sh-line, #dbe5f1);
    border-radius: 16px;
    background: #f8fbff;
}

.sh-keyword-cloud h2 {
    margin: 0 0 1rem;
    font-size: 1.15rem;
}

.sh-keyword-cloud ul {
    display: flex;
    gap: .5rem 1.1rem;
    margin: 0;
    padding: 0;
    align-items: baseline;
    flex-wrap: wrap;
    list-style: none;
}

.sh-keyword-cloud li {
    color: var(--sh-blue, #3978ff);
    font-weight: 700;
    line-height: 1.3;
}

.sh-review-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 18px;
}

.sh-review-grid-compact {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.sh-review-card {
    display: flex;
    margin: 0;
    padding: 22px;
    flex-direction: column;
    border: 1px solid var(--sh-line, #dbe5f1);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(17, 43, 78, .05);
}

.sh-review-card header {
    display: flex;
    gap: .75rem;
    margin-bottom: .9rem;
    align-items: center;
}

.sh-review-avatar {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    place-items: center;
    border-radius: 50%;
    color: #245fd9;
    background: #eaf1ff;
    font-size: .8125rem;
    font-weight: 800;
}

.sh-review-card header b {
    display: block;
    font-size: .9375rem;
}

.sh-review-card blockquote {
    margin: 0;
    padding: 0;
    border: 0;
}

.sh-review-card blockquote p {
    margin: 0;
    color: #40536d;
    font-size: .9375rem;
    line-height: 1.65;
}

.sh-review-card figcaption {
    margin-top: .9rem;
    color: #8a99ad;
    font-size: .8125rem;
}

.sh-review-empty {
    padding: 2rem;
    border: 1px dashed var(--sh-line, #dbe5f1);
    border-radius: 14px;
    color: #64748b;
    text-align: center;
}

.sh-review-cta,
.sh-partner-cta {
    margin-top: clamp(2.5rem, 5vw, 4rem);
    padding: clamp(1.5rem, 3vw, 2.5rem);
    border: 1px solid var(--sh-line, #dbe5f1);
    border-radius: 18px;
    background: #f8fbff;
    text-align: center;
}

.sh-review-cta h2,
.sh-partner-cta h2 {
    margin: 0 0 .5rem;
    font-size: clamp(1.3rem, 2.5vw, 1.7rem);
}

.sh-review-cta p,
.sh-partner-cta p {
    max-width: 58ch;
    margin: 0 auto 1.25rem;
    color: #64748b;
}

/* Bloque de reseñas dentro de las landings de producto. */
.sh-landing-reviews {
    background: var(--sh-paper, #f4f7fb);
}

.sh-landing-reviews-head {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.75rem;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
}

.sh-landing-reviews-head h2 {
    margin: 0;
    font: 700 clamp(1.5rem, 3vw, 2.25rem)/1.15 var(--sh-font-heading);
    letter-spacing: -.03em;
}

.sh-landing-reviews-head p {
    margin: 0;
    color: #64748b;
}

.sh-landing-reviews-head strong {
    color: var(--sh-ink);
    font-size: 1.35rem;
}

.sh-landing-reviews-head span {
    display: block;
    font-size: .875rem;
}

.sh-landing-reviews-link,
.sh-partner-reviews-link {
    margin: 1.5rem 0 0;
}

/* Página de partner */
.sh-partner-intro {
    max-width: 72ch;
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.sh-partner-intro h2,
.sh-partner-points h2,
.sh-partner-badges h2,
.sh-partner-reviews h2 {
    margin: 0 0 1rem;
    font: 700 clamp(1.4rem, 2.6vw, 2rem)/1.2 var(--sh-font-heading);
    letter-spacing: -.02em;
}

.sh-partner-intro p {
    color: #40536d;
    line-height: 1.7;
}

.sh-partner-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 18px;
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.sh-partner-grid article {
    padding: 24px;
    border: 1px solid var(--sh-line, #dbe5f1);
    border-radius: 16px;
    background: #fff;
}

.sh-partner-grid h3 {
    margin: 0 0 .5rem;
    font-size: 1.05rem;
}

.sh-partner-grid p {
    margin: 0;
    color: #64748b;
    font-size: .9375rem;
    line-height: 1.6;
}

.sh-partner-badges ul {
    display: flex;
    gap: 20px;
    margin: 0 0 clamp(2rem, 4vw, 3rem);
    padding: 0;
    align-items: center;
    flex-wrap: wrap;
    list-style: none;
}

.sh-partner-badges img {
    height: auto;
    max-width: 150px;
}

@media (max-width: 575.98px) {
    .sh-review-grid,
    .sh-review-grid-compact {
        grid-template-columns: 1fr;
    }
}

/* Certificaciones de cPanel University. Dos columnas en escritorio: seis en una
 * sola lista quedan largas y en tres se parten los nombres. */
.sh-partner-certs {
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.sh-partner-certs-lede {
    max-width: 68ch;
    margin: 0 0 1.5rem;
    color: #64748b;
}

.sh-partner-cert-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 20px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sh-partner-cert-list li {
    display: flex;
    padding: 20px 14px;
    align-items: center;
    flex-direction: column;
    border: 1px solid var(--sh-line, #dbe5f1);
    border-radius: 14px;
    background: #fff;
    text-align: center;
}

.sh-partner-cert-list img {
    width: 96px;
    height: 96px;
    margin-bottom: .9rem;
}

/* Una certificación no acreditada se atenúa en lugar de mostrarse como propia. */
.sh-partner-cert-list li.is-pending {
    background: #f8fafc;
}

.sh-partner-cert-list li.is-pending img {
    filter: grayscale(1);
    opacity: .45;
}

.sh-partner-cert-list b {
    display: block;
    color: var(--sh-ink);
    font-size: .875rem;
    line-height: 1.35;
}

.sh-cert-abbr {
    display: inline-block;
    margin-top: .45rem;
    padding: 2px 8px;
    border-radius: 99px;
    color: #245fd9;
    background: #eaf1ff;
    font-size: .6875rem;
    font-weight: 800;
    letter-spacing: .04em;
}

.sh-partner-profile {
    margin: 1.5rem 0 0;
    padding: 1rem 1.25rem;
    border-left: 3px solid var(--sh-cyan, #35d8ff);
    border-radius: 0 10px 10px 0;
    background: #f1f8ff;
    color: #40536d;
    font-size: .9375rem;
    line-height: 1.65;
}