/* Finance persona page (page-template/persona-finance.php).

   This page has its OWN stylesheet rather than joining the shared
   persona-page.css, so a change made for Finance can never move the four
   persona pages that are already live. Every selector below is scoped to
   this page's own classes -- persona_finance_accordion and
   persona_finance_capability_slider -- which exist nowhere else in the
   theme.

   The rules mirror what persona-page.css does for the other personas. They
   are repeated here, not imported, on purpose: an @import would put the
   shared file back in the dependency path and re-couple the pages. */

/* Kicker-to-heading gap: admission-management.css tightens this to 8px for
   its own "Why Choose" section (.features_section). This page should match
   the standard 15px used elsewhere on the site. */
.solution_section.academia_sis_capabilities.features_section.persona_finance_accordion .title_one .title_bottom {
    margin-top: 15px;
}

/* Mobile gap above "Valuable Customers": that section's 12vw bottom padding
   stacks with this section's 12.35vw top padding (both responsive.css),
   leaving ~90-100px of dead space on phones. */
@media (max-width: 767px) {
    .solution_section.academia_sis_capabilities.features_section.persona_finance_accordion {
        padding-top: 6vw;
    }
}

/* Accordion body padding: admission-management.css's shared
   .solution_section.features_section .accordion-content rule (3 classes)
   pads this box unevenly -- 0 top, ~33px right/bottom, ~65px left. Matching
   its class count here (4, via the page's own accordion class) out-specifies
   it, so this page gets an even 20px and admission-management.php keeps its
   own spacing. */
.solution_section.features_section.persona_finance_accordion .accordion-content {
    padding: 20px;
}

/* The open accordion header takes its own 15px left padding from
   admission-management.css. Matching the 20px above keeps the heading and
   its paragraph on the same left edge. */
.solution_section.features_section.persona_finance_accordion .accordion-header.active-a {
    padding-left: 20px;
    padding-bottom: 0px;
}

/* integration.css sets .features_main's background to a malformed gradient
   (colour stops out of order: 16% then 4%), which browsers clamp into a hard
   colour break partway down -- the visible "blue band" under the capability
   cards. integration.css is shared sitewide and off-limits, so the solid
   background is restored here, scoped to this page. */
.persona_finance_capability_slider.features_main {
    background: var(--theme-background-color);
}

/* Capability cards anchor their content to the top rather than centring it:
   headings wrap to one or two lines depending on the text, and a centred
   card starts its paragraph at a different height on each one. Written with
   two classes because persona-page.css's base
   ".ai_higher_ed_features .ai_feature_card" rule is also (0,2,0) and the two
   files can load in either order. */
.persona_finance_capability_slider .features_box.ai_feature_card {
    justify-content: flex-start;
    padding: 1.5vw;
}

/* Slider arrows: the desktop grid shows all four cards at once, so the
   prev/next buttons are only needed where slick collapses to one card
   (slidesToShow:1 below 550px in custom-script.js). */
.features_main.persona_finance_capability_slider .btn-wrap {
    display: none;
}
@media (max-width: 550px) {
    .features_main.persona_finance_capability_slider .btn-wrap {
        display: flex;
    }
}

/* Rounded corners on the accordion images. The class is on the <img> itself
   and is new to this page, so nothing else in the theme can match it. The
   four shared rules that size these images (ai-for-highered.css:281,
   persona-page.css:67, tvet-solutions.css:18, team-action.css:348) set width
   and height only and never a radius, so there is nothing to out-specify
   here and no risk to the pages they serve. */
.persona_finance_accordion_img {
    border-radius: 7px;
}