/* =========================================================
RETIREMENT PAGE
========================================================= */

.retirement-page{
background:#faf8f3;
font-family:'Inter',sans-serif;
overflow:hidden;
color:#1f2937;
}

.ret-wrap{
max-width:1400px;
margin:auto;
padding:0 20px;
}

/* =========================================================
COMMON
========================================================= */

.ret-title{
text-align:center;
margin-bottom:45px;
}

.ret-title h2{
font-size:34px;
font-weight:800;
line-height:1.2;
margin:0;
color:#163020;
}

/* =========================================================
HERO
========================================================= */

.ret-hero{
padding:90px 0;
background:
radial-gradient(circle at top right,#d1fae5 0%,transparent 30%),
radial-gradient(circle at bottom left,#fef3c7 0%,transparent 35%),
#ffffff;
}

.ret-hero-layout{
display:grid;
grid-template-columns:1.2fr .8fr;
gap:50px;
align-items:center;
}

.ret-label{
display:inline-block;
padding:10px 18px;
border-radius:50px;
background:#dcfce7;
color:#166534;
font-size:11px;
font-weight:700;
letter-spacing:2px;
margin-bottom:20px;
}

.ret-hero-content h1{
font-size:64px;
line-height:1.05;
font-weight:800;
letter-spacing:-2px;
margin:0 0 20px;
color:#163020;
}

.ret-hero-content p{
font-size:16px;
line-height:1.9;
color:#475569;
max-width:650px;
margin-bottom:30px;
}

.ret-btn{
display:inline-flex;
padding:15px 28px;
background:#166534;
color:#fff;
text-decoration:none;
border-radius:14px;
font-weight:700;
}

.ret-hero-cards{
display:grid;
gap:18px;
}

.ret-mini-card{
background:#fff;
padding:28px;
border-radius:22px;
border:1px solid #e5e7eb;
}

.ret-mini-card h3{
margin:0 0 8px;
font-size:22px;
color:#166534;
}

.ret-mini-card p{
margin:0;
font-size:14px;
line-height:1.8;
color:#64748b;
}

/* =========================================================
LIFE
========================================================= */

.ret-life{
padding:90px 0;
background:#f8fafc;
}

.ret-life-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
}

.ret-life-grid div{
background:#fff;
padding:28px;
border-radius:20px;
border:1px solid #e5e7eb;
}

.ret-life-grid h3{
font-size:20px;
margin:0 0 10px;
color:#163020;
}

.ret-life-grid p{
font-size:14px;
line-height:1.8;
margin:0;
color:#64748b;
}

/* =========================================================
PILLARS
========================================================= */

.ret-pillars{
padding:90px 0;
background:
linear-gradient(
135deg,
#fefce8,
#ffffff
);
}

.ret-pillar-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:22px;
}

.ret-pillar{
background:#fff;
padding:30px;
border-radius:24px;
border:1px solid #e5e7eb;
}

.ret-pillar h3{
font-size:24px;
margin:0 0 10px;
color:#166534;
}

.ret-pillar p{
font-size:14px;
line-height:1.8;
margin:0;
color:#64748b;
}

/* =========================================================
PROGRAMS
========================================================= */

.ret-programs{
padding:90px 0;
background:#fff;
}

.ret-program-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
}

.ret-program-card{
display:block;
background:#fff;
border-radius:22px;
overflow:hidden;
border:1px solid #e5e7eb;
text-decoration:none;
}

.ret-program-image{
height:220px;
padding:12px;
}

.ret-program-image img{
width:100%;
height:100%;
object-fit:contain !important;
}

.ret-program-content{
padding:18px;
}

.ret-program-content h3{
font-size:17px;
line-height:1.5;
margin:0;
color:#163020;
}

/* =========================================================
ACTIVITIES
========================================================= */

.ret-activities{
padding:90px 0;
background:
linear-gradient(
135deg,
#ecfdf5,
#ffffff
);
}

.ret-activities-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:18px;
}

.ret-activities-grid div{
padding:18px;
background:#fff;
border-radius:18px;
text-align:center;
font-size:14px;
font-weight:600;
border:1px solid #d1fae5;
}

/* =========================================================
EXPERTS
========================================================= */

.ret-experts{
padding:90px 0;
background:#fff;
}

.ret-expert-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
}

.ret-expert-card{
display:block;
background:#fff;
border-radius:22px;
overflow:hidden;
border:1px solid #e5e7eb;
text-decoration:none;
}

.ret-expert-image{
height:250px;
padding:12px;
}

.ret-expert-image img{
width:100%;
height:100%;
object-fit:contain !important;
}

.ret-expert-content{
padding:16px;
}

.ret-expert-content h3{
font-size:16px;
line-height:1.5;
margin:0;
color:#163020;
}

/* =========================================================
STORIES
========================================================= */

.ret-stories{
padding:90px 0;
background:#f8fafc;
}

.ret-story-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
}

.ret-story-card{
display:block;
background:#fff;
border-radius:22px;
overflow:hidden;
border:1px solid #e5e7eb;
text-decoration:none;
}

.ret-story-image{
height:220px;
padding:12px;
}

.ret-story-image img{
width:100%;
height:100%;
object-fit:contain !important;
}

.ret-story-content{
padding:18px;
}

.ret-story-content h3{
font-size:17px;
line-height:1.5;
margin:0;
color:#163020;
}

/* =========================================================
CLOSING
========================================================= */

.ret-closing{
padding:100px 0;
background:
linear-gradient(
135deg,
#14532d,
#166534
);
text-align:center;
}

.ret-closing-content h2{
font-size:48px;
line-height:1.15;
font-weight:800;
color:#fff;
max-width:900px;
margin:auto auto 20px;
}

.ret-closing-content p{
font-size:18px;
color:rgba(255,255,255,.85);
margin:0;
}

/* =========================================================
TABLET
========================================================= */

@media(max-width:1200px){

.ret-hero-layout{
grid-template-columns:1fr;
}

.ret-life-grid,
.ret-pillar-grid,
.ret-program-grid,
.ret-activities-grid,
.ret-expert-grid,
.ret-story-grid{
grid-template-columns:repeat(2,1fr);
}

}

/* =========================================================
MOBILE
========================================================= */

@media(max-width:768px){

.ret-wrap{
padding:0 15px;
}

.ret-hero,
.ret-life,
.ret-pillars,
.ret-programs,
.ret-activities,
.ret-experts,
.ret-stories,
.ret-closing{
padding:65px 0;
}

.ret-hero-content h1{
font-size:38px;
}

.ret-title h2{
font-size:28px;
}

.ret-life-grid,
.ret-pillar-grid,
.ret-program-grid,
.ret-activities-grid,
.ret-expert-grid,
.ret-story-grid{
grid-template-columns:repeat(2,1fr);
gap:12px;
}

.ret-mini-card,
.ret-pillar,
.ret-life-grid div{
padding:18px;
}

.ret-expert-image{
height:180px;
}

.ret-program-image,
.ret-story-image{
height:160px;
}

.ret-closing-content h2{
font-size:30px;
}

}