:root{
  --indigo:#0e3a9a;
  --indigo-2:#0a2f7e;
  --sky:#cfe5fa;
  --text:#0b1324;
  --danger:#c8102e;
  --card-shadow: 0 14px 34px rgba(12,40,95,.12);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:Inter,system-ui,Segoe UI,Roboto,Arial;line-height:1.65;color:var(--text);background:#fff}
.container{max-width:1180px;margin:0 auto;padding:0 22px}

/* Top rounded bar */
.topband{background:var(--sky);padding:16px 0}
.topband .wrap{
  background:#fff;border-radius:999px;box-shadow:0 10px 30px rgba(15,30,60,.12);
  display:flex;align-items:center;gap:18px;padding:10px 18px;position:relative;
}
.topband .crest img{height:30px;width:auto}
.topband nav{display:flex;gap:22px;align-items:center;flex:1;justify-content:center}
.topband nav a{color:#0b1220;text-decoration:none;font-weight:700}
.lang{background:var(--danger);color:#fff;border:none;border-radius:999px;padding:10px 16px;font-weight:800;cursor:pointer}

/* Hero diagonals */
.hero{position:relative;min-height:72vh;display:flex;align-items:center;overflow:hidden;background:#ffffff}
.hero .layer{position:absolute;inset:auto -10% -34% -10%;height:110vh;transform:skewY(-14deg);z-index:-2;
  background:linear-gradient(90deg,#103a88 0%,#1a58c4 60%,#2b6ee9 100%);box-shadow:0 60px 110px rgba(14,35,78,.35)}
.hero .layer.dark{inset:auto -16% -50% -16%;height:120vh;transform:skewY(-16deg);
  background:linear-gradient(90deg,#0a2f7e 0%,#113c95 60%,#1f56d8 100%);z-index:-3;box-shadow:0 80px 140px rgba(3,17,56,.45)}
.hero .cut{position:absolute;inset:-18% -20% auto -20%;height:110vh;transform:skewY(-16deg);
  box-shadow: inset 120px 0 140px rgba(0,0,0,.06), inset -120px 0 140px rgba(0,0,0,.06)}
.hero .content{position:relative;z-index:1;width:100%}

.grid{display:grid;gap:18px}
.grid-2{grid-template-columns:1.1fr .9fr}
h1,h2,h3{font-family:Georgia,serif}
h1{font-size:44px;margin:0 0 6px 0;font-weight:900}
.lead{color:#334155;margin:6px 0 12px;font-size:18px}
.btn{display:inline-block;padding:12px 18px;border-radius:14px;font-weight:800;text-decoration:none}
.btn-primary{background:#0f3c9e;color:#fff;box-shadow:0 8px 20px rgba(15,60,158,.28)}
.btn-outline{border:1px solid #d6deea;color:#0f3c9e;background:#fff}
.btn-subscribe{background:var(--danger);color:#fff}

/* Cards & sections */
.card{background:#fff;border-radius:18px;box-shadow:var(--card-shadow);padding:18px}
.section{padding:36px 0}
.small{font-size:12px;color:#667085}

/* Symbols card */
.symbols{display:flex;align-items:center;gap:22px;justify-content:center}
.symbol{height:62px;width:62px}

/* Stats */
.stat{padding:14px;background:#fff;border-radius:16px;box-shadow:0 10px 26px rgba(0,0,0,.08);text-align:center}
.stat .v{font-size:26px;font-weight:900}.stat .l{font-size:12px;color:#667085}

/* Values icons row */
.values-row{display:flex;gap:24px;justify-content:center;align-items:flex-start;flex-wrap:wrap;margin-top:2px}
.values-row figure{display:flex;flex-direction:column;align-items:center;margin:0}
.values-row img{width:72px;height:72px}
.values-row figcaption{margin-top:6px;font-weight:700;color:#2b3648}

/* Footer */
.black-footer{background:#0c0c0c;color:#fff;padding:34px 0 22px}
.black-footer h4{margin:0 0 10px 0}
.black-footer .cols{display:grid;gap:22px;grid-template-columns:1.3fr 1fr 1fr}
.black-footer a{color:#d7e7ff;text-decoration:none}
.black-footer .copyright{border-top:1px solid #232323;margin-top:20px;padding-top:10px;color:#a8a8a8}

@media(max-width:980px){
  .grid-2{grid-template-columns:1fr}
  .black-footer .cols{grid-template-columns:1fr}
}

/* auto: globe halo + indicadores */
#globe3d{ aspect-ratio:16/10; min-height:360px; background:transparent; }
.stat{ background:#0656b8f1 !important; color:#fff !important; border-radius:12px;
  border:1px solid rgba(0,0,0,.1); box-shadow:0 6px 14px rgba(0,0,0,.25); padding:18px 20px; }
.stat .v,.stat .l{ color:#fff !important; }


/* --- Globo encima de "Nuestra Iglesia alrededor del Mundo" --- */
.globo-iglesia{
  width: clamp(240px, 18vw, 320px);
  height: auto;
  display: block;
  margin-inline: auto;
  animation: flotando 3s ease-in-out infinite;
}
@keyframes flotando{
  0%,100%{ transform: translateY(0) }
  50%{ transform: translateY(-10px) }
}


/* --- Ajuste de posición y transparencia del globo --- */
.globo-iglesia{
  margin: 6px auto 72px auto; /* menos margen arriba, más abajo para separarlo del título */
}


/* --- Ajuste final de tamaño y margen --- */
.globo-iglesia{
  width: clamp(260px, 34vw, 380px); /* aún más grande */
  margin: 0 auto 96px auto; /* sin margen arriba, más espacio abajo */
}


/* --- Ajuste extra: más grande, más arriba, sin sombra --- */
.globo-iglesia{
  width: clamp(520px, 38vw, 660px); /* mucho más grande */
  margin: -60px auto 100px auto; /* se sube más hacia arriba */
  box-shadow: none !important;
  filter: none !important;
}

.globe { width: 1000px !important; max-width: 95vw !important; margin-top: 0 !important; }

.hero-bg {
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(207,229,255,0.9), rgba(207,229,255,0) 120px),
    linear-gradient(135deg,
      #0a2a63 0%,    #0a2a63 20%,
      #0e6dd1 20%,   #0e6dd1 40%,
      #ffffff 40%,   #ffffff 60%,
      #0e6dd1 60%,   #0e6dd1 80%,
      #071a3a 80%,   #071a3a 100%
    );
  opacity:0.22;
  transform:none;
  z-index:-1;
  filter: saturate(1) contrast(1.05);
}