/* Frontend-specific styles */

/* Hero section */
.hero-title {
    font-family: 'Manrope', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif !important;
    font-weight: 800 !important;
}

.hero-subtitle {
    font-family: 'Manrope', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif !important;
    font-weight: 400 !important;
}

/* Triangle color for hero section */
.hero-triangle {
    border-top-color: rgb(251, 182, 31) !important;
}

@media (min-width: 768px) {
    .hero-triangle {
        border-top-color: transparent !important;
        border-left-color: rgb(251, 182, 31) !important;
    }
}

/* Style for all h2 headings */
h2 {
    color: black !important;
    padding: 2rem 1.5rem !important;
    font-weight: 700 !important;
    text-align: left !important;
}

/* Style for all paragraphs */
p {
    font-size: 1rem !important; /* 16px */
    line-height: 1.6 !important;
    color: black !important;
    text-align: left !important;
    margin-bottom: 1.5rem !important;
    padding: 0 2rem !important;
}

/* Remove margin-bottom and vertical padding for paragraphs inside list items */
ul > li > p,
ol > li > p {
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Show list-style bullets for ul inside div (but keep menu without bullets) */
div > ul {
    list-style: disc !important;
    padding-left: 3rem !important;
    padding-right: 2rem !important;
    margin-bottom: 2em !important;
    margin-top: 2em !important;
}

div > ul > li {
    list-style-type: disc !important;
}

div > ol {
    padding-left: 2rem !important;
    padding-right: 2rem !important;
}

/* Orange background sections */
.bg-orange-section {
    background-color: rgb(230, 115, 58) !important; /* #E6733A */
    padding: 10% 10% 16% 10% !important;
}

/* White text for elements with colored backgrounds */
.bg-orange-500,
.bg-orange-600,
.bg-gray-900,
.bg-purple-500,
.bg-purple-600,
.bg-gray-100,
.bg-gradient-to-r {
    color: white !important;
}

.bg-orange-500 *,
.bg-orange-600 *,
.bg-gray-900 *,
.bg-purple-500 *,
.bg-purple-600 *,
.bg-gray-100 * {
    color: white !important;
}

/* Keep black text for white backgrounds */
.bg-white * {
    color: initial !important;
}

/* Force white text in any element with text-white class */
.text-white,
.text-white *,
.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white p,
.text-white span,
.text-white div {
    color: white !important;
}

/* Primary color class */
.text-primary-600 {
    color: rgb(234, 88, 12) !important;
}

/* Job date styling */
.job-date {
    color: #78716C !important;
    gap: 0.5rem;
    font-weight: 500 !important;
    letter-spacing: 0.1em !important;
    font-size: 0.875rem !important;
    line-height: 1.2 !important;
}