/* Finishing details for the public site. The four capabilities stay outside the CMS editor. */
html { scroll-padding-top: 96px; }
.public-header {
  position: sticky;
  top: 0;
  z-index: 50;
  min-height: 84px;
  background: #ffffffed;
  border-color: #dbe4f3;
  box-shadow: 0 8px 32px #12245b09;
  backdrop-filter: blur(18px);
}
.public-header .brand { gap: 14px; }
.public-header .brand img { filter: drop-shadow(0 7px 9px #0e4bb123); }
.public-header .brand small { color: #56709c; letter-spacing: .17em; }
.public-header nav { align-items: center; }
.public-header nav a {
  position: relative;
  padding: 10px 0;
  color: #273a68;
  font-weight: 650;
  white-space: nowrap;
}
.public-header nav a::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 3px;
  left: 0;
  height: 2px;
  background: #107fff;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .2s ease;
}
.public-header nav a:hover { color: #075bc1; text-decoration: none; }
.public-header nav a:hover::after,
.public-header nav a:focus-visible::after { transform: scaleX(1); }
.public-header .client-access {
  gap: 20px;
  border-color: #0e2768;
  background: #0d2461;
  color: #fff;
  font-weight: 700;
  box-shadow: 0 8px 18px #0b26633b;
  transition: background .2s ease, transform .2s ease;
}
.public-header .client-access:hover { background: #075cd0; transform: translateY(-2px); }
.public-header .client-access span { font-size: 17px; line-height: 1; }
.public-header .client-access .client-access-full { font-size: inherit; }
.public-header .client-access .client-access-short { display: none; font-size: inherit; }
.public-menu { display: none; }

.hero-rebuild__top { border-bottom-color: #bad0fa48; }
.hero-rebuild__signature { display: flex; align-items: center; gap: 10px; }
.hero-rebuild__signature-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  flex: none;
  border-radius: 50%;
  background: #8ac5ff;
  box-shadow: 0 0 16px #45a3ff;
}
.hero-rebuild__tag { border-color: #d3e5ff7a; backdrop-filter: blur(12px); }

.service-rail {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  background: linear-gradient(110deg, #112eb2, #0b267e);
}
.service-rail a { min-width: 0; padding: 24px 22px; transition: background .2s ease; }
.service-rail a:hover { background: #ffffff16; text-decoration: none; }
.service-rail a:first-child { padding-left: 0; }
.service-rail strong { gap: 7px; font-size: clamp(15px, 1.3vw, 19px); }
.service-rail strong span { color: #a8d2ff; }

.services-public { padding-top: 72px; padding-bottom: 78px; }
.services-public .section-heading { position: relative; margin-bottom: 24px; padding-bottom: 25px; border-bottom: 1px solid #83a9dd75; }
.services-public .section-heading::after { content: ""; position: absolute; bottom: -1px; left: 0; width: 116px; height: 2px; background: #237bdb; }
.services-public .section-heading h2 { font-size: clamp(40px, 3.8vw, 57px); }
.service-grid { gap: 14px; border: 0; }
.service-grid article {
  position: relative;
  grid-template-columns: 50px minmax(0, 1fr);
  min-height: 0;
  padding: 24px 27px;
  border: 1px solid #dce5f4;
  border-radius: 15px;
  background: linear-gradient(148deg, #fff 62%, #f7faff);
  box-shadow: 0 12px 35px #17275d0c;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.service-grid article:hover { transform: translateY(-3px); border-color: #b4cbf5; box-shadow: 0 18px 42px #17275d1a; }
.service-grid .service-num { grid-row: auto; padding-top: 3px; font-size: 12px; font-weight: 800; }
.service-copy { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.service-tag { display: inline-block; margin: 0 0 8px; color: #3970c2; font-size: 9px; font-weight: 800; letter-spacing: .17em; }
.service-grid h3 { margin-bottom: 10px; font-size: clamp(25px, 2vw, 31px); }
.service-grid p { max-width: 465px; margin-bottom: 12px; line-height: 1.6; }
.service-features { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0 0 16px; padding: 0; }
.service-features li { padding: 4px 8px; border: 1px solid #dbe7fa; border-radius: 4px; background: #f0f5fd; color: #4c648c; font-size: 10px; font-weight: 650; }
.service-copy > a { display: inline-flex; align-items: center; gap: 12px; margin-top: auto; padding-top: 0; }
.service-grid article:last-child { background: radial-gradient(circle at 86% 12%, #2460c080, transparent 38%), #0a1b50; border-color: #193875; }
.service-grid article:last-child h3 { color: #fff; }
.service-grid article:last-child p { color: #c5d4f0; }
.service-grid article:last-child .service-tag,
.service-grid article:last-child .service-num,
.service-grid article:last-child a { color: #93c5ff; }
.service-grid article:last-child .service-features li { background: #ffffff12; color: #e5efff; border-color: #ffffff2e; }

/* Trama editorial suave: da profundidad sin añadir otra imagen ni tapar el texto. */
.services-public::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(circle at center, #1554bd36 0 1px, transparent 1.6px) 0 0 / 23px 23px, radial-gradient(ellipse 480px 260px at 92% 10%, #197bdb20, transparent 74%); mask-image: linear-gradient(90deg, transparent 12%, #000 75%); opacity: .55; }
.service-grid article { overflow: hidden; }
.service-grid article::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(90deg, var(--service-accent, #2a7de2) 0 3px, transparent 3px), radial-gradient(circle at 92% 94%, #2e83de16 0 65px, transparent 66px), repeating-linear-gradient(135deg, transparent 0 16px, #2b69af07 16px 17px); }
.service-grid article::after { content: ""; position: absolute; right: -77px; bottom: -113px; z-index: 0; width: 250px; height: 250px; border: 1px solid #267cda30; border-radius: 50%; box-shadow: 0 0 0 38px #277cdd0a, 0 0 0 78px #277cdd08; pointer-events: none; }
.service-grid article > :not(.service-icon) { position: relative; z-index: 1; }
.service-grid article:nth-child(2) { --service-accent: #5778d9; }
.service-grid article:nth-child(3) { --service-accent: #218caa; }
.service-grid article:nth-child(4) { --service-accent: #74b5ff; }
.service-grid article:last-child::before { background: linear-gradient(90deg, #71bdff 0 3px, transparent 3px), radial-gradient(circle at 92% 94%, #5ea9ff1c 0 65px, transparent 66px), repeating-linear-gradient(135deg, transparent 0 16px, #b3d7ff08 16px 17px); }
.service-grid article:last-child::after { border-color: #9ed0ff30; box-shadow: 0 0 0 38px #9ed0ff0a, 0 0 0 78px #9ed0ff08; }

.support-public {
  background: radial-gradient(circle at 0 100%, #dce9ff, transparent 48%), #eef3fd;
  border-top: 1px solid #e1eaf9;
  border-bottom: 1px solid #dfe8f7;
}
.support-public h2 { font-size: clamp(38px, 3.5vw, 53px); }
.support-public .action { box-shadow: 0 12px 26px #11286630; }
.support-example { border-radius: 18px; box-shadow: 0 28px 64px #22397118; }
.support-example .example-row { padding: 21px 0; }
.support-backup-note {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 10px;
  padding: 17px;
  border-radius: 10px;
  background: #eaf2ff;
  color: #154cb2;
}
.support-backup-note > span { display: grid; place-items: center; width: 34px; height: 34px; flex: none; border-radius: 8px; background: #cbdfff; font-size: 18px; }
.support-public .support-backup-note p { margin: 0; color: #154cb2; }
.support-backup-note strong, .support-backup-note small { display: block; }
.support-backup-note strong { font-size: 12px; }
.support-backup-note small { margin-top: 2px; color: #536c9b; font-size: 10px; }

.method-public { padding-top: 92px; padding-bottom: 92px; }
.method-grid article { border-color: #167bff; }
.method-grid span { font-size: 12px; font-weight: 800; }
.method-grid h3 { margin-top: 19px; }
.contact-public { background: radial-gradient(circle at 0 0, #193370, transparent 45%), #0a1644; }
.contact-public form { padding: 24px; border: 1px solid #ffffff2a; border-radius: 18px; background: #ffffff08; }
.contact-public input:not([type=checkbox]):focus,
.contact-public textarea:focus,
.contact-public select:focus { border-color: #86bcff; background: #ffffff13; }
.public-footer { border-top: 1px solid #2d4478; }
.public-footer nav a:hover { color: #fff; }
.maintenance-page .maintenance-shell .logo img { display: block; width: 58px; height: 58px; padding: 8px; border-radius: 50%; background: #fff; object-fit: contain; box-shadow: 0 0 0 1px #ffffff80, 0 10px 28px #000a2955; }

/* Los fondos se muestran como imágenes reales bajo capas que mantienen la lectura. */
.services-public, .support-public, .method-public, .contact-public { position: relative; isolation: isolate; overflow: hidden; }
.services-public, .method-public { max-width: none; }
.services-public > :not(.section-art), .support-public > :not(.section-art),
.method-public > :not(.section-art), .contact-public > :not(.section-art) { position: relative; z-index: 2; }
.section-art { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: var(--home-bg-fit, cover); object-position: var(--home-bg-x, 50%) var(--home-bg-y, 50%); opacity: var(--home-bg-opacity, 1); transform: scale(var(--home-bg-zoom, 1)); pointer-events: none; }
.services-public { --home-bg-opacity: .72; --home-bg-y: 52%; }
.support-public { --home-bg-opacity: .62; }
.method-public { --home-bg-opacity: .68; --home-bg-y: 64%; }
.contact-public { --home-bg-opacity: .96; }
.services-public::before, .support-public::before, .method-public::before, .contact-public::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.services-public::before { background: linear-gradient(180deg, #ffffffe5 0%, #f7faff82 36%, #f7faffa6 100%); opacity: var(--home-bg-overlay, 1); }
.support-public::before { background: linear-gradient(100deg, #eef4ffdb 0%, #eef4ff9c 49%, #eef4ffbb 100%); opacity: var(--home-bg-overlay, 1); }
.method-public::before { background: linear-gradient(180deg, #ffffffe5 0%, #ffffff96 48%, #ffffffb6 100%); opacity: var(--home-bg-overlay, 1); }
.contact-public::before { background: linear-gradient(105deg, #07143ab5 0%, #0919419e 54%, #071330a6 100%); opacity: var(--home-bg-overlay, 1); }
.services-public .section-heading, .services-public .service-grid,
.method-public .section-heading, .method-public .method-grid { width: 100%; max-width: 1330px; margin-right: auto; margin-left: auto; }
.services-public .section-heading > p:last-child, .method-public .section-heading > p:last-child { max-width: 560px; font-size: 15px; line-height: 1.8; }
.services-public .section-heading h2 { max-width: 650px; }
.section-signal { display: inline-flex; gap: 3px; vertical-align: middle; margin-right: 8px; }
.section-signal i { display: block; width: 5px; height: 5px; border-radius: 50%; background: #147cff; animation: signal-pulse 2s ease-in-out infinite; }
.section-signal i:nth-child(2) { animation-delay: .2s; }.section-signal i:nth-child(3) { animation-delay: .4s; }.section-signal i:nth-child(4) { animation-delay: .6s; }
@keyframes signal-pulse { 50% { opacity: .38; transform: translateY(-3px); } }
.service-grid article { background: #fffffff0; backdrop-filter: blur(9px); }
.service-grid article:last-child { background: #0a1b50eb; backdrop-filter: blur(9px); }
.service-grid .service-num { grid-column: 1; grid-row: 1; }
.service-grid .service-copy { grid-column: 2; grid-row: 1; }
.service-icon { position: absolute; z-index: 1; top: 21px; right: 22px; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 13px; background: #e7f2ff; color: #1269d7; box-shadow: 0 8px 22px #15478b18; transition: transform .3s ease, background .3s ease; }
.service-icon svg { width: 27px; height: 27px; }
.service-grid article:hover .service-icon { transform: rotate(-7deg) scale(1.08); background: #d5e9ff; }
.service-grid article:last-child .service-icon { background: #ffffff1c; color: #d9ecff; }
.service-grid article:last-child:hover .service-icon { background: #ffffff30; }
.service-grid h3 { padding-right: 32px; }
.service-grid p { max-width: 510px; font-size: 13px; line-height: 1.6; }
.support-public > div:first-of-type { max-width: 570px; }
.support-public p:not(.overline) { max-width: 540px; font-size: 14px; line-height: 1.8; }
.support-example { background: #fffffff2; backdrop-filter: blur(12px); }
.support-example .example-row { transition: transform .25s ease, background .25s ease; }
.support-example .example-row:hover { transform: translateX(5px); background: #f4f8ff; }
.method-public .section-heading { margin-bottom: 55px; }
.method-grid { gap: 22px; }
.method-grid article { min-height: 260px; padding: 24px 20px; border: 1px solid #d9e5f7; border-top: 3px solid #177fff; border-radius: 12px; background: #ffffffd9; backdrop-filter: blur(10px); box-shadow: 0 14px 36px #19396a0c; transition: transform .25s ease, box-shadow .25s ease; }
.method-grid article:hover { transform: translateY(-5px); box-shadow: 0 20px 45px #19396a20; }
.method-grid article span { color: #0e69d1; letter-spacing: .14em; }
.method-grid article p { font-size: 13px; line-height: 1.75; }
.contact-public > div > p:not(.overline) { max-width: 520px; color: #d0def5; line-height: 1.85; }
.contact-public form { background: #0a1c51c9; backdrop-filter: blur(13px); }
.has-scroll-reveal .service-grid article, .has-scroll-reveal .method-grid article,
.has-scroll-reveal .support-example .example-row { opacity: 0; transform: translateY(22px); transition: opacity .65s ease, transform .65s ease, box-shadow .25s ease; }
.has-scroll-reveal .service-grid article.is-inview, .has-scroll-reveal .method-grid article.is-inview,
.has-scroll-reveal .support-example .example-row.is-inview { opacity: 1; transform: translateY(0); }
.has-scroll-reveal .service-grid article.is-inview:hover, .has-scroll-reveal .method-grid article.is-inview:hover { transform: translateY(-5px); }
.has-scroll-reveal .support-example .example-row.is-inview:hover { transform: translateX(5px); }

@media (max-width: 1100px) {
  .service-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-rail a:nth-child(2) { border-right: 0; }
  .service-rail a:first-child { padding-left: 22px; }
  .service-rail strong { font-size: 18px; }
}
@media (max-width: 700px) {
  .public-header { min-height: 72px; }
  .public-header .brand small { font-size: 7px; }
  .public-menu { display: block; margin-left: auto; }
  .public-menu summary { display: flex; align-items: center; gap: 6px; list-style: none; padding: 8px 10px; border: 1px solid #d3dff1; border-radius: 6px; color: #193368; font-size: 10px; font-weight: 750; cursor: pointer; }
  .public-menu summary::-webkit-details-marker { display: none; }
  .public-menu summary span { font-size: 16px; line-height: 1; }
  .public-header .public-menu nav { position: absolute; top: calc(100% - 1px); right: 5%; left: 5%; display: grid; gap: 0; padding: 9px 16px; border: 1px solid #d5e0f0; border-radius: 0 0 12px 12px; background: #fff; box-shadow: 0 20px 38px #101f4a25; }
  .public-header .public-menu:not([open]) nav { display: none; }
  .public-header .public-menu nav a { display: block; padding: 12px 3px; border-bottom: 1px solid #edf1f7; font-size: 12px; }
  .public-header .public-menu nav a:last-child { border: 0; }
  .public-header .client-access .client-access-full { display: none; }
  .public-header .client-access .client-access-short { display: inline; }
  .service-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-rail a, .service-rail a:first-child { display: block; min-width: 0; padding: 16px 12px; border-right: 1px solid #ffffff25; border-bottom: 1px solid #ffffff25; }
  .service-rail a:nth-child(2n) { border-right: 0; }
  .service-rail a:nth-last-child(-n + 2) { border-bottom: 0; }
  .service-rail small { display: block; width: auto; margin-bottom: 7px; }
  .service-rail strong { font-size: clamp(14px, 3.8vw, 17px); }
  .services-public { padding-top: 52px; padding-bottom: 58px; }
  .services-public .section-heading { margin-bottom: 18px; padding-bottom: 20px; }
  .services-public .section-heading h2 { font-size: 39px; }
  .service-grid { grid-template-columns: 1fr; gap: 12px; }
  .service-grid article { min-height: 0; padding: 20px; grid-template-columns: 34px minmax(0, 1fr); }
  .service-grid h3 { font-size: 27px; }
  .service-icon { top: 18px; right: 18px; width: 43px; height: 43px; }
  .service-icon svg { width: 24px; height: 24px; }
  .support-public { gap: 28px; }
  .contact-public form { padding: 18px; }
}
@media (max-width: 390px) {
  .public-header { gap: 8px; }
  .public-header .brand { gap: 7px; font-size: 22px; }
  .public-header .brand img { width: 32px; height: 37px; }
  .public-header .client-access { gap: 6px; padding: 10px; font-size: 10px; }
  .service-features li { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .service-grid article, .public-header nav a::after, .public-header .client-access { transition: none; }
  .section-signal i { animation: none; }
}