main > .container {
    padding: 70px 15px 20px;
}

.footer {
    background-color: #f5f5f5;
    font-size: .9em;
    height: 60px;
}

.footer > .container {
    padding-right: 15px;
    padding-left: 15px;
}

.not-set {
    color: #c55;
    font-style: italic;
}

/* add sorting icons to gridview sort links */
a.asc:after, a.desc:after {
    content: '';
    left: 3px;
    display: inline-block;
    width: 0;
    height: 0;
    border: solid 5px transparent;
    margin: 4px 4px 2px 4px;
    background: transparent;
}

a.asc:after {
    border-bottom: solid 7px #212529;
    border-top-width: 0;
}

a.desc:after {
    border-top: solid 7px #212529;
    border-bottom-width: 0;
}

.grid-view th {
    white-space: nowrap;
}

.hint-block {
    display: block;
    margin-top: 5px;
    color: #999;
}

.error-summary {
    color: #a94442;
    background: #fdf7f7;
    border-left: 3px solid #eed3d7;
    padding: 10px 20px;
    margin: 0 0 15px 0;
}

/* align the logout "link" (button in form) of the navbar */
.nav li > form > button.logout {
    padding-top: 7px;
    color: rgba(0, 0, 0, 0.55);
}

@media(max-width:767px) {
    .nav li > form > button.logout {
        display:block;
        text-align: left;
        width: 100%;
        padding: 10px 0;
    }
}

.nav > li > form > button.logout:focus,
.nav > li > form > button.logout:hover {
    text-decoration: none;
    color: rgba(0, 0, 0, 0.85);
}

.nav > li > form > button.logout:focus {
    outline: none;
}

.form-group {
    margin-bottom: 1rem;
}
/* Hero banner styles */
.hero-banner {
    position: relative;
    padding: 80px 0 90px;
    color: #fff;
    background: linear-gradient(135deg, #23395d 0%, #0d6efd 60%, #4ea7ff 100%);
    overflow: hidden;
}
.hero-banner:before, .hero-banner:after {
    content: "";
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: 0.22;
}
.hero-banner:before {
    width: 420px; height: 420px;
    background: #ffffff;
    top: -120px; left: -120px;
}
.hero-banner:after {
    width: 360px; height: 360px;
    background: #ffd166;
    bottom: -100px; right: -80px;
}
.hero-eyebrow {
    display: inline-block;
    font-size: .85rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    opacity: .9;
    margin-bottom: .5rem;
}
.hero-title {
    font-weight: 700;
    line-height: 1.2;
    font-size: 2.2rem;
    margin-bottom: .75rem;
}
.hero-subtitle {
    max-width: 820px;
    margin: 0 auto 1.25rem;
    font-size: 1.15rem;
    line-height: 1.6;
    opacity: .95;
}
.hero-ctas .btn {
    box-shadow: 0 6px 14px rgba(0,0,0,.15);
}
.btn-outline-light {
    color: #fff;
    border-color: rgba(255,255,255,.6);
}
.btn-outline-light:hover,
.btn-outline-light:focus {
    color: #0d6efd;
    background-color: #fff;
    border-color: #fff;
}

@media (min-width: 768px) {
    .hero-title { font-size: 3rem; }
    .hero-subtitle { font-size: 1.25rem; }
    .hero-banner { padding: 110px 0 120px; }
}

/* Cases section cards */
.case-card {
    border: 0;
    border-radius: 14px;
    box-shadow: 0 6px 18px rgba(0,0,0,.08);
    transition: transform .18s ease, box-shadow .18s ease;
}
.case-card:hover{
    transform: translateY(-2px);
    box-shadow: 0 10px 26px rgba(0,0,0,.12);
}
/* Logo/screenshot area helpers */
.ratio-16x9 { aspect-ratio: 16 / 9; width: 100%; background-color: #fff; }
.object-contain { object-fit: contain; }
.card .card-img-top { border-top-left-radius: 14px; border-top-right-radius: 14px; border-bottom: 1px solid rgba(0,0,0,.05); }

/* Section spacing tweaks under hero */
.site-index .body-content { margin-top: 2rem; }
@media (min-width: 768px) {
  .site-index .body-content { margin-top: 3rem; }
}


/* Brand logo in navbar */
.navbar .navbar-brand img.brand-logo {
    /* Increased size for better visibility on light navbar */
    height: 36px;
    width: auto;
    display: inline-block;
    vertical-align: middle;
    image-rendering: auto;
}
@media (min-width: 768px) {
    .navbar .navbar-brand img.brand-logo {
        height: 44px; /* larger on desktop */
    }
}


/* Full-bleed hero: span background edge-to-edge regardless of container */
.site-index .hero-banner {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    width: 100vw;
}


/* About page enhancements */
.about-page .about-hero {
    background: #fff;
    border-radius: 14px;
}
.about-page .about-portrait {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: linear-gradient(135deg, #e9f2ff 0%, #f7fbff 100%);
    border: 1px solid rgba(13,110,253,.15);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 18px rgba(0,0,0,.06) inset;
}
.about-page .portrait-initials {
    font-weight: 700;
    font-size: 2rem;
    color: #0d6efd;
}
.about-page .about-usps li {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    margin-bottom: .35rem;
}
.about-page .about-usps .usp-icon {
    width: 1.4rem;
    height: 1.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

/* USP cards */
.about-page .usp-card {
    border: 0;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,.06);
}
.about-page .usp-card .usp-badge {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(13,110,253,.08);
    color: #0d6efd;
    margin-bottom: .5rem;
    font-size: 1rem;
}

/* Partners strip (placeholder dots) */
.about-page .logo-strip { margin-top: .5rem; }
.about-page .logo-strip .logo-dot {
    display: inline-block;
    width: 24px; height: 24px;
    border-radius: 50%;
    margin-right: .4rem;
    background: linear-gradient(135deg, #e9ecef 0%, #f8f9fa 100%);
    border: 1px solid rgba(0,0,0,.05);
}

/* Checklist with checkmarks */
.about-page .checklist { list-style: none; padding-left: 0; }
.about-page .checklist li { position: relative; padding-left: 1.6rem; margin-bottom: .35rem; }
.about-page .checklist li:before {
    content: "\2713"; /* check mark */
    position: absolute; left: 0; top: .1rem;
    width: 1.1rem; height: 1.1rem;
    line-height: 1.1rem; text-align: center;
    border-radius: .25rem;
    background: rgba(25,135,84,.1);
    color: #198754; /* bootstrap success */
    font-size: .85rem;
}

/* Utility */
.visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0);
    white-space: nowrap; border: 0;
}

@media (min-width: 768px) {
    .about-page .about-portrait { width: 140px; height: 140px; }
}


/* Breadcrumb polish */
.breadcrumb {
    --bs-breadcrumb-divider: '›'; /* single right-pointing angle quote (U+203A) */
}
.breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(0,0,0,.35);
}
.breadcrumb .breadcrumb-item a {
    color: #0d6efd;
    text-decoration: none;
}
.breadcrumb .breadcrumb-item a:hover,
.breadcrumb .breadcrumb-item a:focus {
    text-decoration: underline;
}
.breadcrumb .breadcrumb-item.active {
    color: rgba(0,0,0,.6);
}
@media (max-width: 576px) {
    .breadcrumb {
        font-size: .875rem; /* slightly smaller on mobile */
        padding: .5rem .75rem;
        margin-bottom: .75rem;
    }
}


/* Case-specific logo backdrops for case cards */
/* Maius: match the background color used in 2025_logo_Maius_1024x393.jpg (tweak here if the asset changes) */
.logo-bg-maius { background-color: #1f2a44 !important; }
/* Depplan: light brand blue sampled from provided swatch */
.logo-bg-depplan { background-color: #e8f4ff !important; }