/* ===== Project USA — estilo claro ===== */
:root{
  --bg:#ffffff;
  --bg-alt:#f2fbfb;
  --panel:#f7fafa;
  --line: rgba(15,25,26,0.10);
  --text:#101616;
  --muted:#5b6b6c;
  --teal:#1ecad3;
  --teal-dark:#149298;
  --teal-dim: rgba(30,202,211,0.12);
  --radius:18px;
  --shadow: 0 20px 50px -20px rgba(16,34,35,0.18);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Work Sans', sans-serif;
  line-height:1.55;
  overflow-x:hidden;
}
h1,h2,h3,.display{
  font-family:'Archivo', sans-serif;
  font-weight:800;
  letter-spacing:-0.02em;
  line-height:1.08;
}
h1{font-size:clamp(38px,5vw,60px);}
h2{font-size:clamp(28px,3.4vw,40px);}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{
  max-width:min(1200px, 92vw);
  margin:0 auto;
  padding:0 32px;
}
@media(max-width:640px){ .wrap{padding:0 20px;} }

/* ---- Header ---- */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,0.9);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
nav.wrap{
  display:flex; align-items:center; justify-content:space-between;
  height:78px;
}
.brand{
  display:flex; align-items:center; gap:10px;
  font-family:'Archivo', sans-serif; font-weight:800; font-size:19px;
  color:var(--text);
}
.brand span{color:var(--teal);}
.brand svg{flex:none;}
.brand-logo{ height:48px; width:auto; display:block; }
.navlinks{
  display:none;
  gap:30px;
  font-weight:600; font-size:15px;
}
.navlinks a{
  color:var(--muted);
  padding:6px 2px;
  border-bottom:2px solid transparent;
  transition:color .2s ease, border-color .2s ease;
}
.navlinks a:hover, .navlinks a.active{
  color:var(--text);
  border-color:var(--teal);
}
@media(min-width:880px){ .navlinks{display:flex;} }

.nav-cta{
  display:none;
}
@media(min-width:880px){
  .nav-cta{
    display:inline-flex; align-items:center;
    padding:11px 22px;
    border:1.5px solid var(--teal);
    border-radius:100px;
    color:var(--teal-dark);
    font-weight:700; font-size:14px;
    transition:background .2s ease, color .2s ease;
  }
  .nav-cta:hover{ background:var(--teal); color:#04211f; }
}

.menu-btn{
  display:flex; align-items:center; justify-content:center;
  width:44px; height:44px;
  border:1px solid var(--line); border-radius:10px;
  background:none; cursor:pointer;
}
@media(min-width:880px){ .menu-btn{display:none;} }
.menu-btn span{display:block; width:20px; height:2px; background:var(--text); position:relative;}
.menu-btn span::before, .menu-btn span::after{
  content:""; position:absolute; left:0; width:20px; height:2px; background:var(--text);
}
.menu-btn span::before{top:-6px;}
.menu-btn span::after{top:6px;}

.mobile-menu{
  position:fixed; inset:78px 0 0 0; z-index:49;
  background:#fff;
  transform:translateY(-8px);
  opacity:0; pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
  overflow-y:auto;
}
.mobile-menu.open{opacity:1; pointer-events:auto; transform:translateY(0);}
.mobile-menu .wrap{padding-top:24px; padding-bottom:32px; display:flex; flex-direction:column; gap:4px;}
.mobile-menu a{
  padding:16px 4px;
  border-bottom:1px solid var(--line);
  font-family:'Archivo', sans-serif; font-weight:700; font-size:20px;
}
.mobile-menu .nav-cta-mobile{
  margin-top:18px;
  display:inline-flex; justify-content:center;
  padding:16px 22px;
  background:var(--teal);
  color:#04211f;
  border-radius:100px;
  font-weight:700;
  border:none;
}
@media(min-width:880px){ .mobile-menu{display:none;} }

/* ---- Buttons ---- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border-radius:100px;
  font-weight:700;
  cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
  border:none;
}
.btn-primary{
  background:var(--teal); color:#04211f;
  box-shadow:0 14px 30px -10px rgba(30,202,211,0.55);
}
.btn-primary:hover{ transform:translateY(-2px); }
.btn-ghost{
  background:transparent; color:var(--text);
  border:1.5px solid var(--line);
}
.btn-ghost:hover{ border-color:var(--teal); color:var(--teal-dark); }
.btn-lg{ padding:16px 28px; font-size:15px; }

/* ---- Hero (used on Inicio) ---- */
.hero{ padding:48px 0 80px; }
.hero-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start;
}
@media(max-width:960px){ .hero-grid{grid-template-columns:1fr; gap:36px;} }
.hero-grid > div{ min-width:0; }
.hero-grid .stat-row{
  margin-top:40px; padding-top:28px;
}
.eyebrow{
  display:inline-block;
  font-size:13px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--teal-dark);
  background:var(--teal-dim);
  padding:8px 16px;
  border-radius:100px;
  margin-bottom:18px;
}
.hero p.lead{
  margin-top:18px; margin-bottom:30px;
  font-size:19px; color:var(--muted); max-width:640px;
}
.hero-actions{ display:flex; flex-wrap:wrap; gap:14px; }

.stat-row{
  display:grid; grid-template-columns:repeat(3,1fr); gap:30px;
  margin-top:64px; padding-top:36px; border-top:1px solid var(--line);
}
.stat-row .num{ font-family:'Archivo',sans-serif; font-weight:800; font-size:32px; color:var(--teal-dark); white-space:nowrap; }
.hero-grid .stat-row .num{ font-size:26px; }
.stat-row .lbl{ margin-top:6px; color:var(--muted); font-size:14px; }
@media(max-width:700px){ .stat-row{grid-template-columns:1fr; gap:22px;} }

/* ---- Section headers ---- */
.section{ padding:88px 0; }
.section-alt{ background:var(--bg-alt); }
.section-head{ max-width:640px; margin-bottom:48px; }
.section-head .tag{
  display:inline-block; font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--teal-dark); margin-bottom:12px;
}
.section-head p{ margin-top:14px; color:var(--muted); font-size:17px; }

/* ---- Cards ---- */
.card-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
@media(max-width:900px){ .card-grid{grid-template-columns:1fr;} }
.card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:32px;
}
.card .num{
  width:40px; height:40px; border-radius:10px;
  background:var(--teal-dim); color:var(--teal-dark);
  display:flex; align-items:center; justify-content:center;
  font-weight:800; font-family:'Archivo',sans-serif; margin-bottom:18px;
}
.card h3{ font-size:19px; margin-bottom:10px; }
.card p{ color:var(--muted); font-size:15px; }

/* ---- Steps (Proceso) ---- */
.steps{ display:flex; flex-direction:column; gap:0; }
.step{
  display:grid; grid-template-columns:56px 1fr; gap:22px;
  padding:28px 0;
  border-bottom:1px solid var(--line);
}
.step:last-child{border-bottom:none;}
.step .n{
  width:56px; height:56px; border-radius:50%;
  background:var(--teal); color:#04211f;
  display:flex; align-items:center; justify-content:center;
  font-family:'Archivo',sans-serif; font-weight:800; font-size:20px;
}
.step h3{ font-size:19px; margin-bottom:6px; }
.step p{ color:var(--muted); font-size:15px; }

/* ---- CTA banner ---- */
.cta-banner{
  background:linear-gradient(135deg, var(--teal), var(--teal-dark));
  border-radius:24px;
  padding:56px 40px;
  text-align:center;
  color:#04211f;
}
.cta-banner h2{ color:#04211f; }
.cta-banner p{ margin:14px auto 26px; max-width:520px; color:rgba(4,33,31,0.85); font-size:16px; }
.cta-banner .btn-primary{ background:#04211f; color:#fff; box-shadow:none; }
.cta-banner .btn-primary:hover{ background:#0a3230; }

/* ---- Form (Contacto) ---- */
.contact-layout{
  display:grid; grid-template-columns:1fr 1.35fr; gap:56px; align-items:start;
}
@media(max-width:960px){ .contact-layout{grid-template-columns:1fr;} }
.contact-side h2{ margin-bottom:16px; }
.contact-side p{ color:var(--muted); margin-bottom:26px; }
.contact-info{ display:flex; flex-direction:column; gap:16px; }
.contact-info .item{
  display:flex; align-items:center; gap:12px;
  font-size:15px;
}
.contact-info .icon{
  width:38px; height:38px; border-radius:10px;
  background:var(--teal-dim); color:var(--teal-dark);
  display:flex; align-items:center; justify-content:center;
  flex:none;
}

form{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:36px;
}
.form-title{ font-size:22px; margin-bottom:6px; }
.form-sub{ color:var(--muted); font-size:14px; margin-bottom:26px; }
.field{ margin-bottom:20px; min-width:0; }
.field.full{ grid-column:1/-1; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; min-width:0; }
@media(max-width:520px){ .field-row{grid-template-columns:1fr;} }
label{
  display:block; font-size:13px; font-weight:700; color:var(--text);
  margin-bottom:8px;
}
label .opt{ font-weight:400; color:var(--muted); }
input, select, textarea{
  width:100%;
  min-width:0;
  background:#fff;
  border:1px solid var(--line);
  border-radius:10px;
  padding:13px 14px;
  color:var(--text);
  font-family:inherit;
  font-size:15px;
  transition:border-color .2s ease, box-shadow .2s ease;
}
input:focus, select:focus, textarea:focus{
  outline:none; border-color:var(--teal); box-shadow:0 0 0 3px var(--teal-dim);
}
textarea{resize:vertical; min-height:90px;}

.radio-group{ display:flex; gap:12px; min-width:0; }
.radio-opt{
  flex:1; min-width:0;
  display:flex; align-items:center; gap:8px;
  border:1px solid var(--line);
  border-radius:10px;
  padding:13px 10px;
  cursor:pointer;
  font-size:14px; font-weight:600;
  white-space:nowrap;
  transition:border-color .2s ease, background .2s ease;
}
.radio-opt input{width:auto;}
.radio-opt:has(input:checked){
  border-color:var(--teal);
  background:var(--teal-dim);
}

.consent{
  display:flex; gap:10px; align-items:flex-start;
  font-size:13px; color:var(--muted);
  margin:22px 0;
}
.consent input{ width:auto; margin-top:3px; }
.consent a{ color:var(--teal-dark); text-decoration:underline; }

.form-status{
  margin-top:16px; padding:14px 16px; border-radius:10px;
  font-size:14px; font-weight:600; display:none;
}
.form-status.ok{ display:block; background:var(--teal-dim); color:var(--teal-dark); }
.form-status.err{ display:block; background:#fde8e8; color:#b42318; }

/* ---- Footer ---- */
footer{ background:#0b1615; color:#eaf6f6; padding:70px 0 30px; margin-top:60px; }
.foot-grid{
  display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:50px;
  padding-bottom:44px; border-bottom:1px solid rgba(255,255,255,0.1);
}
@media(max-width:760px){ .foot-grid{grid-template-columns:1fr; gap:32px;} }
.foot-brand{ font-family:'Archivo',sans-serif; font-weight:800; font-size:20px; margin-bottom:10px; }
.foot-brand span{ color:var(--teal); }
.foot-logo{ height:38px; width:auto; display:block; margin-bottom:16px; }
footer p{ color:rgba(234,246,246,0.65); font-size:14px; max-width:320px; }
.foot-col h4{ font-size:13px; text-transform:uppercase; letter-spacing:.08em; color:rgba(234,246,246,0.5); margin-bottom:16px; }
.foot-col a{ display:block; color:rgba(234,246,246,0.85); font-size:14px; margin-bottom:12px; }
.foot-col a:hover{ color:var(--teal); }
.foot-bottom{
  padding-top:24px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  color:rgba(234,246,246,0.5); font-size:13px;
}
@media(max-width:600px){ .foot-bottom{flex-direction:column; text-align:center;} }

/* ---- Reveal animation ---- */
.reveal{ opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:translateY(0); }

/* ---- Legal content (Privacidad) ---- */
.legal-content h2{
  font-size:20px; margin-top:36px; margin-bottom:12px;
}
.legal-content p{ color:var(--muted); margin-bottom:14px; }
.legal-content ul{ color:var(--muted); margin:0 0 14px 20px; }
.legal-content li{ margin-bottom:8px; }
.legal-content a{ color:var(--teal-dark); text-decoration:underline; }

/* ---- Page hero (subpages) ---- */
.page-hero{ padding:56px 0 40px; }
.page-hero h1{ font-size:clamp(32px,4.4vw,46px); }
.page-hero p{ margin-top:16px; color:var(--muted); font-size:17px; max-width:600px; }