/* =========================================================
   SCCORIA CONTACT PAGE V2 ULTRA PREMIUM
========================================================= */

:root{

--dark:#081426;
--gold:#c7a35d;
--gold-light:#e9d4a2;
--text:#4b5563;
--light:#f7f8fa;
--border:#e7eaee;
--white:#ffffff;

}

.sccoria-contact-v2-page{

background:#ffffff;
overflow:hidden;
font-family:'Plus Jakarta Sans',sans-serif;

}

.contact-container{

max-width:1500px;
margin:auto;
padding:0 25px;

}

/* =========================================================
HERO
========================================================= */

.contact-hero-v2{

padding:90px 0 70px;
background:
linear-gradient(
180deg,
#ffffff 0%,
#fafbfc 100%
);

}

.hero-grid{

display:grid;
grid-template-columns:1.2fr .8fr;
gap:40px;
align-items:center;

}

.hero-kicker{

display:inline-flex;
padding:10px 18px;
border-radius:100px;
background:#f4f5f7;
font-size:12px;
font-weight:700;
letter-spacing:2px;
color:var(--dark);
margin-bottom:25px;

}

.hero-content h1{

font-size:clamp(48px,7vw,105px);
line-height:.92;
font-weight:900;
letter-spacing:-3px;
color:var(--dark);
margin:0 0 25px;

}

.hero-content p{

font-size:20px;
line-height:1.9;
max-width:800px;
color:var(--text);
margin-bottom:35px;

}

.hero-actions{

display:flex;
gap:15px;
flex-wrap:wrap;

}

.hero-actions a{

padding:18px 28px;
border-radius:100px;
text-decoration:none;
font-size:14px;
font-weight:800;
transition:.35s;

}

.hero-actions a:first-child{

background:var(--dark);
color:#fff;

}

.hero-actions a:last-child{

border:1px solid var(--border);
color:var(--dark);
background:#fff;

}

.hero-actions a:hover{

transform:translateY(-4px);

}

.hero-side-card{

background:#fff;

padding:45px;

border:1px solid var(--border);

border-radius:40px;

}

.hero-side-card span{

font-size:11px;
letter-spacing:2px;
font-weight:700;
color:var(--gold);
display:block;
margin-bottom:15px;

}

.hero-side-card h3{

font-size:42px;
line-height:1;
font-weight:900;
color:var(--dark);
margin-bottom:25px;

}

.hero-side-card ul{

padding:0;
margin:0;
list-style:none;

}

.hero-side-card li{

padding:12px 0;
font-size:16px;
border-bottom:1px solid #f0f0f0;
color:var(--text);

}

/* =========================================================
SECTION HEADING
========================================================= */

.section-heading{

text-align:center;
margin-bottom:50px;

}

.section-heading span{

display:inline-block;
font-size:11px;
font-weight:700;
letter-spacing:2px;
color:var(--gold);
margin-bottom:12px;

}

.section-heading h2{

font-size:clamp(34px,5vw,70px);
line-height:1;
font-weight:900;
color:var(--dark);
margin:0;

}

/* =========================================================
DIVISIONS
========================================================= */

.learning-divisions-v2{

padding:70px 0;

}

.division-grid{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:18px;

}

.division-box{

padding:35px;
background:#fff;
border:1px solid var(--border);
border-radius:30px;
transition:.35s;

}

.division-box:hover{

transform:translateY(-8px);

}

.division-number{

font-size:12px;
font-weight:800;
letter-spacing:2px;
color:var(--gold);
margin-bottom:15px;

}

.division-box h3{

font-size:28px;
font-weight:900;
color:var(--dark);
margin-bottom:10px;

}

.division-box p{

font-size:15px;
line-height:1.7;
color:var(--text);

}

/* =========================================================
LEADERSHIP
========================================================= */

.leadership-showcase{

padding:80px 0;

background:#fafbfc;

}

.leaders-showcase{

display:flex;
flex-direction:column;
gap:30px;

}

.leader-feature{

display:grid;
grid-template-columns:320px 1fr;
gap:30px;

background:#fff;

padding:30px;

border-radius:35px;

border:1px solid var(--border);

align-items:center;

}

.leader-photo{

height:320px;
overflow:hidden;
border-radius:28px;
background:#f4f6f8;

}

.leader-photo img{

width:100%;
height:100%;
object-fit:contain;
object-position:center;

display:block;

}

.leader-details span{

display:inline-block;
padding:8px 15px;
background:#f4f5f7;
border-radius:100px;
font-size:11px;
font-weight:700;
letter-spacing:1px;
color:var(--gold);
margin-bottom:15px;

}

.leader-details h3{

font-size:42px;
font-weight:900;
color:var(--dark);
margin-bottom:15px;

}

.leader-details p{

font-size:18px;
line-height:1.9;
color:var(--text);

}

/* =========================================================
FORM
========================================================= */

.contact-form-experience{

padding:90px 0;

}

.form-experience-grid{

display:grid;
grid-template-columns:1fr 520px;
gap:40px;

}

.form-experience-content span{

display:block;
font-size:12px;
font-weight:700;
letter-spacing:2px;
color:var(--gold);
margin-bottom:15px;

}

.form-experience-content h2{

font-size:clamp(38px,5vw,72px);
line-height:1;
font-weight:900;
color:var(--dark);
margin-bottom:20px;

}

.form-experience-content p{

font-size:18px;
line-height:1.9;
max-width:700px;
color:var(--text);
margin-bottom:30px;

}

.experience-points{

display:grid;
grid-template-columns:repeat(2,1fr);
gap:15px;

}

.experience-points div{

padding:18px 20px;
background:#fafbfc;
border-radius:20px;
font-size:15px;
font-weight:700;
color:var(--dark);

}

.form-experience-card{

background:#fff;
padding:35px;
border-radius:35px;
border:1px solid var(--border);

}

/* FLUENT FORM */

.form-experience-card input,
.form-experience-card textarea,
.form-experience-card select{

width:100% !important;
border:1px solid #dde2e8 !important;
background:#fafbfc !important;
border-radius:16px !important;
padding:15px !important;
font-size:15px !important;

}

.form-experience-card textarea{

min-height:160px !important;

}

.form-experience-card .ff-btn-submit{

background:var(--dark) !important;
border:none !important;
padding:16px 28px !important;
border-radius:100px !important;
font-weight:800 !important;

}

/* =========================================================
GLOBAL PRESENCE
========================================================= */

.global-presence{

padding:60px 0;

}

.presence-grid{

display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;

}

.presence-item{

padding:35px;
border:1px solid var(--border);
border-radius:30px;
background:#fff;
text-align:center;

}

.presence-item strong{

display:block;
font-size:34px;
font-weight:900;
color:var(--dark);
margin-bottom:10px;

}

.presence-item span{

font-size:14px;
line-height:1.7;
color:var(--text);

}

/* =========================================================
FAQ
========================================================= */

.contact-faq{

padding:90px 0;

}

.faq-list{

max-width:1000px;
margin:auto;

}

.faq-list details{

background:#fff;
border:1px solid var(--border);
border-radius:24px;
padding:25px;
margin-bottom:15px;

}

.faq-list summary{

cursor:pointer;
font-size:18px;
font-weight:800;
color:var(--dark);

}

.faq-list p{

margin-top:15px;
font-size:15px;
line-height:1.8;
color:var(--text);

}

/* =========================================================
MOBILE
========================================================= */

@media(max-width:1200px){

.hero-grid,
.form-experience-grid{

grid-template-columns:1fr;

}

.division-grid{

grid-template-columns:repeat(2,1fr);

}

.presence-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.contact-container{

padding:0 15px;

}

.hero-content h1{

font-size:46px;

}

.hero-content p{

font-size:16px;

}

.hero-side-card{

padding:25px;

}

.hero-side-card h3{

font-size:28px;

}

.division-grid{

grid-template-columns:1fr 1fr;
gap:10px;

}

.division-box{

padding:18px;

}

.division-box h3{

font-size:18px;

}

.leader-feature{

grid-template-columns:1fr;

}

.leader-photo{

height:260px;

}

.leader-details h3{

font-size:28px;

}

.experience-points{

grid-template-columns:1fr;

}

.presence-grid{

grid-template-columns:1fr 1fr;

gap:10px;

}

.presence-item{

padding:20px;

}

.presence-item strong{

font-size:24px;

}

}

@media(max-width:480px){

.division-grid,
.presence-grid{

grid-template-columns:1fr;

}

.hero-content h1{

font-size:38px;

}

.section-heading h2{

font-size:34px;

}

.form-experience-content h2{

font-size:34px;

}

}