Contact Us | Parishram Enterprises
/* — CSS VARIABLES (MATCHING GLOBAL THEME) — */
:root {
/* Brand Colors */
–primary-red: #dc2626;
–primary-dark-red: #b91c1c;
–primary-blue: #0f3c7a;
–primary-dark-blue: #0a2751;
–accent-gold: #f59e0b;
/* Neutrals */
–text-dark: #111827;
–text-gray: #4b5563;
–text-light: #9ca3af;
–bg-light: #f9fafb;
–white: #ffffff;
/* Spacing & Layout */
–container-width: 1280px;
–section-padding: 6rem 0;
–transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
font-family: ‘Inter’, sans-serif;
color: var(–text-dark);
line-height: 1.6;
background-color: var(–white);
overflow-x: hidden;
}h1, h2, h3, h4 { font-family: ‘Oswald’, sans-serif; line-height: 1.2; text-transform: uppercase; }
a { text-decoration: none; color: inherit; }/* — UTILITIES — */
.container { width: 100%; max-width: var(–container-width); margin: 0 auto; padding: 0 1.5rem; }
.text-accent { color: var(–accent-gold); }
.text-primary { color: var(–primary-red); }
.text-secondary { color: var(–primary-blue); }
.section-title { margin-bottom: 4rem; text-align: center; }
.section-title h2 { font-size: 2.5rem; font-weight: 700; color: var(–text-dark); margin-bottom: 1rem; }
.section-title .divider { height: 4px; width: 80px; background: var(–primary-red); margin: 0 auto; border-radius: 2px; }.btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 1rem 2.5rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 1px;
border-radius: 4px;
transition: var(–transition);
cursor: pointer;
border: none;
gap: 0.8rem;
font-size: 0.9rem;
}.btn-primary {
background-color: var(–primary-red);
color: var(–white);
box-shadow: 0 10px 20px rgba(220, 38, 38, 0.3);
}.btn-primary:hover {
transform: translateY(-3px);
background-color: var(–primary-dark-red);
box-shadow: 0 15px 30px rgba(220, 38, 38, 0.4);
}/* — HERO SECTION — */
.page-hero {
position: relative;
height: 50vh;
min-height: 400px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
color: var(–white);
background: linear-gradient(rgba(15, 60, 122, 0.9), rgba(220, 38, 38, 0.85)),
url(‘https://images.unsplash.com/photo-1596524430615-b46475ddff6e?ixlib=rb-1.2.1&auto=format&fit=crop&w=1950&q=80’);
background-size: cover;
background-position: center;
background-attachment: fixed;
overflow: hidden;
}.page-hero::before {
content: ”;
position: absolute;
top: 0; left: 0; width: 100%; height: 100%;
background-image: radial-gradient(rgba(255,255,255,0.1) 1px, transparent 1px);
background-size: 30px 30px;
pointer-events: none;
}.hero-content h1 {
font-size: 3.5rem;
margin-bottom: 1rem;
letter-spacing: 2px;
text-shadow: 0 4px 10px rgba(0,0,0,0.3);
}/* — CONTACT INFO CARDS — */
.contact-info-section {
padding: var(–section-padding);
background: var(–bg-light);
margin-top: -80px;
position: relative;
z-index: 10;
}.contact-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
}.contact-card {
background: var(–white);
padding: 3rem 2rem;
text-align: center;
border-radius: 12px;
box-shadow: 0 20px 40px rgba(0,0,0,0.08);
transition: var(–transition);
border-bottom: 4px solid transparent;
}.contact-card:hover {
transform: translateY(-10px);
border-bottom-color: var(–accent-gold);
}.icon-box {
width: 70px; height: 70px;
margin: 0 auto 1.5rem;
background: var(–bg-light);
border-radius: 50%;
display: flex; align-items: center; justify-content: center;
font-size: 1.8rem;
color: var(–primary-blue);
transition: var(–transition);
}.contact-card:hover .icon-box {
background: var(–primary-blue);
color: var(–white);
}.contact-card h3 {
font-size: 1.5rem;
margin-bottom: 1rem;
color: var(–text-dark);
}.contact-card p {
color: var(–text-gray);
margin-bottom: 0.5rem;
}.contact-highlight {
color: var(–accent-gold);
font-weight: 700;
font-size: 1.1rem;
}/* — MAP SECTION — */
.map-section {
height: 450px;
width: 100%;
background: #e5e7eb;
position: relative;
}
.map-placeholder {
width: 100%;
height: 100%;
background-color: #f3f4f6;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
color: var(–text-light);
}.map-frame {
width: 100%;
height: 100%;
border: 0;
filter: grayscale(20%); /* Stylish look */
}/* — MEDIA QUERIES — */
@media (max-width: 768px) {
.contact-info-section { margin-top: 0; }
.page-hero h1 { font-size: 2.5rem; }
}
Contact Us
We are ready to assist you with your workforce needs.
AOS.init({
once: true,
offset: 100,
duration: 800,
easing: ‘ease-out-cubic’,
});
