/* GROOM CLUB PR - WIX STUDIO CUSTOM CSS */
:root {
/* Colors */
--color-black: #000000;
--color-white: #FFFFFF;
--color-dark-gray: #1A1A1A;
--color-light-gray: #F9F9F9;
/* Typography Variables */
--font-main: 'Inter', sans-serif; /* Replace with actual font used in Wix */
/* Spacing */
--section-padding: 100px 0;
--container-max: 1200px;
--grid-gap: 24px;
}
/* Base Styles */
body {
font-family: var(--font-main);
background-color: var(--color-light-gray);
color: var(--color-dark-gray);
line-height: 1.6;
}
/* Typography Classes */
.hero-title {
font-size: 68px;
font-weight: 900;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--color-black);
margin-bottom: 20px;
}
.hero-subtitle {
font-size: 20px;
font-weight: 400;
color: var(--color-dark-gray);
margin-bottom: 40px;
}
.section-title {
font-size: 42px;
font-weight: 900;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--color-black);
margin-bottom: 40px;
text-align: center;
}
.section-title-white {
font-size: 42px;
font-weight: 900;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--color-white);
margin-bottom: 40px;
text-align: center;
}
.header-nav {
font-size: 14px;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 1px;
}
/* Buttons */
.btn-primary {
background-color: var(--color-black);
color: var(--color-white);
padding: 16px 32px;
border-radius: 4px;
font-weight: 700;
text-transform: uppercase;
border: 2px solid var(--color-black);
transition: all 0.3s ease;
cursor: pointer;
display: inline-block;
}
.btn-primary:hover {
background-color: var(--color-white);
color: var(--color-black);
}
.btn-secondary {
background-color: transparent;
color: var(--color-black);
padding: 16px 32px;
border-radius: 4px;
font-weight: 700;
text-transform: uppercase;
border: 2px solid var(--color-black);
transition: all 0.3s ease;
cursor: pointer;
display: inline-block;
}
.btn-secondary:hover {
background-color: var(--color-black);
color: var(--color-white);
}
.btn-primary-white {
background-color: var(--color-white);
color: var(--color-black);
padding: 16px 32px;
border-radius: 4px;
font-weight: 700;
text-transform: uppercase;
border: 2px solid var(--color-white);
transition: all 0.3s ease;
cursor: pointer;
display: inline-block;
}
.btn-primary-white:hover {
background-color: transparent;
color: var(--color-white);
}
.btn-secondary-white {
background-color: transparent;
color: var(--color-white);
padding: 16px 32px;
border-radius: 4px;
font-weight: 700;
text-transform: uppercase;
border: 2px solid var(--color-white);
transition: all 0.3s ease;
cursor: pointer;
display: inline-block;
}
.btn-secondary-white:hover {
background-color: var(--color-white);
color: var(--color-black);
}
/* Components */
.service-card {
background: var(--color-white);
padding: 30px;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0,0,0,0.05);
transition: transform 0.3s ease, box-shadow 0.3s ease;
text-align: center;
border: 1px solid #EEE;
}
.service-card:hover {
transform: translateY(-5px);
box-shadow: 0 8px 16px rgba(0,0,0,0.1);
}
.program-card {
background: var(--color-light-gray);
padding: 30px;
border-radius: 8px;
margin-bottom: 20px;
border-left: 4px solid var(--color-black);
}
.checklist li {
position: relative;
padding-left: 30px;
margin-bottom: 15px;
color: var(--color-white);
list-style: none;
}
.checklist li::before {
content: '✓';
position: absolute;
left: 0;
color: #4CAF50; /* A green checkmark for contrast on black */
font-weight: bold;
}
.contact-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: var(--grid-gap);
text-align: center;
color: var(--color-white);
}
/* Responsive Breakpoints */
@media (max-width: 1024px) { /* Tablet */
.hero-title { font-size: 48px; }
.section-title, .section-title-white { font-size: 32px; }
/* Assume grid columns handled by Wix Studio visual builder for most parts */
}
@media (max-width: 768px) { /* Mobile */
:root {
--section-padding: 60px 0;
}
.hero-title { font-size: 36px; }
.section-title, .section-title-white { font-size: 28px; }
.hero-subtitle { font-size: 16px; }
.contact-grid {
grid-template-columns: 1fr;
}
}
top of page
bottom of page
