:root{
  --ink:#1f2933;
  --muted:#68737d;
  --brand:#2f73b8;
  --brand2:#245d96;
  --soft:#f6f8fa;
  --line:#e5e9ed;
  --white:#fff;
  --green:#18a957;
  --orange:#f28c28;
  --shadow:0 18px 50px rgba(31,41,51,.11);
}

*{box-sizing:border-box}

body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--ink);
  line-height:1.55;
}

a{text-decoration:none}

.wrap{width:min(1120px,92%);margin:auto}

.top{
  background:var(--ink);
  color:#fff;
  text-align:center;
  padding:8px;
  font-size:13px;
}

header{
  border-bottom:1px solid var(--line);
  background:#fff;
}

.nav{
  min-height:105px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:nowrap;
}

/* Logo PNG */
.logo{
  display:flex;
  align-items:center;
  flex-shrink:0;
  color:var(--ink);
}

.logo img{
  display:block;
  width:auto;
  height:auto;
  max-width:260px;
  max-height:85px;
  object-fit:contain;
}

/* Fallback para páginas que todavía tengan el logo en texto */
.logo:not(:has(img)){
  font-size:27px;
  font-weight:800;
  letter-spacing:-1px;
}
.logo b{color:var(--brand)}

.nav a.cta{
  background:var(--orange);
  color:#fff;
  padding:11px 17px;
  border-radius:8px;
  font-weight:700;
  white-space:nowrap;
  flex-shrink:0;
}

.hero{
  background:linear-gradient(135deg,rgba(47,115,184,.98),rgba(36,93,150,.96));
  color:#fff;
  padding:64px 0 72px;
}

.grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:55px;
  align-items:start;
}

.tag{
  display:inline-block;
  background:rgba(255,255,255,.14);
  color:#fff;
  border:1px solid rgba(255,255,255,.25);
  font-size:13px;
  font-weight:800;
  padding:7px 12px;
  border-radius:99px;
  margin-bottom:17px;
}

h1{
  font-size:clamp(40px,5.3vw,64px);
  line-height:1.02;
  letter-spacing:-2.5px;
  margin:0 0 20px;
}

.hero h1{color:#fff}
.hero h1 span{color:#fff}
.hero p{font-size:20px;color:rgba(255,255,255,.92);max-width:650px}

.buttons{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:25px;
}

.btn{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  padding:15px 22px;
  border-radius:9px;
  font-weight:800;
  border:1px solid transparent;
  cursor:pointer;
  font-size:15px;
  font-family:inherit;
}

.primary{background:var(--orange);color:#fff}
.secondary{background:#fff;color:var(--brand2);border:1px solid var(--line)}

.trust{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  color:rgba(255,255,255,.9);
  font-size:13px;
  margin-top:20px;
}

.card{
  background:#fff;
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:18px;
  padding:27px;
  box-shadow:var(--shadow);
}

.card h2{margin:0 0 4px;font-size:25px}
.sub{margin:0 0 18px;color:var(--muted);font-size:14px}

form{display:grid;gap:12px}
label{font-size:13px;font-weight:700;display:block;margin-bottom:5px}

input,select{
  width:100%;
  padding:13px;
  border:1px solid #cbd8dc;
  border-radius:8px;
  font-size:15px;
  background:#fff;
  font-family:inherit;
}

.two{display:grid;grid-template-columns:1fr 1fr;gap:11px}

.note{font-size:11px;color:var(--muted);margin:0}
.form-status{font-size:13px;font-weight:700;margin:0;min-height:18px}
.form-status.ok{color:var(--green)}
.form-status.error{color:#b3261e}

.section{padding:70px 0}
.soft{background:var(--soft)}
.center{text-align:center}

.section h2{
  font-size:37px;
  line-height:1.1;
  margin:0 0 10px;
  letter-spacing:-1px;
}

.lead{max-width:720px;margin:0 auto 34px;color:var(--muted);font-size:18px}

.cards,.steps{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}

.mini{
  border:1px solid var(--line);
  border-radius:16px;
  padding:24px;
  background:#fff;
}

.mini h3{margin:0 0 8px;font-size:20px}
.mini p{margin:0;color:var(--muted)}

.num{
  width:40px;
  height:40px;
  background:var(--brand);
  color:#fff;
  border-radius:50%;
  display:grid;
  place-items:center;
  font-weight:800;
  margin-bottom:13px;
}

.split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  align-items:center;
}

.checks{padding:0;list-style:none}
.checks li{margin:12px 0;padding-left:27px;position:relative}
.checks li:before{
  content:'✓';
  position:absolute;
  left:0;
  color:var(--green);
  font-weight:900;
}

.dark{background:var(--ink);color:#fff}
.dark p{color:#c9d1d5}
.dark .btn.secondary{color:var(--ink)}

.faq{max-width:800px;margin:auto}
details{border-bottom:1px solid var(--line);padding:17px 0}
summary{font-weight:800;cursor:pointer}
details p{color:var(--muted)}

footer{padding:27px 0;color:var(--muted);font-size:13px}

/* Accessibility */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
summary:focus-visible{
  outline:3px solid var(--brand2);
  outline-offset:2px;
}

/* Header buttons */
.nav .buttons{
  margin:0 0 0 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  flex-wrap:nowrap;
}

.nav .buttons .btn,
.nav .buttons .cta{
  margin:0;
  white-space:nowrap;
  flex-shrink:0;
}

/* =========================================
   LANDING AUTO TURISTA
   ========================================= */

.tourist-page .nav .buttons{
  align-items:center;
  gap:12px;
}

.tourist-page .nav .buttons .btn,
.tourist-page .nav .buttons .cta{
  width:auto;
  min-width:0;
  height:44px;
  padding:0 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0;
  white-space:nowrap;
}

.tourist-page .hero{padding-top:52px}
.tourist-page .hero .grid > div:first-child{padding-top:32px}

/* =========================================
   TABLET / MOBILE
   ========================================= */

@media(max-width:800px){
  .grid,.split{grid-template-columns:1fr}
  .cards,.steps{grid-template-columns:1fr}

  .nav{
    min-height:82px;
    height:auto;
    padding:8px 0;
    gap:10px;
    flex-wrap:nowrap;
  }

  .logo img{
    max-width:190px;
    max-height:64px;
  }

  .hero{padding-top:45px}
  .navlinks{display:none}

  .nav .buttons{
    gap:7px;
    flex-wrap:nowrap;
  }

  .nav .buttons .btn,
  .nav .buttons .cta{
    padding:10px 12px;
    font-size:13px;
    white-space:nowrap;
  }

  .tourist-page .nav{
    min-height:82px;
    height:auto;
    padding:8px 0;
    gap:8px;
  }

  .tourist-page .nav .logo{
    flex-shrink:0;
  }

  .tourist-page .nav .logo img{
    max-width:175px;
    max-height:60px;
  }

  .tourist-page .nav .buttons{
    margin:0 0 0 auto !important;
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    align-items:center;
    justify-content:flex-end;
    gap:6px;
  }

  .tourist-page .nav .buttons .btn,
  .tourist-page .nav .buttons .cta{
    width:auto;
    height:40px;
    min-width:0;
    padding:0 10px;
    font-size:12px;
    white-space:nowrap;
  }
}

@media(max-width:520px){
  .wrap{width:min(1120px,94%)}

  .nav{
    min-height:72px;
    gap:6px;
  }

  .logo img{
    max-width:145px;
    max-height:52px;
  }

  .tourist-page .nav .logo img{
    max-width:130px;
    max-height:48px;
  }

  .tourist-page .nav .buttons{
    gap:4px;
  }

  .tourist-page .nav .buttons .btn,
  .tourist-page .nav .buttons .cta{
    height:38px;
    padding:0 8px;
    font-size:11px;
  }

  .two{grid-template-columns:1fr}
}

@media (prefers-reduced-motion: reduce){
  *{scroll-behavior:auto !important}
}

/* =========================================
   FIX: TEXTO VISIBLE EN FORMULARIOS
   ========================================= */

.hero .card,
.hero .card h2,
.hero .card h3,
.hero .card p,
.hero .card label,
.hero .card .sub,
.hero .card .note,
.hero .card .form-status{
  color:var(--ink);
}

.hero .card input,
.hero .card select,
.hero .card textarea{
  color:var(--ink);
  background:#fff;
}

.hero .card input::placeholder,
.hero .card textarea::placeholder{
  color:#6b7280;
  opacity:1;
}

.hero .card select option{
  color:var(--ink);
  background:#fff;
}

.hero .card .note a{
  color:var(--brand2);
  font-weight:600;
}
