/* Public site styles */
:root{ --primary:#0d6efd; --muted-white: rgba(255,255,255,0.95); }
html,body{height:100%;}
body{margin:0;font-family:system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;color:#222}

/* Topbar */
.topbar{position:fixed;top:0;left:0;right:0;z-index:1060}
.topbar .navbar-brand{font-weight:700; color:var(--primary)}
.topbar .small-logo{height:44px;width:auto}
.topbar .btn{border-radius:6px}
.topbar .container-fluid{padding-left:1.25rem;padding-right:1.25rem}

/* Hero with background image (fondo.png) */
.hero{
  min-height:100vh;
  display:flex;align-items:center;justify-content:center;text-align:center;padding:2rem;
  background: linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)), url('../img/fondo.png') center/cover no-repeat;
  color:#fff;
}
.hero h1{font-size:2.25rem;margin-bottom:0.5rem}
.hero p.lead{font-size:1.05rem;opacity:0.95}

/* Logo sizes */
.hero{position:relative}
.hero::before{
  content:'';
  position:absolute;
  left:0;right:0;top:0;bottom:0;
  /* radial white wash centered to emphasize the logo */
  background: radial-gradient(circle at 50% 40%, rgba(255,255,255,0.98) 0%, rgba(255,255,255,0.9) 8%, rgba(255,255,255,0.6) 18%, rgba(255,255,255,0.0) 40%);
  mix-blend-mode: screen;
  pointer-events:none;
  z-index:1;
}
.hero-logo{width:220px;max-width:80%;height:auto;display:block;margin:0 auto 1rem;position:relative;z-index:3}
@media(min-width:768px){ .hero-logo{width:360px;max-width:60%} .hero h1{font-size:3.2rem} }
@media(min-width:1200px){ .hero-logo{width:520px;max-width:50%} }

/* Stronger white glow behind the hero logo */
.hero-logo {
  /* keep a subtle extra glow while the radial makes the background bright */
  -webkit-filter: drop-shadow(0 0 60px rgba(255,255,255,0.9));
  filter: drop-shadow(0 0 60px rgba(255,255,255,0.9));
}

/* Buttons on hero */
.hero .btn-primary{background:var(--primary);border-color:var(--primary)}
.hero .btn-outline-light{border-color:rgba(255,255,255,0.35);color:#fff}

/* Ensure hero content not hidden under fixed header */
body{padding-top:64px}

/* Responsive adjustments */
@media(max-width:575px){
  .hero h1{font-size:1.6rem}
  .hero p.lead{font-size:0.95rem}
  .topbar .d-flex{gap:0.5rem}
}

/* Public hero CTA: consistent width on desktop, stacked with margin on mobile */
.public-cta { display: flex; gap: 0.5rem; justify-content: center; align-items: center; }
.public-cta .btn { display: inline-flex; align-items: center; justify-content: center; }

@media (min-width: 768px) {
  .public-cta .btn { width: 220px; }
}

@media (max-width: 767.98px) {
  .public-cta { flex-direction: column; width: 100%; }
  .public-cta .btn { width: 100% !important; }
  .public-cta .btn + .btn { margin-top: 0.5rem; }
}
