@import url("institutional-redesign.css?v=3");

/* Homepage artwork stays in normal flow, below the complete navigation. */
body[data-page="home"] .site-header { position: relative; }
body[data-page="home"] .hero { padding: 36px 0 32px; }
body[data-page="home"] .hero::before { display: none; }
body[data-page="home"] .hero-grid { grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr); align-items: start; column-gap: 24px; row-gap: 28px; }
body[data-page="home"] .institutional-art { width: 100%; margin: 0; align-self: start; overflow: visible; }
body[data-page="home"] .institutional-art img { display: block; width: 100%; max-width: 100%; height: auto; transform: none; }
body[data-page="home"] .hero-grid > .hero-proof { margin-top: 0; }
@media(max-width:820px) {
 body[data-page="home"] .hero { padding-top: 28px; }
 body[data-page="home"] .hero-grid { grid-template-columns: minmax(0, 1fr); }
}

/* WCAG contrast corrections for the final institutional palette. */
:is(.dark-section, .flagship) .eyebrow { color: #8bc9ff; }
:is(.dark-section, .flagship) .eyebrow span { background: currentColor; }
:is(.dark-section, .flagship) .section-heading > p:last-child,
:is(.dark-section, .flagship) .split-heading > p { color: #d3e2f1; }
.page-hero .policy-updated {
 color: #43536a;
 border-color: #758397;
 background: #fff;
}

/* Homepage identity statement: make the certification role explicit near the top. */
.identity-trust-strip {
 border-bottom: 1px solid #d9e3ed;
 background: #f4f8fc;
}
.identity-trust-strip .shell {
 display: grid;
 grid-template-columns: 170px minmax(0, 1fr);
 gap: 28px;
 align-items: center;
 padding-block: 22px;
}
.identity-trust-strip strong {
 color: #1769cf;
 font-size: 12px;
 letter-spacing: .1em;
 text-transform: uppercase;
}
.identity-trust-strip p {
 margin: 0;
 color: #33445b;
 font-size: 16px;
 line-height: 1.6;
}
@media(max-width:720px) {
 .identity-trust-strip .shell { grid-template-columns: minmax(0, 1fr); gap: 7px; padding-block: 18px; }
}

/* A filtered header becomes the containing block for the fixed mobile menu in
   Chromium, which constrains the menu to the header height. Remove that filter
   while the collapsed navigation is in use so the menu fills the viewport. */
@media(max-width:1100px) {
 .site-header { -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* Shared spacing for public pages. Loaded last to keep desktop and mobile consistent. */
.section { padding: 52px 0; }
.section-heading { margin-bottom: 28px; }
.split-heading { gap: 36px; }
.hero { min-height: auto; padding: 152px 0 48px; }
.page-hero, .aigrap-hero { padding: 152px 0 48px; }
.hero-grid, .aigrap-hero-grid { gap: 40px; }
.hero-actions { margin-top: 24px; }
.hero-proof { margin-top: 28px; padding-top: 18px; }
.breadcrumb { margin-bottom: 20px; }
.flagship-grid, .trust-grid, .learning-grid, .identity-grid, .international-grid, .certification-training-split, .regional-program-grid, .university-partnership-grid, .intro-grid, .legal-panel, .council-panel { gap: 36px; }
.quick-link-card, .credential-card, .cert-family-card, .purpose-card, .info-card { min-height: auto; padding: 24px; }
.credential-card small { padding-top: 20px; }
.process-grid article, .universal-process article { min-height: auto; padding: 24px; }
.process-grid h3, .universal-process h3 { margin-top: 20px; }
#certification-training .quick-link-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.cta-section, .page-final-cta, .aigrap-final-cta { padding: 48px 0; }
.cta-panel { padding: 32px; }
.policy-section { margin-bottom: 32px; padding-bottom: 32px; }
.policy-layout { gap: 36px; }
.site-footer { padding: 40px 0 20px; }
.footer-grid { gap: 32px; }
.footer-logo-box { margin-bottom: 10px; }
.footer-legal { margin-top: 24px; padding: 14px 0; }
.footer-bottom { padding-top: 14px; }
@media(max-width:820px) {
 .section { padding: 40px 0; }
 .hero, .page-hero, .aigrap-hero { padding: 128px 0 36px; }
 .split-heading, .hero-grid, .aigrap-hero-grid { gap: 24px; }
 .section-heading { margin-bottom: 24px; }
 .footer-grid { gap: 24px; }
}
@media(max-width:560px) {
 .section { padding: 32px 0; }
 .hero, .page-hero, .aigrap-hero { padding: 116px 0 32px; }
 #certification-training .quick-link-grid { grid-template-columns: minmax(0,1fr); }
 .quick-link-card, .credential-card, .cert-family-card, .purpose-card, .info-card, .cta-panel { padding: 22px; }
 .cta-section, .page-final-cta, .aigrap-final-cta { padding: 32px 0; }
 .site-footer { padding-top: 32px; }
}

/* Homepage hero alignment and transition. */
body[data-page="home"] .hero { padding-bottom: 32px; }
body[data-page="home"] .hero + .section { padding-top: 32px; }
@media (min-width: 821px) {
 body[data-page="home"] .hero-visual { align-self: start; }
}


/* Balanced flagship typography and supporting focus panel. */
body[data-page="home"] .flagship-grid { grid-template-columns: 1.1fr .9fr; gap: 40px; }
body[data-page="home"] .flagship-copy h2 { font-size: clamp(48px, 5vw, 68px); line-height: 1; }
body[data-page="home"] .flagship-copy h3 { font-size: clamp(23px, 2.2vw, 28px); margin: 18px 0 14px; }
body[data-page="home"] .flagship-copy .text-link { margin-top: 16px; }
body[data-page="home"] .domain-panel { padding: 26px; border-radius: 16px; }
body[data-page="home"] .domain-list li { grid-template-columns: 24px 1fr; gap: 12px; padding: 16px 0; }
body[data-page="home"] .domain-list strong { font-size: 16px; }
body[data-page="home"] .domain-list small { font-size: 13px; }
@media(max-width:820px) {
 body[data-page="home"] .flagship-grid { grid-template-columns: minmax(0,1fr); gap: 24px; }
}
@media(max-width:560px) {
 body[data-page="home"] .domain-panel { padding: 22px; }
}