.home-page { /* Specific container for home page content if needed */
    display: flex;
    flex-direction: column;
    align-items: center; /* Center content horizontally */
}
.home-header {
    text-align: center; 
    margin-bottom: 32px; 
    padding: 32px 24px; /* More padding */
    background-color: var(--surface-container-low);
    border-radius: var(--md-sys-shape-corner-xl); 
    width: 100%;
    max-width: 800px; /* Limit width for better readability */
}
.home-header h2 { /* This is the main page title on home */
    font-family: var(--md-sys-typescale-headline-large-font);
    font-size: var(--md-sys-typescale-headline-large-size);
    line-height: 40px;
    font-weight: 500; /* Slightly bolder for emphasis */
    color: var(--primary); 
    margin-top: 0; 
    margin-bottom: 16px;
    border-bottom: none; /* No border for this specific h2 */
}
.home-header p {
    font-size: var(--md-sys-typescale-body-large-size);
    color: var(--on-surface-variant); 
    max-width: 600px;
    margin: 0 auto; 
    line-height: 1.6;
}
.quick-actions-grid {
    display: grid; 
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); /* Ensure cards don't get too small */
    gap: 24px; 
    margin-bottom: 32px;
    width: 100%;
    max-width: 900px; /* Max width for the grid */
}
.action-card { 
    background-color: var(--surface-container);
    border-radius: var(--md-sys-shape-corner-l); 
    padding: 24px; 
    display: flex; 
    flex-direction: column;
    align-items: center; 
    text-align: center;
    box-shadow: var(--md-sys-elevation-level1);
    transition: box-shadow var(--md-sys-motion-duration-s) var(--md-sys-motion-easing-standard),
                transform var(--md-sys-motion-duration-s) var(--md-sys-motion-easing-standard);
    text-decoration: none !important; 
    color: var(--on-surface); 
    border: 1px solid transparent; /* For focus state */
}
.action-card:hover, 
.action-card:focus-visible {
    box-shadow: var(--md-sys-elevation-level2);
    transform: translateY(-4px);
    outline: none;
    border-color: var(--primary); /* Focus indicator */
}
.action-card-icon {
    width: 48px; height: 48px;
    background-color: var(--primary-container);
    color: var(--on-primary-container);
    border-radius: 50%; 
    display: flex; 
    align-items: center; 
    justify-content: center;
    margin-bottom: 16px;
}
.action-card-icon svg { width: 28px; height: 28px; }
.action-card h3 {
    font-family: var(--md-sys-typescale-title-large-font);
    font-size: var(--md-sys-typescale-title-large-size);
    font-weight: var(--md-sys-typescale-title-large-weight);
    color: var(--on-surface); 
    margin-top: 0; 
    margin-bottom: 8px;
}
.action-card p {
    font-size: var(--md-sys-typescale-body-large-size);
    color: var(--on-surface-variant); 
    margin-bottom: 16px; 
    flex-grow: 1; 
}
.action-card .button.text { /* The "Go to..." span styled as button */
    margin-top: auto; 
    pointer-events: none; /* Visual only since parent 'a' is clickable */
    color: var(--primary); /* Ensure it matches button text color */
}
.home-footer {
    text-align: center; 
    margin-top: auto; /* Pushes to bottom if content is short */
    padding: 32px 16px 16px 16px;
    color: var(--on-surface-variant);
    font-size: var(--md-sys-typescale-label-large-size);
    width: 100%;
    max-width: 800px;
}
