@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;500;600;700&display=swap');

body{margin:0;background:#fff;font-family:Poppins,sans-serif;color:#041E3F;-webkit-font-smoothing:antialiased}
a{color:#19456D}
a:hover{color:#041E3F}
*{box-sizing:border-box}
input,select,button{font-family:inherit}
html{scroll-behavior:smooth}
img,video{max-width:100%}

@keyframes solGira{to{transform:rotate(360deg)}}
@keyframes solPulso{0%{transform:scale(1);opacity:.55}70%{transform:scale(1.9);opacity:0}100%{transform:scale(1.9);opacity:0}}
@media (prefers-reduced-motion:reduce){[data-sol]{animation:none!important;transition:none!important}}

/* ---------- Header bar (scroll state) ---------- */
.bar{position:fixed;top:0;left:0;right:0;z-index:30;padding:24px 0 0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid transparent;transition:background .3s ease,padding .3s ease,border-color .3s ease}
.bar.scrolled{padding:12px 0;background:rgba(4,30,63,.72);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.12)}
.bar .logo{height:42px;flex:none;transition:height .3s ease}
.bar.scrolled .logo{height:36px}

/* ---------- Desktop pill nav / mobile hamburger ---------- */
.nav-pill{display:none;gap:6px;padding:6px;border-radius:999px;background:rgba(242,242,242,.14);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(14px)}
.nav-pill a{padding:10px 20px;border-radius:999px;background:transparent;color:#fff;font-weight:500;font-size:15px;text-decoration:none;transition:background .25s ease,color .25s ease;white-space:nowrap}
.nav-pill a.active{background:#fff;color:#041E3F}
.hamburger{width:48px;height:48px;border-radius:50%;background:rgba(242,242,242,.14);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(14px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer}
.hamburger i{width:16px;height:1.5px;background:#fff;display:block}
.mobile-menu{display:none;margin:12px 20px 0;padding:8px;border-radius:22px;background:rgba(4,30,63,.6);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(16px);flex-direction:column}
.mobile-menu.open{display:flex}
.mobile-menu a{padding:14px 16px;color:#fff;font-weight:500;font-size:16px;text-decoration:none}

@media (min-width:1100px){
  .nav-pill{display:flex}
  .hamburger{display:none}
  .mobile-menu{display:none!important}
}

/* ---------- Hero photo / word position per breakpoint ---------- */
.hero-photo{object-position:52% 50%}
.hero-grad{background:radial-gradient(ellipse 95% 38% at 25% 58%,rgba(4,30,63,.55),rgba(4,30,63,0)),linear-gradient(180deg,rgba(4,30,63,.45) 0%,rgba(4,30,63,.05) 28%,rgba(4,30,63,.15) 50%,rgba(4,30,63,.55) 82%,#0E3056 100%)}
@media (min-width:1100px){
  .hero-photo{object-position:center 55%}
  .hero-grad{background:radial-gradient(ellipse 55% 45% at 18% 78%,rgba(4,30,63,.42),rgba(4,30,63,0)),linear-gradient(180deg,rgba(4,30,63,.45) 0%,rgba(4,30,63,.05) 28%,rgba(4,30,63,.12) 50%,rgba(4,30,63,.5) 100%)}
}

/* ---------- Pedir su estudio aproximado (sol card) ---------- */
#sol-wrap{position:relative;max-width:440px;width:100%;justify-self:end;min-height:96px}
#sol-wrap .sol-card{position:absolute;left:0;right:0;bottom:0;padding:26px;border-radius:26px;overflow:hidden;background:radial-gradient(circle at 92% 92%,rgba(11,206,150,.32),rgba(11,206,150,0) 55%),rgba(4,30,63,.42);border:1px solid rgba(255,255,255,.26);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);display:flex;flex-direction:column;gap:12px;clip-path:circle(0px at 88% 88%);-webkit-clip-path:circle(0px at 88% 88%);opacity:0;transform:none;transform-origin:88% 88%;transition:clip-path 1.1s cubic-bezier(.65,0,.2,1),-webkit-clip-path 1.1s cubic-bezier(.65,0,.2,1),opacity .5s ease,transform 1s cubic-bezier(.65,0,.2,1),border-radius 1s cubic-bezier(.65,0,.2,1);pointer-events:none}
#sol-wrap.open .sol-card{position:relative;clip-path:circle(150% at 88% 88%);-webkit-clip-path:circle(150% at 88% 88%);opacity:1;pointer-events:auto}
@media (min-width:1100px){ #sol-wrap .sol-card{position:relative} }
#sol-wrap .sol-trigger{position:absolute;right:0;bottom:0;display:flex;align-items:center;gap:14px;padding:10px 24px 10px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.3);background:rgba(4,30,63,.42);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:#fff;cursor:pointer;text-align:left;opacity:1;transform:scale(1);pointer-events:auto;transition:opacity .45s ease,transform .6s cubic-bezier(.65,0,.2,1)}
#sol-wrap.open .sol-trigger{opacity:0;transform:scale(.6);pointer-events:none}

/* ---------- Toggle pairs (Es para / ¿Hay alguien de día?) ---------- */
.toggle-pair{display:flex;padding:4px;border-radius:12px;background:rgba(4,30,63,.45)}
.toggle-pair button{flex:1;padding:11px 8px;border-radius:9px;border:none;background:transparent;color:#fff;font-size:15px;font-weight:500;cursor:pointer}
.toggle-pair button.selected{background:#fff;color:#041E3F}

/* ---------- FAQ accordion ---------- */
.faq-item .faq-answer{display:none}
.faq-item.open .faq-answer{display:block}
.faq-item.open .faq-sign{font-size:22px}

/* ---------- Responsive helpers ---------- */
@media (max-width:1099px){
  .grid-auto-rows-obras{grid-auto-rows:220px!important}
}