/* ------------------------------------------------------------------
     Tokens extraidos de www.satellitalpatrol.com (Webflow):
     satellital-patrol.webflow.shared.css — custom properties
     _colors, _typography y _sizes. Nombres simplificados.
     ------------------------------------------------------------------ */
  :root{
    --gray-100:#ddd;
    --gray-200:#b6b6b6;
    --gray-300:#6b6b6b;
    --gray-400:#474747;
    --gray-600:#292929;
    --gray-900:#0a0a0a;
    --orange:#f36925;
    --slate-50:#f8fafc;

    --font-body:Lato,sans-serif;
    --font-heading:Manrope,sans-serif;

    --text-xs:.75rem;
    --text-sm:.875rem;
    --text-base:1rem;
    --text-lg:1.125rem;
    --text-xl:1.25rem;
    --text-2xl:1.5rem;
    --text-3xl:1.875rem;
    --text-4xl:2.25rem;
    --text-5xl:3rem;
    --text-8xl:6rem;

    --spacer-small:.875rem;
    --spacer-medium:2rem;
    --spacer-large:3rem;
    --spacer-xlarge:4rem;
    --spacer-xxlarge:5rem;
    --spacer-xhuge:8rem;
  }

  *{box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
  html{-webkit-text-size-adjust:100%}
  body{
    margin:0;
    background-color:var(--gray-900);
    color:var(--gray-200);
    font-family:var(--font-body);
    font-size:var(--text-base);
    font-weight:400;
    line-height:1.7;
  }
  img{border:0;max-width:100%}
  a{color:var(--orange);text-decoration:none}
  a:hover{text-decoration:underline}

  /* .container — max-width 1275px; acá se acota para lectura de texto largo */
  .container{
    width:100%;
    max-width:1275px;
    margin:0 auto;
    padding-left:var(--spacer-medium);
    padding-right:var(--spacer-medium);
  }
  .legal-body{max-width:860px}
  @media (max-width:479px){
    .container{padding-left:var(--spacer-small);padding-right:var(--spacer-small)}
  }

  /* ---------------- Navbar ---------------- */
  .navbar{letter-spacing:1px}
  .navbar-container{
    width:100%;
    max-width:1275px;
    margin:0 auto;
    padding:var(--spacer-medium) var(--spacer-medium) var(--spacer-small);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
  }
  .navbar-brand img{height:48px;display:block}
  .nav-menu{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    list-style:none;
    margin:0;
    padding:0;
  }
  .nav-link{
    font-family:var(--font-body);
    color:var(--gray-200);
    font-size:var(--text-sm);
    letter-spacing:.25px;
    margin:0 5px;
    padding:5px 10px;
    line-height:1rem;
    text-decoration:none;
  }
  .nav-link:hover{color:var(--gray-100);text-decoration:none}
  .nav-actions{display:flex;align-items:center;gap:var(--spacer-small)}
  .button-primary{
    padding:var(--spacer-small);
    border:1px solid var(--orange);
    background-color:var(--gray-900);
    color:var(--orange);
    font-family:var(--font-body);
    font-size:var(--text-sm);
    line-height:1rem;
    border-radius:1px;
    transition:all .2s;
    text-decoration:none;
  }
  .button-primary:hover{background-color:var(--orange);color:var(--gray-900);text-decoration:none}
  @media (max-width:767px){
    .nav-actions{display:none}
    .navbar-brand img{height:40px}
  }
  @media (max-width:991px){
    .nav-menu{justify-content:center;gap:4px}
  }

  /* ---------------- Hero ---------------- */
  .hero{
    padding-top:var(--spacer-xhuge);
    padding-bottom:var(--spacer-xlarge);
  }
  .hero-content{max-width:70%}
  .hero-heading{
    margin:0;
    font-family:var(--font-heading);
    color:var(--slate-50);
    font-size:var(--text-5xl);
    font-weight:700;
    line-height:3.4rem;
  }
  .hero-eyebrow{
    font-family:var(--font-body);
    font-size:var(--text-sm);
    letter-spacing:1px;
    text-transform:uppercase;
    font-weight:700;
    line-height:16px;
    color:var(--orange);
    margin-bottom:12px;
  }
  @media (max-width:991px){
    .hero{padding-top:var(--spacer-large);padding-bottom:var(--spacer-large)}
    .hero-heading{font-size:var(--text-4xl);line-height:2.7rem}
  }
  @media (max-width:767px){
    .hero-content{max-width:100%}
    .hero-heading{font-size:var(--text-3xl);line-height:2.3rem}
  }
  @media (max-width:479px){
    .hero-heading{font-size:var(--text-2xl);line-height:1.9rem}
  }

  /* ---------------- Cuerpo legal ---------------- */
  /* .paragraph del sitio es text-xl/1.4rem — muy ajustado para prosa larga,
     acá se usa text-base con line-height 1.7 para legibilidad. */
  .legal{padding-bottom:var(--spacer-xxlarge)}
  .legal h2{
    font-family:var(--font-heading);
    color:#fff;
    font-size:var(--text-2xl);
    font-weight:700;
    line-height:1.3;
    margin:0 0 var(--spacer-medium);
    padding-bottom:var(--spacer-small);
    border-bottom:1px solid var(--gray-400);
  }
  /* Titulos de seccion dentro de una lista numerada: mismo aspecto que h4,
     pero como h2 para no saltear niveles de encabezado desde el h1 del hero. */
  .legal .sections > li > h2{border-bottom:none;padding-bottom:0}
  .legal .sections > li > h2,
  .legal h4{
    font-family:var(--font-heading);
    color:#fff;
    font-size:var(--text-lg);
    font-weight:700;
    line-height:1.4;
    margin:0 0 .5rem;
  }
  .legal p{margin:0 0 1rem}
  /* Fecha de ultima actualizacion, arriba del cuerpo legal */
  .legal-meta{
    margin:0 0 var(--spacer-medium);
    color:var(--gray-300);
    font-size:var(--text-sm);
    letter-spacing:.25px;
    text-transform:uppercase;
  }
  .legal p:last-child{margin-bottom:0}
  .legal b,.legal strong{color:var(--gray-100);font-weight:700}

  .legal .legal-body > ol.sections{
    list-style:none;
    counter-reset:sec;
    margin:0;
    padding:0;
  }
  .legal .legal-body > ol.sections > li{
    counter-increment:sec;
    position:relative;
    padding:0 0 var(--spacer-large) 3rem;
  }
  .legal .legal-body > ol.sections > li:before{
    content:counter(sec) ".";
    position:absolute;
    left:0;
    top:0;
    font-family:var(--font-heading);
    font-size:var(--text-lg);
    font-weight:700;
    color:var(--orange);
    line-height:1.4;
  }
  @media (max-width:479px){
    .legal .legal-body > ol.sections > li{padding-left:2.25rem}
  }

  .legal ul,.legal ol ol,.legal ol ul{
    margin:1rem 0;
    padding-left:1.5rem;
  }
  .legal li{padding-top:6px;padding-bottom:6px}
  .legal ::marker{color:var(--orange)}
  .legal sup a{color:var(--orange)}
  .legal small{
    display:block;
    margin-top:var(--spacer-medium);
    padding-top:var(--spacer-small);
    border-top:1px solid var(--gray-600);
    /* gray-300 (#6b6b6b) sobre gray-900 queda ~3.2:1 — por debajo de AA para
       texto chico. Se usa gray-200 para la nota al pie. */
    color:var(--gray-200);
    font-size:var(--text-xs);
  }
  .legal small a{color:var(--gray-200)}

  /* Formulario ARCO (PDF): boton de descarga + embed.
     El boton es necesario porque en mobile el <object> casi nunca renderiza
     el PDF inline y el fallback interno no se muestra si el embed "carga". */
  .form-download{
    margin-top:var(--spacer-xlarge);
    padding-top:var(--spacer-medium);
    border-top:1px solid var(--gray-600);
  }
  .form-download .footer-heading{margin-bottom:var(--spacer-small)}
  .pdf-embed{
    width:100%;
    height:600px;
    margin-top:var(--spacer-medium);
    border:1px solid var(--gray-400);
    background-color:var(--gray-600);
  }
  @media (max-width:767px){.pdf-embed{display:none}}

  /* ---------------- Footer ---------------- */
  .footer-dark{
    padding:var(--spacer-xhuge) 0 var(--spacer-large);
    background-color:var(--gray-900);
    background-image:url('/assets/iso.svg');
    background-position:100% 100%;
    background-repeat:no-repeat;
    color:#fff;
  }
  @media (max-width:767px){
    .footer-dark{padding-top:var(--spacer-large)}
  }
  .footer-content{
    display:grid;
    grid-template-columns:auto auto 1fr;
    gap:40px 9rem;
  }
  @media (max-width:991px){.footer-content{gap:40px 60px}}
  @media (max-width:767px){.footer-content{grid-template-columns:1fr;margin-top:40px}}
  .footer-block{display:flex;flex-direction:column;align-items:flex-start}
  @media (max-width:767px){.footer-block{align-items:center;text-align:center}}
  .footer-heading{
    font-family:var(--font-body);
    color:var(--orange);
    font-size:var(--text-base);
    font-weight:700;
  }
  .footer-link{
    font-family:var(--font-body);
    color:var(--gray-300);
    font-size:var(--text-sm);
    margin:12px 0 6px;
    line-height:16px;
    text-decoration:none;
  }
  .footer-link:hover{color:var(--gray-100);text-decoration:none}
  .footer-divider{
    width:100%;
    height:1px;
    margin:60px 0 var(--spacer-xxlarge);
    background-color:var(--gray-400);
  }
  @media (max-width:767px){
    .footer-divider{margin-bottom:var(--spacer-large)}
  }
  .footer-links{
    display:flex;
    justify-content:space-between;
    align-items:stretch;
    gap:2rem;
    font-family:var(--font-body);
    font-size:var(--text-sm);
    line-height:1.2rem;
  }
  @media (max-width:767px){.footer-links{flex-direction:column;text-align:center}}
  .footer-social{display:flex;gap:2rem;justify-content:center}
  .footer-social a{color:#fff;text-decoration:none}
  .footer-social a:hover{color:var(--orange);text-decoration:none}

  /* Numeracion romana (pagina ARCO) */
  .legal .legal-body > ol.sections.roman > li:before{content:counter(sec,upper-roman) "."}
