:root{
--cp-navy:#071a33;
--cp-navy-2:#102947;
--cp-ink:#18263a;
--cp-muted:#66758a;
--cp-line:#e4e9f0;
--cp-soft:#f6f8fb;
--cp-white:#fff;
--cp-accent:#d99828;
--cp-accent-dark:#b87913;
--cp-radius:18px;
--cp-shadow:0 18px 45px rgba(7,26,51,.08);
}

.contact-page{
background:#fff;
color:var(--cp-ink);
padding-bottom:90px;
}

.contact-page .breadcrumbs{
max-width:1180px;
margin:0 auto;
padding:28px 24px 0;
color:var(--cp-muted);
font-size:13px;
}

.contact-page .breadcrumbs a{
color:var(--cp-muted);
text-decoration:none;
}

.contact-page .breadcrumbs a:hover{
color:var(--cp-accent-dark);
}

/* Hero */

.contact-hero{
max-width:1180px;
margin:0 auto;
padding:72px 24px 58px;
}

.contact-kicker{
display:inline-flex;
align-items:center;
gap:9px;
margin-bottom:17px;
color:var(--cp-accent-dark);
font-size:12px;
font-weight:800;
letter-spacing:.13em;
text-transform:uppercase;
}

.contact-kicker::before{
content:"";
width:28px;
height:2px;
background:var(--cp-accent);
}

.contact-hero h1{
font-family:"Playfair Display", Georgia,serif;
max-width:760px;
margin:0 0 20px;
color:var(--cp-navy);
font-size:clamp(42px,5vw,68px);
line-height:1.04;
letter-spacing:-.045em;
font-weight:750;
}

.contact-hero h1 span{
color:var(--cp-accent-dark);
}

.contact-lead{
max-width:690px;
margin:0;
color:#020202; 
font-size:19px;
line-height:1.7;
}

/* Main two-column area */

.contact-layout{
max-width:1180px;
margin:0 auto;
padding:0 24px;
display:grid;
grid-template-columns:minmax(280px,.82fr) minmax(420px,1.18fr);
gap:28px;
align-items:start;
}

/* Company information */

.contact-info{
position:relative;
overflow:hidden;
padding:34px;
background:var(--cp-navy);
color:#fff;
border-radius:var(--cp-radius);
box-shadow:var(--cp-shadow);
}

.contact-info::after{
content:"";
position:absolute;
width:260px;
height:260px;
right:-120px;
bottom:-145px;
border:1px solid rgba(255,255,255,.12);
border-radius:50%;
box-shadow:
0 0 0 55px rgba(255,255,255,.025),
0 0 0 110px rgba(255,255,255,.018);
}

.contact-info h2{
position:relative;
z-index:1;
margin:0 0 9px;
color:#fff;
font-size:24px;
line-height:1.25;
font-weight:700;
}

.contact-info-intro{
position:relative;
z-index:1;
margin:0 0 30px;
color:rgba(255,255,255,.98);
font-size:16px;
line-height:1.65;
}

.contact-detail{
position:relative;
z-index:1;
display:grid;
grid-template-columns:34px 1fr;
gap:13px;
margin-top:22px;
}

.contact-detail-icon{
width:34px;
height:34px;
display:flex;
align-items:center;
justify-content:center;
border:1px solid rgba(255,255,255,.25);
border-radius:9px;
color:#f1c26a;
font-size:19px;
}

.contact-detail-label{
display:block;
margin-bottom:3px;
color:rgba(255,255,255,.98);
font-size:11px;
font-weight:750;
letter-spacing:.09em;
text-transform:uppercase;
}

.contact-detail-value{
color:#fff;
font-size:16px;
line-height:1.55;
}

.contact-detail-value a{
color:#fff;
text-decoration:none;
}

.contact-detail-value a:hover{
color:#f1c26a;
}

.contact-divider{
position:relative;
z-index:1;
height:1px;
margin:10px 0 25px;
background:rgba(255,255,255,.12);
}

.contact-info-note{
position:relative;
z-index:1;
margin:0;
color:rgba(255,255,255,.92);
font-size:16px;
line-height:1.65;
}

/* Form */

.contact-form-card{
padding:36px;
background:#fff;
border:1px solid var(--cp-line);
border-radius:var(--cp-radius);
box-shadow:var(--cp-shadow);
}

.contact-form-card h2{
margin:0 0 8px;
color:var(--cp-navy);
font-size:27px;
line-height:1.25;
font-weight:720;
}

.contact-form-card > p{
margin:0 0 27px;
color:#020202;
font-size:16px;
line-height:1.65;
}

.contact-form-card .contactForm{
max-width:none !important;
margin:0;
text-align:left;
}

.contact-form-card .contactForm form{
display:block;
}

.contact-form-card .form-field{
margin-bottom:17px;
}

.contact-form-card label{
display:block;
margin-bottom:7px;
color:var(--cp-ink);
font-size:13px;
font-weight:700;
}

.contact-form-card .contactForm input[type="email"],
.contact-form-card .contactForm input[type="text"],
.contact-form-card .contactForm textarea{
display:block;
width:100%;
max-width:none;
margin:0;
padding:13px 15px;
border:1px solid #d8dee7;
border-radius:9px;
background:#fff;
color:var(--cp-ink);
font-size:15px;
line-height:1.5;
box-shadow:none;
transition:border-color .18s ease, box-shadow .18s ease;
}

.contact-form-card .contactForm textarea{
min-height:145px;
resize:vertical;
}

.contact-form-card .contactForm input:focus,
.contact-form-card .contactForm textarea:focus{
outline:none;
border-color:#b8c7da;
box-shadow:0 0 0 4px rgba(217,152,40,.10);
}

.contact-form-card .contactForm button{
width:auto;
min-width:125px;
margin-top:4px;
padding:13px 22px;
border:0;
border-radius:9px;
background:#fdc770;/*#e8ac4b;*/
color:#000000;
font-size:14px;
font-weight:800;
cursor:pointer;
transition:background .18s ease, transform .18s ease;
}

.contact-form-card .contactForm button:hover{
background:var(--cp-accent);
transform:translateY(-1px);
}

.contact-form-note{
margin:17px 0 0 !important;
color:#3a3e43 !important;
font-size:15px !important;
line-height:1.6 !important;
}

/* Existing JS-created success/error messages */

.contact-form-card .messageSent,
.contact-form-card .errorMessage{
display:block;
margin-top:16px;
padding:12px 14px;
border-radius:9px;
font-size:13px;
}

.contact-form-card .messageSent{
background:#eef8f2;
color:#2d6847;
}

.contact-form-card .errorMessage{
background:#fff3f1;
color:#9b3d35;
}

/* Related content */

.contact-related{
max-width:1180px;
margin:70px auto 0;
padding:0 24px;
}

.contact-related-header{
margin-bottom:22px;
}

.contact-related-kicker{
margin-bottom:8px;
color:var(--cp-accent-dark);
font-size:11px;
font-weight:800;
letter-spacing:.12em;
text-transform:uppercase;
}

.contact-related h2{
margin:0;
color:var(--cp-navy);
font-size:28px;
line-height:1.25;
font-weight:720;
}

.contact-related-list{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:16px;
margin:0;
padding:0;
list-style:none;
}

.contact-related-list li{
margin:0;
padding:0;
}

.contact-related-list a{
display:block;
height:100%;
padding:22px;
background:var(--cp-soft);
border:1px solid var(--cp-line);
border-radius:14px;
color:var(--cp-navy);
text-decoration:none;
transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.contact-related-list a:hover{
transform:translateY(-3px);
border-color:#d5dce6;
box-shadow:0 12px 30px rgba(7,26,51,.07);
}

.related-title{
display:block;
margin-bottom:8px;
font-size:15px;
line-height:1.4;
font-weight:750;
}

.related-description{
display:block;
color:#020202;
font-size:13px;
line-height:1.6;
}

/* Remove old empty/list styling inside this page */

.contact-page .emphasizedP{
display:none;
}

.contact-page hr{
display:none;
}

/* Mobile */

@media (max-width:900px){
.contact-layout{
grid-template-columns:1fr;
}

.contact-info{
padding:30px;
}

.contact-related-list{
grid-template-columns:1fr;
}
}

@media (max-width:600px){
.contact-page .breadcrumbs{
padding:20px 20px 0;
}

.contact-hero{
padding:55px 20px 42px;
}

.contact-hero h1{
font-size:42px;
}

.contact-lead{
font-size:17px;
}

.contact-layout{
padding:0 20px;
gap:18px;
}

.contact-info,
.contact-form-card{
padding:25px;
border-radius:14px;
}

.contact-form-card h2{
font-size:24px;
}

.contact-related{
margin-top:50px;
padding:0 20px;
}

.contact-related h2{
font-size:24px;
}
}