/* ==========================================================
   LARGE TABLETS
========================================================== */

@media (max-width:1200px){

.hero-grid{

grid-template-columns:1fr;

gap:60px;

text-align:center;

}

.hero-content{

max-width:850px;

margin:auto;

}

.hero-description{

margin-left:auto;
margin-right:auto;

}

.hero-highlights{

grid-template-columns:repeat(3,1fr);

}

.hero-visual{

min-height:500px;

}

#aiSphere{

height:500px;

}

.grid-4{

grid-template-columns:repeat(2,1fr);

}

}

/* ==========================================================
   TABLETS
========================================================== */

@media (max-width:980px){

.am-header{

height:80px;

}

.am-nav{

display:none;

}

.mobile-toggle{

display:block;

font-size:32px;

}

.am-header-buttons .btn-primary{

display:none;

}

.hero{

padding:120px 0 80px;

min-height:auto;

}

.hero h1{

font-size:3rem;

}

.hero-description{

font-size:1rem;

}

.hero-highlights{

grid-template-columns:1fr;

gap:20px;

}

.grid-2,
.grid-3,
.grid-4{

grid-template-columns:1fr;

}

.hero-scroll{

display:none;

}

}

/* ==========================================================
   MOBILE
========================================================== */

@media (max-width:768px){

.am-container{

width:92%;

}

.hero{

padding-top:110px;

}

.hero-badge{

font-size:.72rem;

letter-spacing:1px;

padding:8px 14px;

}

.hero h1{

font-size:2.4rem;

line-height:1.15;

}

.hero-description{

font-size:.98rem;

line-height:1.7;

}

.hero-visual{

min-height:360px;

}

#aiSphere{

height:360px;

}

.hero-card{

padding:18px;

}

.card{

padding:24px;

}

.page-hero{

padding:120px 0 70px;

}

.about-story,
.about-mission,
.programs-page{

padding:70px 0;

}

}

/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width:480px){

.hero{

padding-top:95px;

}

.hero h1{

font-size:2rem;

}

.hero-description{

font-size:.95rem;

}

.hero-badge{

width:100%;

justify-content:center;

}

.hero-card{

text-align:center;

}

#aiSphere{

height:300px;

}

.am-buttons{

display:flex;

flex-direction:column;

gap:16px;

}

.am-buttons a{

width:100%;

text-align:center;

}

}
@media (max-width:980px){

.ecosystem-layout{

grid-template-columns:1fr;

}

.ecosystem-grid{

grid-template-columns:1fr;

}

.core-circle{

width:260px;

height:260px;

margin:auto;

}

}

@media (max-width:980px){

.program-grid{

grid-template-columns:1fr;

}

}
@media (max-width:980px){

.philosophy-grid{

grid-template-columns:1fr;

}

.philosophy-quote{

margin-top:50px;

}

}
@media (max-width:980px){

.evoco-layout{

grid-template-columns:1fr;

}

.evoco-grid{

grid-template-columns:1fr;

}

.feature-highlights{

grid-template-columns:1fr;

}

}
@media (max-width:980px){

.partnership-layout{

grid-template-columns:1fr;

}

.partnership-grid{

grid-template-columns:1fr;

}

}
@media (max-width:980px){

.impact-layout{

grid-template-columns:1fr;

}

.impact-grid{

grid-template-columns:1fr;

}

}
@media (max-width:768px){

.cta-panel{

padding:50px 30px;

}

.cta-highlights{

gap:10px;

margin:30px 0 40px;

}

.cta .am-buttons{

flex-direction:column;

align-items:center;

}

.cta .btn{

width:100%;

max-width:320px;

justify-content:center;

}

}
@media (max-width:980px){

.footer-grid{

grid-template-columns:1fr 1fr;

gap:40px;

}

}

@media (max-width:640px){

.footer-grid{

grid-template-columns:1fr;

}

.footer-bottom{

flex-direction:column;

align-items:flex-start;

}

.footer-legal{

gap:18px;

}

}
@media (max-width:768px){

.page-header{

padding:140px 0 60px;

}

.page-featured-image{

margin-bottom:30px;

}

}
@media (max-width:768px){

.post-navigation{

flex-direction:column;

}

.post-meta{

font-size:.9rem;

gap:8px;

}

}