:root{
  --bg:#b6b6b6;
  --panel:rgba(255,255,255,.94);
  --panel-soft:rgba(255,255,255,.90);
  --text:#173042;
  --muted:#516474;
  --line:rgba(23,48,66,.10);
  --line-strong:rgba(23,48,66,.18);
  --shadow:0 28px 70px rgba(23,48,66,.12);
  --shadow-soft:0 18px 40px rgba(23,48,66,.08);
  --radius:30px;
  --radius-sm:22px;
  --blue:#1d56b4;
  --green:#168447;
  --red:#c81d33;
  --gold:#ba9b54;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:var(--bg);
  color:var(--text);
}
img{max-width:100%;display:block}
.hidden{display:none !important}
.view{min-height:100vh;position:relative}

h1,h2,h3{margin:0 0 14px;line-height:1.12}
h1{font-size:clamp(1.9rem,4vw,3.1rem);letter-spacing:-.03em}
h2{font-size:clamp(1.45rem,2.5vw,2rem)}
h3{font-size:1.05rem}
p{margin:0 0 14px;line-height:1.76}
ul{margin:0;padding-left:20px}
li{margin:0 0 10px;line-height:1.68}

.login-view{background:#b6b6b6}
.login-columns{
  min-height:100vh;
  display:grid;
  grid-template-columns:35% 30% 35%;
}
.login-side{
  background-image:url('assets/fondo.png');
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
  position:relative;
}
.left-side{background-position:left center}
.right-side{background-position:right center}
.login-side::after{
  content:"";position:absolute;inset:0;background:rgba(182,182,182,.34)
}
.login-center{
  background:#b6b6b6;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:36px 20px;
  position:relative;
}
.top-button{position:absolute;top:20px;right:20px;z-index:3}
.login-panel{
  width:min(100%,460px);
  padding:28px 28px 24px;
  text-align:center;
}
.institutional-card{
  background:var(--panel);
  border:1px solid rgba(255,255,255,.74);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  backdrop-filter:blur(10px);
}
.login-logo{width:min(100%,360px);margin:0 auto 18px}
.login-copy h1{text-align:center}
.login-copy p{text-align:center;color:var(--muted)}

.lang-button,.outline-button,.code-form button{
  appearance:none;border:none;border-radius:999px;padding:11px 18px;font-weight:800;cursor:pointer;
  letter-spacing:.04em;transition:transform .2s ease, opacity .2s ease, background .2s ease;
}
.lang-button:hover,.outline-button:hover,.code-form button:hover{transform:translateY(-1px)}
.lang-button{background:#ffffff;color:var(--text);border:1px solid var(--line)}
.outline-button{background:rgba(255,255,255,.92);color:var(--text);border:1px solid var(--line)}
.code-form{display:grid;gap:12px;text-align:left}
.code-form label{font-size:.92rem;font-weight:700;color:var(--muted)}
.code-form input{
  width:100%;padding:16px 18px;border-radius:16px;border:1px solid rgba(27,38,49,.14);
  font-size:1.35rem;letter-spacing:.42em;text-align:center;background:rgba(255,255,255,.96);outline:none;
}
.code-form input:focus{border-color:rgba(29,86,180,.45);box-shadow:0 0 0 4px rgba(29,86,180,.10)}
.code-form button{
  background:linear-gradient(135deg,var(--blue),var(--green));
  color:#fff;padding:14px 18px;font-size:1rem;box-shadow:0 14px 24px rgba(29,86,180,.16)
}
.status-text{min-height:1.4em;margin-top:14px;color:var(--red);font-weight:700}
.attempts{margin-top:8px;color:var(--muted);text-align:center}

.content-view{background:#b6b6b6}
.content-bg{
  position:fixed;inset:0;pointer-events:none;background:#b6b6b6 url('assets/fondo.png') center/cover no-repeat;opacity:.14;
}
.content-header,.content-shell{position:relative;z-index:2}
.content-header{padding:22px 5% 18px}
.header-actions{display:flex;justify-content:flex-end;gap:12px;margin-bottom:12px}
.hero-logo{width:min(440px,72vw);margin:0 auto 24px}
.centered-card{text-align:center;padding:34px 30px}
.centered-title-card{padding:30px 30px 24px}
.centered-title-card>h2{text-align:center}
.content-shell{
  width:90%;
  margin:0 auto;
  display:grid;
  gap:22px;
  padding:0 0 36px;
}

.section-subtitle{max-width:900px;margin:0 auto 18px;text-align:center;color:var(--muted)}
.intro-visuals-card{overflow:hidden}
.visual-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}
.visual-card{background:rgba(255,255,255,.76);border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:0 8px 18px rgba(27,38,49,.06)}
.visual-card img{width:100%;height:150px;object-fit:cover;border-radius:16px;margin-bottom:14px;background:#f5f7fa}
.visual-card h3{font-size:1rem;text-align:left}
.visual-card p{margin-bottom:0;color:var(--muted)}

.dual-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-top:8px;
}
.info-block{
  border-radius:20px;
  padding:22px 20px 16px;
  border:1px solid var(--line);
}
.positive-block{background:rgba(255,255,255,.72)}
.caution-block{background:rgba(200,29,51,.05)}
.tiers{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:14px 0 18px;
}
.tier{
  border-radius:20px;padding:22px 18px 14px;border:1px solid var(--line);background:rgba(255,255,255,.72)
}
.tier-resource{border-top:4px solid var(--blue)}
.tier-team{border-top:4px solid var(--green)}
.tier-project{border-top:4px solid var(--red)}
.benefit-columns{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.final-card{margin-bottom:12px}

@media (max-width: 1100px){
  .login-columns{grid-template-columns:30% 40% 30%}
}
@media (max-width: 900px){
  .login-columns{grid-template-columns:1fr}
  .login-side{display:none}
  .login-center{padding:32px 18px 24px}
  .content-header,.content-shell{width:92%;padding-left:0;padding-right:0}
  .visual-grid,.dual-grid,.tiers,.benefit-columns{grid-template-columns:1fr}
}
@media (max-width: 600px){
  .login-panel,.centered-card,.centered-title-card{padding:22px 18px}
  .top-button{top:14px;right:14px}
  .header-actions{justify-content:center;flex-wrap:wrap}
  .hero-logo{width:min(92vw,360px)}
  .content-header{padding-top:18px}
  .content-shell{width:94%;gap:18px;padding-bottom:28px}
}

.eyebrow{font-size:.88rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.menu-shell{padding-top:0}.menu-card{max-width:900px;margin:0 auto 24px;text-align:center}.menu-buttons{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px}.primary-nav-button{display:flex;align-items:center;justify-content:center;min-height:88px;padding:18px 22px;border-radius:22px;text-decoration:none;font-weight:800;font-size:1.05rem;letter-spacing:.01em;background:linear-gradient(135deg,var(--blue),var(--green));color:#fff;box-shadow:0 16px 28px rgba(29,86,180,.16);border:1px solid rgba(255,255,255,.45);transition:transform .2s ease, opacity .2s ease}.primary-nav-button:hover{transform:translateY(-1px)}.alt-nav-button{background:linear-gradient(135deg,#355e94,#4a6d8a)}@media (max-width:900px){.menu-buttons{grid-template-columns:1fr}}

body::before{content:'';position:fixed;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.20),rgba(255,255,255,.02) 30%,rgba(255,255,255,.18));pointer-events:none}
.content-header{padding:28px 5% 12px}
.hero-copy{max-width:980px;margin:0 auto;position:relative;overflow:hidden}
.hero-copy::before,.menu-card::before{content:'';position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--red),#ffffff,var(--blue),var(--green),#ffffff,var(--red));opacity:.65}
.institutional-card{background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(255,255,255,.90));border:1px solid rgba(255,255,255,.82);box-shadow:var(--shadow)}
.centered-card,.centered-title-card{position:relative}
.centered-title-card{padding:34px 34px 28px}
.menu-card{max-width:940px}
.section-subtitle{max-width:760px}
.primary-nav-button{min-height:96px;font-size:1.08rem;box-shadow:0 18px 34px rgba(29,86,180,.18)}
.primary-nav-button.alt-nav-button{background:linear-gradient(135deg,#31537e,#5b758f)}
.eyebrow{color:#5f6d79}
@media (max-width:900px){.centered-title-card{padding:26px 22px 22px}}