/* Information Pages - Premium Design */
:root {
    --rg-blue-primary: #00465c;
    --rg-blue-secondary: #008eb0;
    --rg-azure: #00aff0;
    --rg-background: #f8fafc;
}

body {
    background: var(--rg-background);
}

.info-hero {
    background: linear-gradient(165deg, var(--rg-blue-primary) 0%, var(--rg-blue-secondary) 100%);
    padding: 140px 0 100px;
    position: relative;
    overflow: hidden;
    clip-path: ellipse(150% 100% at 50% 0%);
    color: white;
}

.info-hero h1 { font-weight: 800; font-size: 3.5rem; text-shadow: 0 10px 30px rgba(0,0,0,0.15); margin-bottom: 1rem; }
.info-hero p { font-size: 1.25rem; opacity: 0.9; max-width: 600px; margin: 0 auto; }

.info-content {
    background: white;
    border-radius: 24px;
    padding: 40px;
    box-shadow: 0 15px 50px rgba(0,0,0,0.05);
    margin-top: -60px;
    position: relative;
    z-index: 2;
    margin-bottom: 60px;
    border: 1px solid #f1f5f9;
}

.info-content h2 { color: #0f172a; font-weight: 700; margin-top: 2rem; margin-bottom: 1rem; }
.info-content h3 { color: #1e293b; font-weight: 600; margin-top: 1.5rem; margin-bottom: 0.75rem; font-size: 1.25rem;}
.info-content p { color: #475569; line-height: 1.7; margin-bottom: 1rem; }
.info-content ul { color: #475569; line-height: 1.7; margin-bottom: 1.5rem; padding-left: 1.5rem; }
.info-content li { margin-bottom: 0.5rem; }

/* Help Cards */
.help-cards { margin-top: -40px; position: relative; z-index: 2; margin-bottom: 60px; }
.help-card { background: white; border-radius: 20px; padding: 30px; text-align: center; height: 100%; box-shadow: 0 10px 30px rgba(0,0,0,0.03); transition: all 0.3s; border: 1px solid #f1f5f9; }
.help-card:hover { transform: translateY(-5px); box-shadow: 0 15px 40px rgba(0,175,240,0.1); border-color: var(--rg-azure); }
.help-icon { font-size: 2.5rem; color: var(--rg-azure); margin-bottom: 1rem; }

/* Career / Area Grid */
.grid-card { background: white; border-radius: 20px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.03); transition: all 0.3s; height: 100%; border: 1px solid #f1f5f9;}
.grid-card:hover { transform: translateY(-5px); box-shadow: 0 15px 40px rgba(0,175,240,0.1); }
.grid-card-body { padding: 25px; }
.grid-tag { background: rgba(0,175,240,0.1); color: var(--rg-azure); padding: 5px 12px; border-radius: 100px; font-size: 0.85rem; font-weight: 600; display: inline-block; margin-bottom: 1rem;}