/* =========================================================================
   design-layer.css — shared layout & typography layer (layout modernization)
   Loaded AFTER the site's existing stylesheets.

   Rules:
   - Layout and typography properties only (spacing, gutters, padding, radii,
     neutral shadows, widths, line-height, font-size scale).
   - No changes to display, position, z-index, structural layout, or colors
     of functional/state elements (errors, success, warnings stay as-is).
   - Brand palette is referenced from the site's own :root variables
     defined in css/style.css / css/style.mini.css
     (--brand #F62217, --dark #092032, --body #516171) — no new colors.
   ========================================================================= */

/* ---------- Typography scale & rhythm (Barlow, per existing :root/theme) --- */

h1, h2, h3, h4, h5, h6 {
    line-height: 1.3;
}

h1 { margin-bottom: 1rem; }
h2 { margin-top: 2.75rem; margin-bottom: 1.25rem; }
h3 { margin-top: 2rem;    margin-bottom: 1rem; }
h4, h5, h6 { margin-top: 1.5rem; margin-bottom: .75rem; }

p {
    margin-bottom: 1.15rem;
}

.lead {
    line-height: 1.65;
}

ul, ol {
    margin-bottom: 1.25rem;
}

.container ul,
.container ol {
    padding-left: 2.75rem;
}

li {
    margin-bottom: .4rem;
}

/* ---------- Buttons ------------------------------------------------------ */

.btn {
    padding: .625rem 1.75rem;   /* was 8px 26px */
    border-radius: .5rem;
    line-height: 1.5;
}

.btn-brand {
    border-radius: .5rem;
}

.header-cta-btn {
    padding: .625rem 1.375rem;
    border-radius: .625rem;
    line-height: 1.5;
}

/* Bordered/ghost CTA links used in hero banners (layout only) */
.banner-hero-btn {
    padding: .625rem 1.5rem;
    border-radius: .5rem;
    line-height: 1.5;
}

/* ---------- Forms -------------------------------------------------------- */

.form-group {
    margin-bottom: 1.375rem;
}

.form-control,
.form-control-select {
    padding: .625rem 1rem;      /* slightly roomier touch targets */
    border-radius: .5rem;
    line-height: 1.6;
}

.form-inline .form-control,
.form-inline .input-group {
    margin-bottom: .75rem;
}

.input-group-append,
.input-group-prepend {
    padding-top: .5rem;
}

label {
    margin-bottom: .5rem;
}

select.form-control {
    padding-top: .625rem;
    padding-bottom: .625rem;
}

/* ---------- Cards -------------------------------------------------------- */

.card {
    border-radius: 1rem;        /* was .25rem (bootstrap default) */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
}

.card-body {
    padding: 1.75rem;           /* was 1.25rem */
}

.card-header,
.card-footer {
    padding: 1rem 1.75rem;
}

/* Generic content panels that pages mark up as .card already covered above;
   sample-image wrapper (.cv-main-wrapper) keeps its per-page treatment. */

/* ---------- Tables ------------------------------------------------------- */

.table {
    margin-bottom: 1.5rem;
}

.table th,
.table td {
    padding: .875rem 1rem;
    border-color: rgba(0, 0, 0, 0.08); /* same --border value the site uses */
}

.table thead th {
    padding-bottom: 1rem;
}

.table tbody tr {
    transition: background-color .2s ease;
}

/* ---------- Footer ------------------------------------------------------- */

footer {
    border-radius: 1.5rem 1.5rem 0 0; /* soft top edge over page background */
}

footer .footer-top {
    padding-top: 4.5rem;          /* was 80px -> 72px + rhythm below */
    padding-bottom: 3rem;         /* was 40px */
}

footer .footer-top h1,
footer .footer-top h2,
footer .footer-top h3,
footer .footer-top h4 {
    margin-bottom: 1.25rem;
}

footer p {
    line-height: 1.75;
    margin-bottom: 1rem;
}

.footer-bottom {
    padding-top: 1.5rem;          /* was 20px */
    padding-bottom: 1.5rem;
}

/* ---------- Breadcrumb / section chrome (layout only) --------------------- */

.breadcrumb-item + .breadcrumb-item {
    margin-left: .75rem;          /* was 3rem bootstrap spacing, softened */
}

.breadcrumb {
    margin-bottom: 2rem;         /* was -10px hack baseline; keeps structure */
}

section {
    padding-bottom: 1.75rem;
}

hr {
    margin: 2.5rem 0;
}

/* ---------- Responsive polish (existing breakpoints) ----------------------- */

@media (max-width: 991.98px) {
    h2 {
        margin-top: 2.25rem;
        margin-bottom: 1rem;
    }

    .card,
    .card .card-body {
        border-radius: .75rem;
    }

    .table th,
    .table td {
        padding: .75rem .875rem;
    }
}

@media (max-width: 575.98px) {
    .btn,
    .header-cta-btn,
    .banner-hero-btn {
        border-radius: 100px;     /* pill treatment on small screens matches
                                     the site's existing 100px icon pills   */
    }

    .card-body {
        padding: 1.25rem;
    }
}

/* ---------- Reduced motion ------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}