/* EqForecast v2.104 — site-wide visual/accessibility polish.
   Presentation only: no forecasting, probability, Timeline, planetarium or analytics logic. */

:root{color-scheme:light;--eqf-focus:#4bc7e8}
html{-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

/* Clearer hierarchy and more efficient vertical rhythm across public pages. */
.page-hero{padding:clamp(46px,5.5vw,68px) 0 clamp(40px,5vw,58px)}
.page-hero h1,.section h2,.section h3,.card h3,.info-panel h3,.cta h2{text-wrap:balance}
.page-hero p,.section-head>p,.card p,.info-panel p,.notice,.dark-note{line-height:1.62}
.section{padding:clamp(56px,7vw,80px) 0}
.section-head{margin-bottom:clamp(28px,3.5vw,36px)}
.grid-2,.grid-3,.grid-4{align-items:stretch}
.card,.info-panel,.metric-card,.product-card,.blog-card{height:100%}
.card,.info-panel,.blog-card,.product-card,.metric-card{transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}

/* More coherent surfaces without making the site visually heavy. */
.card,.info-panel,.blog-card,.product-card{border-color:rgba(169,198,216,.62)}
.page-hero{background:linear-gradient(180deg,#eaf5fb 0%,#f8fbfd 68%,#fff 100%)}
.notice,.dark-note{border-left-width:4px}

/* Keyboard accessibility: visible, consistent focus ring. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid var(--eqf-focus);outline-offset:3px
}
.nav-links a:focus-visible,.btn:focus-visible,.lang-switch button:focus-visible{outline-offset:2px}

/* Header/footer: lighter, more refined and easier to scan. */
.site-header{background:rgba(255,255,255,.93);border-bottom-color:rgba(201,220,232,.78)}
.nav-links a{transition:background .16s ease,color .16s ease}
.footer-copy,.footer-col a,.footer-bottom{line-height:1.55}
.footer-col a:hover{text-decoration:underline;text-underline-offset:3px}

/* Links inside editorial content should look actionable, without altering buttons/nav. */
main p a:not(.btn),main li a:not(.btn),main figcaption a:not(.btn){
  color:#0878bd;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px
}

/* Long titles, URLs and scientific labels must never overflow on mobile. */
.news-title,.page-hero h1,.card h3,.event-row h3,.footer-copy,.legal-card dd{overflow-wrap:anywhere}

/* Forms and controls: comfortable targets on touch devices. */
input:not([type="checkbox"]):not([type="radio"]),select,textarea{min-height:44px}
.btn{min-height:42px}
.lang-switch button{min-height:32px}

/* Keep large scientific/technical content usable on narrow screens. */
figure{max-width:100%}
figure img{height:auto}
.table-wrap,.solar-align-table-wrap{overscroll-behavior-inline:contain}

/* The pages with long editorial copy read better with slightly tighter cards. */
@media(min-width:900px){
  .card{padding:25px}
  .info-panel{padding:25px}
}

@media(max-width:900px){
  .section-head{gap:26px}
  .footer-grid{gap:26px}
}

@media(max-width:760px){
  .shell{width:min(100% - 28px,1180px)}
  .page-hero{padding:38px 0 40px}
  .section{padding:48px 0}
  .card,.info-panel{padding:22px}
  .footer-grid{gap:28px}
  .footer-bottom{gap:16px}
}

@media(hover:hover) and (pointer:fine){
  .card:hover,.blog-card:hover,.product-card:hover{border-color:rgba(104,174,211,.70);box-shadow:0 14px 38px rgba(8,35,64,.075)}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}