/* ============================================================================
   Sree ecosystem — shared static styles
   Base reset + link/selection styling + animation keyframes + hover utilities.
   Hover classes here replace the design prototype's runtime `style-hover`
   attribute so the site needs no framework/runtime to render.
   ============================================================================ */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Roboto",system-ui,sans-serif;color:#1f2937;background:#fffaf3;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:#cc5500;text-decoration:none}
a:hover{color:#ff3b01}
::selection{background:rgba(255,153,20,.24)}
img{max-width:100%}

/* ---- keyframes (union across all pages) ---- */
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes dash{to{stroke-dashoffset:-32}}
@keyframes tickerScroll{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@keyframes logoPulse{0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(255,59,1,.22)}50%{transform:scale(1.05);box-shadow:0 0 0 9px rgba(255,59,1,0)}}
@keyframes dotBlink{0%,100%{opacity:.15}50%{opacity:1}}
@keyframes chipBreathe{0%,100%{opacity:.72;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.55}}

/* ---- hover utilities (exact values from the prototype `style-hover`) ---- */
.hv-t1{transition:transform .16s}
.hv-t1:hover{transform:translateY(-1px)}
.hv-t2{transition:transform .16s,box-shadow .16s}
.hv-t2:hover{transform:translateY(-2px)}
.hv-navcta{transition:filter .16s,transform .16s}
.hv-navcta:hover{filter:brightness(1.05);transform:translateY(-1px)}
.hv-cta-primary{transition:transform .18s,box-shadow .18s}
.hv-cta-primary:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(255,80,10,.36)}
.hv-outline{transition:border-color .18s,color .18s}
.hv-outline:hover{border-color:#ff9914;color:#cc5500}
.hv-ghost{transition:background .18s}
.hv-ghost:hover{background:rgba(255,255,255,.22)}
.hv-dark-btn{transition:background .18s}
.hv-dark-btn:hover{background:#3a2418}
.hv-link{transition:color .18s}
.hv-link:hover{color:#ff3b01}
.hv-arrow{transition:gap .18s,color .18s}
.hv-arrow:hover{gap:14px;color:#ff3b01}
.hv-card{transition:transform .18s cubic-bezier(.2,0,0,1),box-shadow .18s,border-color .18s}
.hv-card:hover{transform:translateY(-4px);box-shadow:0 18px 38px rgba(124,45,18,.11);border-color:#ffcf95}
.hv-card-lg{transition:transform .18s,box-shadow .18s,border-color .18s}
.hv-card-lg:hover{transform:translateY(-4px);box-shadow:0 20px 42px rgba(124,45,18,.11);border-color:#ffcf95}
.hv-dark-card{transition:border-color .2s,background .2s}
.hv-dark-card:hover{border-color:rgba(255,153,20,.5);background:rgba(255,255,255,.07)}

/* ecosystem card: top accent bar reveals on card hover */
.eco-card{transition:transform .18s cubic-bezier(.2,0,0,1),box-shadow .18s,border-color .18s}
.eco-card:hover{transform:translateY(-4px);box-shadow:0 18px 38px rgba(124,45,18,.11);border-color:#ffcf95}
.eco-bar{opacity:0;transition:opacity .2s}
.eco-card:hover .eco-bar{opacity:1}

/* ---- responsive: collapse the two-column grids on narrow screens ---- */
@media (max-width:900px){
  .grid-2,.grid-hero,.grid-legal{grid-template-columns:1fr !important}
  .grid-3{grid-template-columns:1fr !important}
  .grid-4{grid-template-columns:repeat(2,1fr) !important}
  .grid-5{grid-template-columns:repeat(2,1fr) !important}
  .nav-links{display:none !important}
  .grid-legal>div:first-child{position:static !important}
}
@media (max-width:560px){
  .grid-4,.grid-5{grid-template-columns:1fr !important}
}