:root{
  --bg:#08111d;
  --bg2:#0c1726;
  --bg3:#111d2e;
  --bg4:#0a1421;
  --text:#f3f6fa;
  --muted:#a6b2c3;
  --muted2:#7f8ca0;
  --line:rgba(255,255,255,.12);
  --line2:rgba(255,255,255,.19);
  --accent:#3d73f1;
  --accent2:#a8bfff;
  --success:#3bd9a6;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit}
.container{width:min(calc(100% - 2rem),var(--max));margin-inline:auto}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:1rem;top:1rem;background:#fff;color:#000;padding:.7rem 1rem;z-index:9999}

.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(8,17,29,.97);
  border-bottom:1px solid var(--line);
  backdrop-filter:blur(12px)
}
.nav{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.brand{display:flex;align-items:center;min-width:145px}
.brand img{display:block;max-height:30px;width:auto}
.nav-right{display:flex;align-items:center;gap:1.2rem}
.nav-links{display:none;align-items:center;gap:1.45rem;font-size:.9rem;color:#d7dfeb}
.nav-links a{padding:.2rem 0;border-bottom:2px solid transparent}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:#fff;border-color:#fff}
.lang-switch{display:none;align-items:center;border-left:1px solid var(--line);padding-left:.8rem}
.lang-switch a{font-size:.7rem;font-weight:700;color:#8794a8;padding:.35rem .4rem}
.lang-switch a.active{color:#fff}
.nav-actions{display:flex;align-items:center;gap:.6rem}
.menu-btn{
  width:40px;height:40px;border:1px solid var(--line);background:transparent;color:#fff;
  display:grid;place-items:center;border-radius:4px;cursor:pointer
}
.mobile-panel{display:none;border-top:1px solid var(--line);padding:.45rem 0 1rem}
.mobile-panel.open{display:block}
.mobile-panel>a{display:block;padding:.72rem 0;color:#dce3ed}
.mobile-langs{display:flex;gap:.55rem;padding-top:.7rem;border-top:1px solid var(--line)}
.mobile-langs a{padding:.3rem .45rem;color:#8794a8;font-size:.76rem;font-weight:700}
.mobile-langs a.active{color:#fff}

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;padding:.7rem 1rem;border:1px solid transparent;border-radius:4px;
  font-size:.88rem;font-weight:700;transition:.18s ease
}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:#2f63dd}
.btn-outline{border-color:var(--line2);background:transparent;color:#fff}
.btn-small{min-height:38px;padding:.55rem .78rem;font-size:.8rem}

.hero{position:relative;background:var(--bg);border-bottom:1px solid var(--line);overflow:hidden}
.hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.18;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:56px 56px
}
.hero-inner{position:relative;z-index:1;display:grid;gap:3rem;align-items:center;padding:5.1rem 0 4.9rem}
.kicker,.label{
  display:block;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent2);margin-bottom:.88rem
}
h1,h2,h3{margin:0;line-height:1.14;letter-spacing:-.018em}
h1{font-size:clamp(2.55rem,5.5vw,4.25rem);max-width:13.5ch;font-weight:700}
h2{font-size:clamp(1.82rem,3.7vw,2.75rem);font-weight:700}
h3{font-size:1.05rem;font-weight:700}
.hero-copy{max-width:670px;color:#bdc7d5;font-size:1.03rem;margin:1.2rem 0 0}
.hero-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.55rem}
.hero-meta{
  display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;margin-top:1.45rem;padding-top:1.1rem;
  border-top:1px solid var(--line);color:#8f9bae;font-size:.78rem
}
.hero-meta span::before{content:"";display:inline-block;width:5px;height:5px;background:var(--success);margin-right:.48rem;vertical-align:2px}

.capability-panel{border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.capability-title{padding:.86rem 0;color:#8795a9;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em}
.capability-item{display:grid;grid-template-columns:42px 1fr;gap:.8rem;padding:1rem 0;border-top:1px solid var(--line)}
.capability-item:first-of-type{border-top:0}
.capability-index{color:#617087;font-size:.75rem}
.capability-item strong{display:block;font-size:.93rem}
.capability-item p{margin:.2rem 0 0;color:#9eabbd;font-size:.82rem;line-height:1.48}

.section{padding:4.9rem 0;border-bottom:1px solid var(--line)}
.tone1{background:var(--bg)}
.tone2{background:var(--bg2)}
.tone3{background:var(--bg3)}
.tone4{background:var(--bg4)}
.section-head{display:grid;gap:1rem;margin-bottom:2.25rem}
.section-head p{margin:0;color:var(--muted);max-width:650px}

.services-list{border-top:1px solid var(--line2)}
.service-row{display:grid;gap:.7rem;padding:1.4rem 0;border-bottom:1px solid var(--line);align-items:start}
.service-row-number{font-size:.7rem;color:#64738a;font-weight:700}
.service-row h3{font-size:1rem}
.service-row p{margin:0;color:var(--muted);font-size:.88rem}
.service-row a{font-size:.8rem;font-weight:700;color:#afc4ff}
.service-row a::after{content:" →"}

.split{display:grid;gap:2.2rem;align-items:start}
.prose{max-width:650px}
.prose p{color:var(--muted);margin:1rem 0 0}
.rule-list{border-top:1px solid var(--line2)}
.rule-item{display:grid;grid-template-columns:42px 1fr;gap:.9rem;padding:1.12rem 0;border-bottom:1px solid var(--line)}
.rule-item span{font-size:.7rem;color:#66758c}
.rule-item h3{margin-bottom:.28rem;font-size:.98rem}
.rule-item p{margin:0;color:var(--muted);font-size:.84rem}

.check-list{list-style:none;padding:0;margin:1.25rem 0 0;display:grid;gap:.72rem}
.check-list li{position:relative;padding-left:1.12rem;color:var(--muted);font-size:.9rem}
.check-list li::before{content:"";position:absolute;left:0;top:.72em;width:5px;height:5px;background:var(--accent)}

.cta{display:grid;gap:1.2rem;padding:2.15rem 0;border-top:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.cta h2{max-width:18ch}
.cta p{margin:.75rem 0 0;color:var(--muted);max-width:670px}
.cta-actions{display:flex;flex-wrap:wrap;gap:.7rem}

.breadcrumb{padding-top:1rem;color:#738197;font-size:.76rem}
.breadcrumb ol{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;margin:0;padding:0}
.breadcrumb li+li::before{content:"/";margin-right:.4rem;color:#4f5e73}

.page-hero{background:var(--bg2);padding:3.9rem 0 3.3rem;border-bottom:1px solid var(--line)}
.page-hero h1{font-size:clamp(2.35rem,4.8vw,3.7rem);max-width:15ch}
.page-hero .lead{max-width:760px;color:var(--muted);font-size:1rem;margin:1.05rem 0 0}
.tag-row{display:flex;flex-wrap:wrap;gap:.42rem;margin-top:1.2rem}
.tag{border:1px solid var(--line);padding:.36rem .53rem;font-size:.74rem;color:#a8b5c7}

.feature-grid{display:grid;border-top:1px solid var(--line2)}
.feature{padding:1.22rem 0;border-bottom:1px solid var(--line)}
.feature p{margin:.35rem 0 0;color:var(--muted);font-size:.86rem}
.detail-grid{display:grid;border-top:1px solid var(--line2)}
.detail-item{padding:1.12rem 0;border-bottom:1px solid var(--line)}
.detail-item p{margin:.3rem 0 0;color:var(--muted);font-size:.84rem}

.contact-grid{display:grid;border-top:1px solid var(--line2)}
.contact-card{padding:1.22rem 0;border-bottom:1px solid var(--line)}
.contact-card small{display:block;color:#748198;text-transform:uppercase;font-size:.66rem;letter-spacing:.1em;font-weight:700;margin-bottom:.33rem}
.contact-card a,.contact-card strong{font-size:.98rem;font-weight:700}
.contact-card p{margin:.32rem 0 0;color:var(--muted);font-size:.83rem}

.legal{max-width:850px}
.legal h2{font-size:1.42rem;margin-top:2.25rem}
.legal p,.legal li{color:var(--muted)}

.footer{background:#060d17;padding:3.2rem 0 1.55rem}
.footer-grid{display:grid;gap:2rem}
.footer-brand img{max-height:29px;width:auto;display:block;margin-bottom:1rem}
.footer p{color:#8693a6;font-size:.84rem;max-width:350px}
.footer h3{font-size:.7rem;color:#69778d;text-transform:uppercase;letter-spacing:.11em;margin-bottom:.76rem}
.footer-links{display:grid;gap:.48rem;color:#b6c1cf;font-size:.84rem}
.footer-note{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.8rem;margin-top:2rem;padding-top:1.1rem;border-top:1px solid var(--line);color:#68768b;font-size:.74rem}

.error-wrap{min-height:70vh;display:grid;place-items:center;text-align:center;padding:5rem 0}
.error-code{font-size:clamp(5rem,18vw,9rem);font-weight:700;color:#3a475b;line-height:.9}
.error-title{max-width:none;margin-top:1rem}
.error-lead{color:var(--muted);max-width:520px;margin:1rem auto 1.5rem}

@media (min-width:720px){
  .feature-grid{grid-template-columns:repeat(3,1fr)}
  .feature{padding:1.25rem}
  .feature:first-child{padding-left:0}
  .feature+.feature{border-left:1px solid var(--line)}
  .detail-grid{grid-template-columns:repeat(2,1fr)}
  .detail-item:nth-child(odd){padding-right:1.35rem;border-right:1px solid var(--line)}
  .detail-item:nth-child(even){padding-left:1.35rem}
  .contact-grid{grid-template-columns:repeat(3,1fr)}
  .contact-card{padding:1.2rem}
  .contact-card:first-child{padding-left:0}
  .contact-card+.contact-card{border-left:1px solid var(--line)}
  .footer-grid{grid-template-columns:1.45fr repeat(3,1fr)}
  .service-row{grid-template-columns:60px 1.05fr 1.65fr auto;gap:1.3rem}
  .split{grid-template-columns:1fr 1fr}
}
@media (min-width:960px){
  .nav-links,.lang-switch{display:flex}
  .menu-btn{display:none}
  .hero-inner{grid-template-columns:minmax(0,1.15fr) minmax(350px,.85fr)}
  .section-head{grid-template-columns:1.1fr .9fr;align-items:end}
  .cta{grid-template-columns:1fr auto;align-items:end}
}
@media (max-width:560px){
  .nav-actions .btn-small{display:none}
  .hero-inner{padding:4.1rem 0}
  .section{padding:3.9rem 0}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;transition:none!important}
}


/* ===== REIGEN v5: imágenes y banner dinámico ===== */

.hero-inner{
  grid-template-columns:1fr;
}

/* Banner principal */
.hero-slider{
  position:relative;
  min-height:430px;
  overflow:hidden;
  border:1px solid var(--line2);
  background:#07101b;
}
.hero-slide{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  transition:opacity .9s ease,visibility .9s ease;
}
.hero-slide.is-active{
  opacity:1;
  visibility:visible;
}
.hero-slide img{
  width:100%;
  height:100%;
  min-height:430px;
  object-fit:cover;
  display:block;
}
.hero-slider::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(5,12,21,.03) 35%,rgba(5,12,21,.58) 100%);
}
.hero-slider-ui{
  position:absolute;
  z-index:3;
  left:18px;
  right:18px;
  bottom:16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
.hero-slider-dots{
  display:flex;
  gap:7px;
}
.hero-slider-dot{
  width:26px;
  height:3px;
  padding:0;
  border:0;
  background:rgba(255,255,255,.35);
  cursor:pointer;
}
.hero-slider-dot.is-active{
  background:#fff;
}
.hero-slider-arrows{
  display:flex;
  gap:6px;
}
.hero-slider-arrow{
  width:36px;
  height:36px;
  border:1px solid rgba(255,255,255,.4);
  background:rgba(6,13,23,.55);
  color:#fff;
  cursor:pointer;
  display:grid;
  place-items:center;
  font-family:Arial,Helvetica,sans-serif;
  font-size:18px;
}
.hero-slider-arrow:hover{
  background:rgba(6,13,23,.85);
}

/* Imágenes editoriales de páginas interiores */
.page-hero-grid{
  display:grid;
  gap:2.2rem;
  align-items:center;
}
.page-hero-copy{
  min-width:0;
}
.page-hero-media{
  margin:0;
  overflow:hidden;
  border:1px solid var(--line);
  background:#07101b;
  aspect-ratio:16/10;
}
.page-hero-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transition:transform .45s ease;
}
.page-hero-media:hover img{
  transform:scale(1.015);
}

/* Imagen editorial en la página Servicios */
.section-media-grid{
  display:grid;
  gap:2.2rem;
  align-items:center;
}
.section-media{
  margin:0;
  overflow:hidden;
  border:1px solid var(--line);
  aspect-ratio:16/10;
}
.section-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

@media (min-width:960px){
  .hero-inner{
    grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr);
  }
  .page-hero-grid{
    grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  }
  .section-media-grid{
    grid-template-columns:minmax(0,1fr) minmax(360px,.85fr);
  }
}

@media (max-width:720px){
  .hero-slider,
  .hero-slide img{
    min-height:300px;
  }
}

@media (prefers-reduced-motion:reduce){
  .hero-slide{
    transition:none;
  }
  .page-hero-media img{
    transition:none;
  }
}


/* ===== REIGEN v5.1: hero full-width con slider de fondo ===== */

.hero{
  position:relative;
  min-height:640px;
  overflow:hidden;
  display:flex;
  align-items:center;
  background:#08111d;
}

.hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(5,12,21,.90) 0%,rgba(5,12,21,.78) 40%,rgba(5,12,21,.42) 72%,rgba(5,12,21,.22) 100%),
    linear-gradient(180deg,rgba(5,12,21,.14) 0%,rgba(5,12,21,.30) 100%);
}

.hero-inner{
  position:relative;
  z-index:2;
  display:block;
  width:100%;
  padding:6.2rem 0 5.8rem;
}

.hero-inner > div:first-child{
  max-width:720px;
  position:relative;
  z-index:3;
}

.hero-slider{
  position:absolute;
  inset:0;
  z-index:0;
  min-height:100%;
  border:0;
  background:#07101b;
}

.hero-slide,
.hero-slide img{
  width:100%;
  height:100%;
  min-height:640px;
}

.hero-slide img{
  object-fit:cover;
  object-position:center;
}

.hero-slider::after{
  display:none;
}

.hero-slider-ui{
  z-index:4;
  left:auto;
  right:32px;
  bottom:24px;
  width:auto;
}

.hero-slider-dots{
  display:none;
}

.hero-meta{
  max-width:720px;
}

@media (max-width:960px){
  .hero{
    min-height:600px;
  }

  .hero-slide,
  .hero-slide img{
    min-height:600px;
  }

  .hero::after{
    background:
      linear-gradient(90deg,rgba(5,12,21,.92) 0%,rgba(5,12,21,.78) 58%,rgba(5,12,21,.45) 100%),
      linear-gradient(180deg,rgba(5,12,21,.18),rgba(5,12,21,.38));
  }
}

@media (max-width:720px){
  .hero{
    min-height:640px;
  }

  .hero-slide,
  .hero-slide img{
    min-height:640px;
  }

  .hero-inner{
    padding:5rem 0 4.5rem;
  }

  .hero::after{
    background:rgba(5,12,21,.76);
  }

  .hero-slider-ui{
    right:16px;
    bottom:16px;
  }
}


/* ===== REIGEN v5.2: mejor legibilidad del hero ===== */

/* Overlay principal: oscurece de forma contundente la zona del texto
   y libera progresivamente la fotografía hacia la derecha. */
.hero::after{
  background:
    linear-gradient(
      90deg,
      rgba(3,9,17,.96) 0%,
      rgba(3,9,17,.93) 18%,
      rgba(3,9,17,.84) 38%,
      rgba(3,9,17,.66) 54%,
      rgba(3,9,17,.35) 72%,
      rgba(3,9,17,.16) 100%
    ),
    linear-gradient(
      180deg,
      rgba(3,9,17,.12) 0%,
      rgba(3,9,17,.20) 55%,
      rgba(3,9,17,.38) 100%
    );
}

/* Refuerzo de contraste sin crear una caja visible. */
.hero-inner > div:first-child{
  max-width:700px;
}

.hero h1{
  color:#fff;
  text-shadow:0 2px 18px rgba(0,0,0,.38);
}

.hero .hero-copy{
  color:#d7dee8;
  text-shadow:0 1px 8px rgba(0,0,0,.55);
}

.hero .kicker{
  color:#9eb7ff;
  text-shadow:0 1px 7px rgba(0,0,0,.65);
}

.hero .hero-meta{
  color:#bcc7d5;
  text-shadow:0 1px 7px rgba(0,0,0,.65);
}

/* Mejor definición del botón secundario sobre fotografía. */
.hero .btn-outline{
  background:rgba(4,10,18,.30);
  border-color:rgba(255,255,255,.42);
  backdrop-filter:blur(3px);
}

/* En pantallas medianas reforzamos el fondo bajo el texto. */
@media (max-width:1100px){
  .hero::after{
    background:
      linear-gradient(
        90deg,
        rgba(3,9,17,.96) 0%,
        rgba(3,9,17,.91) 35%,
        rgba(3,9,17,.73) 62%,
        rgba(3,9,17,.38) 100%
      ),
      linear-gradient(
        180deg,
        rgba(3,9,17,.14),
        rgba(3,9,17,.38)
      );
  }
}

/* En móvil usamos un overlay uniforme para garantizar lectura. */
@media (max-width:720px){
  .hero::after{
    background:rgba(3,9,17,.80);
  }

  .hero h1{
    text-shadow:0 2px 14px rgba(0,0,0,.45);
  }
}


/* ===== REIGEN v5.3: capa gris translúcida sobre el banner ===== */

/* Capa uniforme entre la fotografía y el contenido.
   Mantiene la imagen visible, pero estabiliza el contraste del texto. */
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:rgba(28,34,42,.50);
}

/* Conservamos un degradado suave adicional para reforzar solo la zona izquierda. */
.hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    linear-gradient(
      90deg,
      rgba(4,10,18,.48) 0%,
      rgba(4,10,18,.36) 35%,
      rgba(4,10,18,.16) 65%,
      rgba(4,10,18,.04) 100%
    );
}

/* El contenido queda por encima de ambas capas. */
.hero-inner{
  position:relative;
  z-index:3;
}

/* El slider permanece detrás de las capas. */
.hero-slider{
  z-index:0;
}

/* Controles del slider siempre visibles. */
.hero-slider-ui{
  z-index:4;
}

.hero h1{
  color:#fff;
  text-shadow:0 2px 10px rgba(0,0,0,.28);
}

.hero .hero-copy{
  color:#eef2f7;
  text-shadow:0 1px 6px rgba(0,0,0,.25);
}

.hero .kicker,
.hero .hero-meta{
  text-shadow:none;
}

/* En móvil aumentamos ligeramente la opacidad de la capa gris. */
@media (max-width:720px){
  .hero::before{
    background:rgba(28,34,42,.62);
  }

  .hero::after{
    background:rgba(4,10,18,.18);
  }
}


/* ===== REIGEN v5.4: corrección definitiva de capas y posición del hero ===== */

/*
   Orden visual:
   z-index 0: fotografías
   z-index 1: capa gris
   z-index 2: degradado de contraste
   z-index 3: texto / botones
   z-index 4: controles del slider
*/

.hero{
  position:relative;
  isolation:isolate;
}

/* Fotografías al fondo */
.hero-slider{
  position:absolute;
  inset:0;
  z-index:0;
}

/* Capa gris uniforme entre foto y texto */
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:rgba(36,42,50,.48);
}

/* Refuerzo suave de contraste en el sector izquierdo */
.hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(
    90deg,
    rgba(5,11,19,.48) 0%,
    rgba(5,11,19,.34) 38%,
    rgba(5,11,19,.15) 68%,
    rgba(5,11,19,.03) 100%
  );
}

/* Recuperamos exactamente el ancho y centrado del sitio */
.hero .hero-inner{
  position:relative;
  z-index:3;
  width:min(calc(100% - 2rem),var(--max));
  margin-inline:auto;
  padding:6.2rem 0 5.8rem;
}

/* El bloque de contenido conserva una anchura cómoda */
.hero .hero-inner > div:first-child{
  max-width:700px;
}

/* Controles por encima de todas las capas */
.hero .hero-slider-ui{
  z-index:4;
}

/* Texto plenamente visible sobre la capa gris */
.hero h1{
  color:#fff;
  text-shadow:0 2px 10px rgba(0,0,0,.28);
}

.hero .hero-copy{
  color:#eef2f7;
}

.hero .kicker{
  color:#a9bdff;
}

.hero .hero-meta{
  color:#c6d0dd;
}

/* Móvil: capa algo más oscura y contenido siempre centrado */
@media (max-width:720px){
  .hero::before{
    background:rgba(36,42,50,.60);
  }

  .hero::after{
    background:rgba(5,11,19,.18);
  }

  .hero .hero-inner{
    width:min(calc(100% - 2rem),var(--max));
    margin-inline:auto;
    padding:5rem 0 4.5rem;
  }
}


/* ===== REIGEN v5.5: alineación horizontal del contenido del hero ===== */

/* Alinea el contenido del banner con el ancho editorial del resto del sitio.
   En pantallas grandes equivale al margen de un contenedor de 1180px. */
.hero .hero-inner{
  width:100%;
  max-width:none;
  margin:0;
  padding-left:max(2rem, calc((100vw - var(--max)) / 2));
  padding-right:max(2rem, calc((100vw - var(--max)) / 2));
  padding-top:6.2rem;
  padding-bottom:5.8rem;
}

.hero .hero-inner > div:first-child{
  max-width:700px;
}

@media (max-width:720px){
  .hero .hero-inner{
    padding-left:1.5rem;
    padding-right:1.5rem;
    padding-top:5rem;
    padding-bottom:4.5rem;
  }
}