/* =========================================
KATA PENGANTAR PPDB
========================================= */

.ppdb-intro-section{
padding:90px 0;
}

.ppdb-intro-wrapper{

background:#fff;

border-radius:32px;

padding:35px;

box-shadow:
0 15px 40px rgba(0,0,0,.06);

overflow:hidden;

}

.ppdb-intro-image{

float:left;

width:380px;

max-width:45%;

margin:
0 35px 20px 0;

}

.ppdb-intro-image img{

width:100%;

display:block;

border-radius:24px;

object-fit:cover;

transition:.6s ease;

}

.ppdb-intro-wrapper:hover img{

transform:scale(1.03);

}

.ppdb-intro-content h2{

font-size:2rem;

font-weight:800;

line-height:1.3;

color:#1f6b4f;

margin:
15px 0 20px;

}

.ppdb-intro-content p{

font-size:1rem;

line-height:1.9;

color:#666;

margin-bottom:16px;

text-align:justify;

}

.ppdb-intro-wrapper::after{

content:"";

display:block;

clear:both;

}

.ppdb-readmore-btn{

display:none;

}
/* =========================================
PROGRAM PENDIDIKAN SANTRI
========================================= */
.ppdb-program-section h2{

color:#1f6b4f;

}

.ppdb-program-section{
padding:90px 0;
}

.ppdb-program-grid{

display:grid;

grid-template-columns:
repeat(4,1fr);

gap:24px;

margin-top:50px;

}

.ppdb-program-card{

background:#fff;

border-radius:28px;

overflow:hidden;

border:1px solid rgba(0,0,0,.05);

box-shadow:
0 10px 30px rgba(0,0,0,.06);

transition:.4s ease;

display:flex;

flex-direction:column;

position:relative;

}

/* GOLD OVERLAY */

.ppdb-program-card::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(
135deg,
rgba(212,175,55,.12),
transparent
);

opacity:0;

transition:.4s;

pointer-events:none;

}

/* SHINE EFFECT */

.ppdb-program-card::after{

content:"";

position:absolute;

top:-120%;

left:-60%;

width:60%;

height:300%;

background:

linear-gradient(
90deg,
transparent,
rgba(255,255,255,.45),
transparent
);

transform:rotate(25deg);

transition:.8s ease;

pointer-events:none;

}

.ppdb-program-card:hover{

transform:
translateY(-10px);

box-shadow:
0 20px 45px rgba(0,0,0,.12);

}

.ppdb-program-card:hover::before{

opacity:1;

}

.ppdb-program-card:hover::after{

left:130%;

}

/* IMAGE */

.ppdb-program-image{

height:220px;

overflow:hidden;

position:relative;

}

.ppdb-program-image img{

width:100%;

height:100%;

object-fit:cover;

display:block;

transition:.7s ease;

}

.ppdb-program-card:hover img{

transform:scale(1.08);

}

/* TITLE */

.ppdb-program-card h3{

padding:20px 20px 10px;

text-align:center;

font-size:1.2rem;

font-weight:700;

line-height:1.4;

color:#1f6b4f;

}

.ppdb-program-card h3 span{

display:block;

color:#1f6b4f;

font-size:1.35rem;

font-weight:800;

margin-top:4px;

}

/* DESCRIPTION */

.ppdb-program-card p{

padding:0 20px;

font-size:.95rem;

line-height:1.8;

color:#666;

text-align:center;

display:flex;

align-items:center;

justify-content:center;

flex-grow:1;

}

/* BUTTON */

.ppdb-program-btn{

display:flex;

justify-content:center;

align-items:center;

margin:20px;

margin-top:auto;

padding:13px;

border-radius:999px;

background:

linear-gradient(
135deg,
#d4af37,
#f4d06f
);

color:#222;

font-weight:700;

text-decoration:none;

transition:.3s;

position:relative;

overflow:hidden;

}

.ppdb-program-btn::before{

content:"";

position:absolute;

top:0;

left:-100%;

width:100%;

height:100%;

background:

linear-gradient(
90deg,
transparent,
rgba(255,255,255,.45),
transparent
);

transition:.6s;

}

.ppdb-program-btn:hover::before{

left:100%;

}

.ppdb-program-btn:hover{

transform:translateY(-3px);

box-shadow:
0 10px 20px rgba(212,175,55,.35);

}
/* =========================================
PERSYARATAN PENDAFTARAN
========================================= */

.ppdb-syarat-section{
padding:90px 0;
}

.ppdb-syarat-section h2{
color:#1f6b4f;
}

.ppdb-syarat-grid{

display:grid;

grid-template-columns:
repeat(2,1fr);

gap:30px;

margin-top:50px;

}

.ppdb-syarat-card{

background:#fff;

border-radius:30px;

padding:35px;

border:1px solid rgba(0,0,0,.05);

box-shadow:
0 10px 30px rgba(0,0,0,.06);

position:relative;

overflow:hidden;

transition:.4s ease;

}

/* GOLD OVERLAY */

.ppdb-syarat-card::before{

content:"";

position:absolute;

inset:0;

background:

linear-gradient(
135deg,
rgba(212,175,55,.10),
transparent
);

opacity:0;

transition:.4s;

pointer-events:none;

}

/* SHINE EFFECT */

.ppdb-syarat-card::after{

content:"";

position:absolute;

top:-120%;

left:-60%;

width:60%;

height:300%;

background:

linear-gradient(
90deg,
transparent,
rgba(255,255,255,.45),
transparent
);

transform:rotate(25deg);

transition:.8s ease;

pointer-events:none;

}

.ppdb-syarat-card:hover{

transform:
translateY(-10px);

box-shadow:
0 20px 45px rgba(0,0,0,.12);

}

.ppdb-syarat-card:hover::before{

opacity:1;

}

.ppdb-syarat-card:hover::after{

left:130%;

}

.ppdb-syarat-card h3{

font-size:1.4rem;

font-weight:800;

color:#1f6b4f;

margin-bottom:25px;

text-align:center;

}

.ppdb-syarat-card ul{

list-style:none;

padding:0;

margin:0;

}

.ppdb-syarat-card li{

position:relative;

padding-left:42px;

margin-bottom:18px;

line-height:1.8;

color:#666;

}

/* CHECKLIST */

.ppdb-syarat-card li::before{

content:"✓";

position:absolute;

left:0;

top:2px;

width:26px;

height:26px;

border-radius:50%;

background:#1f6b4f;

color:#fff;

font-size:.85rem;

font-weight:700;

display:flex;

align-items:center;

justify-content:center;

transition:.3s ease;

}

.ppdb-syarat-card:hover li::before{

transform:scale(1.08);

}
/* =========================================
CARA PENDAFTARAN
========================================= */

.ppdb-cara-section{
padding:90px 0;
}

.ppdb-cara-section h2{
color:#1f6b4f;
}

.ppdb-cara-grid{

display:grid;

grid-template-columns:
repeat(2,1fr);

gap:30px;

margin-top:50px;

}

.ppdb-cara-card{

background:#fff;

border-radius:30px;

padding:35px;

border:1px solid rgba(0,0,0,.05);

box-shadow:
0 10px 30px rgba(0,0,0,.06);

position:relative;

overflow:hidden;

transition:.4s ease;

display:flex;

flex-direction:column;

}

/* GOLD EFFECT */

.ppdb-cara-card::before{

content:"";

position:absolute;

inset:0;

background:
linear-gradient(
135deg,
rgba(212,175,55,.10),
transparent
);

opacity:0;

transition:.4s;

pointer-events:none;

}

.ppdb-cara-card:hover{

transform:
translateY(-10px);

box-shadow:
0 20px 45px rgba(0,0,0,.12);

}

.ppdb-cara-card:hover::before{

opacity:1;

}

/* ICON */

.ppdb-cara-icon{

width:70px;

height:70px;

margin:0 auto 20px;

border-radius:50%;

background:
linear-gradient(
135deg,
#1f6b4f,
#2d8a64
);

display:flex;

align-items:center;

justify-content:center;

font-size:1.8rem;

color:#fff;

}

/* TITLE */

.ppdb-cara-card h3{

text-align:center;

font-size:1.4rem;

font-weight:800;

color:#1f6b4f;

margin-bottom:25px;

}

/* LIST */

.ppdb-cara-card ul{

list-style:none;

padding:0;

margin:0;

flex-grow:1;

}

.ppdb-cara-card li{

position:relative;

padding-left:40px;

margin-bottom:18px;

line-height:1.8;

color:#666;

}

.ppdb-cara-card li::before{

content:"✓";

position:absolute;

left:0;

top:2px;

width:24px;

height:24px;

border-radius:50%;

background:#1f6b4f;

color:#fff;

display:flex;

align-items:center;

justify-content:center;

font-size:.8rem;

font-weight:700;

}

/* BUTTONS */

.ppdb-online-btn,
.ppdb-lokasi-btn{

display:flex;

justify-content:center;

align-items:center;

padding:14px;

margin-top:25px;

border-radius:999px;

font-weight:700;

text-decoration:none;

transition:.3s;

}

.ppdb-online-btn{

background:
linear-gradient(
135deg,
#d4af37,
#f4d06f
);

color:#222;

}

.ppdb-lokasi-btn{

background:
linear-gradient(
135deg,
#1f6b4f,
#2d8a64
);

color:#fff;

}

.ppdb-online-btn:hover,
.ppdb-lokasi-btn:hover{

transform:translateY(-3px);

}
/* =========================================
BIAYA PENDIDIKAN
========================================= */

.ppdb-biaya-section{
padding:90px 0;
}

.ppdb-biaya-section h2{
color:#1f6b4f;
}

.ppdb-biaya-grid{

display:grid;

grid-template-columns:
repeat(2,1fr);

gap:25px;

margin-top:50px;

}

.ppdb-biaya-card{

background:#fff;

border-radius:28px;

overflow:hidden;

border:1px solid rgba(0,0,0,.05);

box-shadow:
0 10px 30px rgba(0,0,0,.06);

transition:.4s ease;

position:relative;

}

.ppdb-biaya-card::before{

content:"";

position:absolute;

inset:0;

background:
linear-gradient(
135deg,
rgba(212,175,55,.10),
transparent
);

opacity:0;

transition:.4s;

pointer-events:none;

}

.ppdb-biaya-card:hover{

transform:translateY(-8px);

box-shadow:
0 20px 45px rgba(0,0,0,.12);

}

.ppdb-biaya-card:hover::before{

opacity:1;

}

.ppdb-biaya-header{

width:100%;

background:none;

border:none;

padding:25px;

cursor:pointer;

display:flex;

justify-content:space-between;

align-items:center;

text-align:left;

}

.ppdb-biaya-header h3{

margin:0;

color:#1f6b4f;

font-size:1.2rem;

font-weight:700;

}

.ppdb-biaya-header span{

display:block;

margin-top:5px;

color:#d4af37;

font-weight:700;

}

.ppdb-biaya-header i{

font-style:normal;

font-size:1.1rem;

color:#1f6b4f;

transition:.4s;

}

.ppdb-biaya-card.active i{

transform:rotate(180deg);

}

.ppdb-biaya-content{

max-height:0;

overflow:hidden;

transition:
max-height .5s ease,
padding .4s ease;

padding:0 25px;

}

.ppdb-biaya-card.active .ppdb-biaya-content{

max-height:500px;

padding:0 25px 25px;

}

.ppdb-biaya-content p{

color:#666;

line-height:1.8;

margin-bottom:15px;

}

.ppdb-biaya-content ul{

padding-left:20px;

color:#666;

line-height:1.8;

}

.ppdb-biaya-note{

margin-top:35px;

padding:20px;

background:
rgba(31,107,79,.08);

border-radius:20px;

color:#555;

line-height:1.8;

text-align:center;

}
/* =========================================
INFORMASI YANG SERING DITANYAKAN
========================================= */

.ppdb-faq-section{
padding:90px 0;
}

.ppdb-faq-section h2{
color:#1f6b4f;
}

.ppdb-faq-wrapper{
margin-top:50px;
}

.ppdb-faq-item{

background:#fff;

border-radius:24px;

margin-bottom:18px;

overflow:hidden;

border:1px solid rgba(0,0,0,.05);

box-shadow:
0 10px 30px rgba(0,0,0,.06);

transition:.4s ease;

position:relative;

}

.ppdb-faq-item:hover{

transform:translateY(-5px);

box-shadow:
0 20px 45px rgba(0,0,0,.10);

}

.ppdb-faq-question{

width:100%;

background:none;

border:none;

padding:24px 28px;

display:flex;

justify-content:space-between;

align-items:center;

cursor:pointer;

text-align:left;

font-size:1rem;

font-weight:700;

color:#1f6b4f;

}

.ppdb-faq-question i{

font-style:normal;

transition:.4s ease;

}

.ppdb-faq-item.active i{

transform:rotate(180deg);

}

.ppdb-faq-answer{

max-height:0;

overflow:hidden;

padding:0 28px;

transition:
max-height .5s ease,
padding .4s ease;

}

.ppdb-faq-item.active .ppdb-faq-answer{

max-height:300px;

padding:0 28px 24px;

}

.ppdb-faq-answer p{

line-height:1.8;

color:#666;

margin:0;

}/* =========================================
CTA PPDB
========================================= */

.ppdb-cta-section{

padding:90px 0;

}

.ppdb-cta-box{

background:
linear-gradient(
135deg,
#1f6b4f,
#2d8a64
);

padding:70px 40px;

border-radius:35px;

text-align:center;

position:relative;

overflow:hidden;

color:#fff;

box-shadow:
0 20px 50px rgba(31,107,79,.25);

}

/* EFFECT */

.ppdb-cta-box::before{

content:"";

position:absolute;

width:300px;

height:300px;

background:
rgba(212,175,55,.12);

border-radius:50%;

top:-120px;

right:-100px;

filter:blur(20px);

}

.ppdb-cta-box::after{

content:"";

position:absolute;

width:250px;

height:250px;

background:
rgba(255,255,255,.05);

border-radius:50%;

bottom:-120px;

left:-80px;

filter:blur(25px);

}

.ppdb-cta-badge{

display:inline-block;

padding:10px 22px;

border-radius:999px;

background:
rgba(255,255,255,.15);

backdrop-filter:blur(10px);

font-size:.9rem;

font-weight:700;

margin-bottom:25px;

}

.ppdb-cta-box h2{

font-size:2.2rem;

font-weight:800;

line-height:1.4;

margin-bottom:20px;

color:#fff;

}

.ppdb-cta-box p{

max-width:850px;

margin:auto;

line-height:1.9;

opacity:.95;

margin-bottom:40px;

}

/* BUTTONS */

.ppdb-cta-buttons{

display:flex;

justify-content:center;

gap:15px;

flex-wrap:wrap;

}

.ppdb-cta-primary,
.ppdb-cta-secondary,
.ppdb-cta-location{

padding:15px 28px;

border-radius:999px;

font-weight:700;

text-decoration:none;

transition:.35s ease;

display:inline-flex;

align-items:center;

justify-content:center;

min-width:200px;

}

/* DAFTAR */

.ppdb-cta-primary{

background:
linear-gradient(
135deg,
#d4af37,
#f4d06f
);

color:#222;

}

/* WA */

.ppdb-cta-secondary{

background:
rgba(255,255,255,.15);

color:#fff;

border:1px solid rgba(255,255,255,.2);

}

/* MAPS */

.ppdb-cta-location{

background:#fff;

color:#1f6b4f;

}

.ppdb-cta-primary:hover,
.ppdb-cta-secondary:hover,
.ppdb-cta-location:hover{

transform:
translateY(-5px);

}
/* =========================================
KATA PENGANTAR PPDB HP
========================================= */

@media(max-width:768px){

.ppdb-intro-wrapper{

padding:20px;

}

.ppdb-intro-image{

float:none;

width:100%;

max-width:100%;

margin:0 0 20px;

}

.ppdb-intro-content h2{

font-size:1.6rem;

}

.ppdb-intro-content p{

font-size:.95rem;

line-height:1.8;

}

/* =========================================
ANIMASI BACA SELENGKAPNYA PPDB
========================================= */

.ppdb-more-content{

max-height:0;

overflow:hidden;

opacity:0;

transform:translateY(-10px);

transition:
max-height .6s ease,
opacity .4s ease,
transform .4s ease;

}

.ppdb-more-content.active{

max-height:500px;

opacity:1;

transform:translateY(0);

}

.ppdb-readmore-btn{

display:inline-flex;

align-items:center;

justify-content:center;

margin-top:10px;

padding:12px 22px;

border:none;

border-radius:999px;

background:
linear-gradient(
135deg,
#d4af37,
#f4d06f
);

color:#222;

font-weight:700;

cursor:pointer;

transition:.3s;

}

.ppdb-readmore-btn{

display:inline-flex;

align-items:center;

justify-content:center;

gap:8px;

margin-top:10px;

padding:12px 22px;

border:none;

border-radius:999px;

background:
linear-gradient(
135deg,
#d4af37,
#f4d06f
);

color:#222;

font-weight:700;

cursor:pointer;

transition:.35s ease;

}

.ppdb-readmore-btn:hover{

transform:
translateY(-3px);

box-shadow:
0 10px 20px
rgba(212,175,55,.35);

}

.ppdb-readmore-btn:hover{

transform:translateY(-2px);

}

.btn-arrow{

transition:.4s ease;

display:inline-block;

}

.ppdb-readmore-btn.active .btn-arrow{

transform:rotate(180deg);

}
/* =========================================
PROGRAM PENDIDIKAN SANTRI HP
========================================= */

.ppdb-program-grid{

grid-template-columns:
repeat(2,1fr);

gap:15px;

}

.ppdb-program-image{

height:130px;

}

.ppdb-program-card h3{

font-size:1rem;

padding:15px 10px 8px;

}

.ppdb-program-card h3 span{

font-size:1.05rem;

}

.ppdb-program-card p{

font-size:.75rem;

line-height:1.5;

padding:0 10px;

}

.ppdb-program-btn{

font-size:.75rem;

padding:10px;

margin:15px 10px;

}
/* =========================================
PERSYARATAN PENDAFTARAN HP
========================================= */

.ppdb-syarat-grid{

grid-template-columns:1fr;

gap:20px;

}

.ppdb-syarat-card{

padding:25px;

}

.ppdb-syarat-card h3{

font-size:1.2rem;

}

.ppdb-syarat-card li{

font-size:.92rem;

line-height:1.7;

}

/* =========================================
CARA PENDAFTARAN HP
========================================= */

.ppdb-cara-grid{

grid-template-columns:1fr;

gap:20px;

}

.ppdb-cara-card{

padding:25px;

}

.ppdb-cara-card h3{

font-size:1.2rem;

}

.ppdb-cara-card li{

font-size:.92rem;

}
/* =========================================
BIAYA PENDIDIKAN HP
========================================= */

.ppdb-biaya-grid{

grid-template-columns:1fr;

gap:18px;

}

.ppdb-biaya-header{

padding:20px;

}

.ppdb-biaya-header h3{

font-size:1.05rem;

}

.ppdb-biaya-note{

font-size:.9rem;

}
/* =========================================
FAQ HP
========================================= */
.ppdb-faq-question{

padding:20px;

font-size:.95rem;

}

.ppdb-faq-answer{

padding:0 20px;

}

.ppdb-faq-item.active .ppdb-faq-answer{

padding:0 20px 20px;

}
/* =========================================
CTA PPDB HP
========================================= */

.ppdb-cta-box{

padding:50px 25px;

}

.ppdb-cta-box h2{

font-size:1.6rem;

}

.ppdb-cta-buttons{

flex-direction:column;

}

.ppdb-cta-primary,
.ppdb-cta-secondary,
.ppdb-cta-location{

width:100%;

}

}
