/*
ResultPro Postgraduate Landing Page — Abstract Art Edition
Updated: 11 July 2026

The uploaded abstract artwork is used as:
1. the full-page background;
2. the header artwork;
3. the navigation-card artwork;
4. the content-card artwork; and
5. the download-card artwork.
*/

:root {
    --pg-navy-950: #082b3f;
    --pg-navy-900: #0d3851;
    --pg-navy-800: #164e6b;
    --pg-blue-700: #2d708c;
    --pg-blue-500: #70a9bd;
    --pg-sky-200: #c9e0e6;
    --pg-cream-50: #fffaf1;
    --pg-cream-100: #f7ead6;
    --pg-amber-500: #dc8b2c;
    --pg-amber-600: #c87020;
    --pg-copper-600: #a95231;
    --pg-copper-700: #813b2a;
    --pg-white: #ffffff;
    --pg-text: #173042;
    --pg-muted: #526979;
    --pg-border: rgba(255, 255, 255, .52);
    --pg-shadow: 0 18px 45px rgba(3, 27, 42, .24);
    --pg-soft-shadow: 0 10px 28px rgba(3, 27, 42, .15);
    --pg-radius-xl: 24px;
    --pg-radius-lg: 18px;
    --pg-radius-md: 13px;
    --pg-art-image: none;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body.pg-landing-body {
    margin: 0;
    min-height: 100vh;
    color: var(--pg-text);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 1.42;
    background-image:
        linear-gradient(135deg, rgba(8, 43, 63, .90), rgba(22, 78, 107, .72) 48%, rgba(169, 82, 49, .72)),
        var(--pg-art-image);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    overflow-y: auto;
}

body.pg-landing-body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(circle at 15% 10%, rgba(255, 236, 194, .22), transparent 28%),
        radial-gradient(circle at 88% 88%, rgba(112, 169, 189, .24), transparent 32%);
}

a {
    color: inherit;
}

button,
input {
    font: inherit;
}

.pg-page-shell {
    width: min(1400px, calc(100% - 34px));
    min-height: calc(100vh - 34px);
    margin: 17px auto;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .55);
    border-radius: var(--pg-radius-xl);
    background: rgba(245, 249, 249, .78);
    box-shadow: 0 28px 80px rgba(0, 16, 29, .38);
    backdrop-filter: blur(18px) saturate(118%);
    -webkit-backdrop-filter: blur(18px) saturate(118%);
}

/* ============================================================
   Header
   ============================================================ */
.pg-landing-header {
    position: relative;
    isolation: isolate;
    min-height: 154px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 22px 34px;
    overflow: hidden;
    color: var(--pg-white);
    background-image:
        linear-gradient(105deg, rgba(6, 38, 57, .95) 0%, rgba(12, 58, 81, .82) 52%, rgba(133, 63, 36, .67) 100%),
        var(--pg-art-image);
    background-size: cover;
    background-position: center 46%;
    border-bottom: 1px solid rgba(255, 255, 255, .34);
}

.pg-landing-header::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(90deg, transparent 0 66%, rgba(255, 221, 163, .11)),
        radial-gradient(circle at 72% 16%, rgba(255, 231, 185, .24), transparent 23%);
}

.pg-header-brand {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
}

.pg-header-logo-wrap {
    width: 108px;
    height: 108px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    overflow: hidden;
    background: rgba(255, 255, 255, .94);
    border: 3px solid rgba(255, 221, 163, .88);
    box-shadow: 0 14px 34px rgba(0, 18, 31, .34), inset 0 0 0 5px rgba(22, 78, 107, .10);
}

.pg-header-logo {
    width: 96px;
    height: 96px;
    object-fit: contain;
}

.pg-header-text {
    min-width: 0;
}

.pg-header-kicker,
.pg-section-label {
    display: block;
    color: var(--pg-amber-500);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.pg-header-kicker {
    margin-bottom: 5px;
    color: #ffdda3;
}

.pg-header-text h1 {
    margin: 0;
    color: var(--pg-white);
    font-size: clamp(29px, 3vw, 43px);
    line-height: 1.02;
    font-weight: 900;
    letter-spacing: -.025em;
    text-shadow: 0 3px 16px rgba(0, 13, 23, .45);
}

.pg-header-text h2 {
    margin: 6px 0 0;
    color: #ffdda3;
    font-size: clamp(18px, 1.75vw, 25px);
    line-height: 1.1;
    font-weight: 650;
}

.pg-header-notice-card {
    width: min(430px, 39%);
    min-height: 84px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 13px 16px;
    border: 1px solid rgba(255, 235, 200, .66);
    border-radius: 16px;
    color: var(--pg-white);
    text-align: left;
    cursor: pointer;
    overflow: hidden;
    position: relative;
    background-image:
        linear-gradient(105deg, rgba(205, 111, 29, .94), rgba(162, 72, 43, .88)),
        var(--pg-art-image);
    background-size: cover;
    background-position: right center;
    box-shadow: 0 14px 34px rgba(0, 18, 31, .30);
    transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}

.pg-header-notice-card::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(120deg, rgba(255, 255, 255, .19), transparent 46%);
}

.pg-header-notice-card:hover,
.pg-header-notice-card:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 19px 42px rgba(0, 18, 31, .37);
    filter: saturate(1.08);
    outline: none;
}

.pg-header-notice-icon {
    position: relative;
    z-index: 1;
    width: 50px;
    height: 50px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 14px;
    font-size: 25px;
    background: rgba(6, 57, 76, .88);
    border: 1px solid rgba(255, 255, 255, .35);
}

.pg-header-notice-copy {
    position: relative;
    z-index: 1;
    min-width: 0;
}

.pg-header-notice-card strong {
    display: block;
    font-size: 16px;
    letter-spacing: .035em;
}

.pg-header-notice-card small {
    display: block;
    margin-top: 2px;
    color: #fff8ea;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 750;
}

.pg-header-notice-card b {
    position: relative;
    z-index: 1;
    margin-left: auto;
    font-size: 38px;
    font-weight: 300;
    line-height: 1;
}

/* ============================================================
   Main layout and navigation
   ============================================================ */
.pg-main-layout {
    display: grid;
    grid-template-columns: 232px minmax(0, 1fr);
    gap: 18px;
    padding: 18px;
}

.pg-left-menu {
    min-width: 0;
}

.pg-search-box,
.pg-menu-group {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .72);
    border-radius: var(--pg-radius-md);
    box-shadow: var(--pg-soft-shadow);
}

.pg-search-box {
    min-height: 66px;
    display: flex;
    align-items: center;
    margin-bottom: 11px;
    padding: 10px;
    background-image:
        linear-gradient(120deg, rgba(255, 250, 241, .91), rgba(201, 224, 230, .87)),
        var(--pg-art-image);
    background-size: cover;
    background-position: 18% 62%;
}

.pg-search-box input {
    width: 100%;
    min-height: 44px;
    padding: 0 12px 0 38px;
    color: var(--pg-navy-950);
    font-size: 13px;
    font-weight: 750;
    border: 1px solid rgba(22, 78, 107, .24);
    border-radius: 10px;
    outline: none;
    background: rgba(255, 255, 255, .82);
    box-shadow: inset 0 1px 3px rgba(0, 25, 40, .07);
}

.pg-search-box input:focus {
    border-color: var(--pg-blue-700);
    box-shadow: 0 0 0 3px rgba(45, 112, 140, .15);
}

.pg-search-icon {
    position: absolute;
    left: 23px;
    top: 17px;
    z-index: 2;
    color: var(--pg-navy-900);
    font-size: 27px;
    line-height: 1;
    transform: rotate(-16deg);
}

.pg-menu-stack {
    display: grid;
    gap: 9px;
}

.pg-menu-group {
    background-image:
        linear-gradient(130deg, rgba(255, 255, 255, .93), rgba(247, 234, 214, .86)),
        var(--pg-art-image);
    background-size: cover;
    background-position: center;
}

.pg-menu-group:nth-child(2) { background-position: 10% 34%; }
.pg-menu-group:nth-child(3) { background-position: 82% 24%; }
.pg-menu-group:nth-child(4) { background-position: 45% 64%; }
.pg-menu-group:nth-child(5) { background-position: 88% 76%; }
.pg-menu-group:nth-child(6) { background-position: 12% 84%; }

.pg-menu-title,
.pg-menu-head {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 37px;
    padding: 8px 11px;
    color: var(--pg-white);
    font-size: 13px;
    font-weight: 900;
    line-height: 1.15;
    text-decoration: none;
    background-image:
        linear-gradient(105deg, rgba(8, 43, 63, .96), rgba(45, 112, 140, .78)),
        var(--pg-art-image);
    background-size: cover;
    background-position: center;
    border-bottom: 1px solid rgba(255, 255, 255, .28);
}

.pg-menu-home .pg-menu-head {
    background-image:
        linear-gradient(105deg, rgba(171, 83, 42, .94), rgba(207, 121, 32, .84)),
        var(--pg-art-image);
}

.pg-menu-group a:not(.pg-menu-head) {
    display: flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 11px 7px 25px;
    position: relative;
    color: var(--pg-navy-900);
    font-size: 12.5px;
    font-weight: 750;
    line-height: 1.2;
    text-decoration: none;
    border-bottom: 1px solid rgba(22, 78, 107, .10);
    transition: background .18s ease, color .18s ease, padding-left .18s ease;
}

.pg-menu-group a:not(.pg-menu-head)::before {
    content: "›";
    position: absolute;
    left: 11px;
    color: var(--pg-copper-600);
    font-size: 19px;
    font-weight: 900;
}

.pg-menu-group a:last-child {
    border-bottom: 0;
}

.pg-menu-group a:not(.pg-menu-head):hover,
.pg-menu-group a:not(.pg-menu-head):focus-visible {
    padding-left: 29px;
    color: var(--pg-copper-700);
    background: rgba(255, 255, 255, .68);
    outline: none;
}

/* ============================================================
   Content cards — each card reuses the uploaded artwork
   ============================================================ */
.pg-content-area {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(350px, .82fr);
    grid-template-areas:
        "intro downloads"
        "application payment"
        "objectives contact";
    gap: 15px;
    align-items: stretch;
}

.pg-card {
    --card-position: center;
    --card-accent: var(--pg-blue-700);
    position: relative;
    isolation: isolate;
    min-width: 0;
    overflow: hidden;
    padding: 18px;
    border: 1px solid var(--pg-border);
    border-radius: var(--pg-radius-lg);
    background: rgba(255, 255, 255, .91);
    box-shadow: var(--pg-soft-shadow);
}

.pg-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background-image: var(--pg-art-image);
    background-size: cover;
    background-position: var(--card-position);
    opacity: .22;
    transform: scale(1.04);
}

.pg-card::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(118deg, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, .90) 63%, rgba(240, 247, 249, .77) 100%),
        linear-gradient(90deg, var(--card-accent), transparent);
}

.pg-card:hover {
    box-shadow: var(--pg-shadow);
}

.pg-intro-card {
    grid-area: intro;
    --card-position: 8% 48%;
    --card-accent: var(--pg-blue-700);
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 17px;
    align-items: stretch;
}

.pg-download-card {
    grid-area: downloads;
    --card-position: 88% 16%;
    --card-accent: var(--pg-amber-500);
}

.pg-application-card {
    grid-area: application;
    --card-position: 35% 78%;
    --card-accent: var(--pg-copper-600);
}

.pg-payment-card {
    grid-area: payment;
    --card-position: 76% 64%;
    --card-accent: var(--pg-blue-700);
}

.pg-objectives-card {
    grid-area: objectives;
    --card-position: 16% 84%;
    --card-accent: var(--pg-amber-600);
}

.pg-contact-card {
    grid-area: contact;
    --card-position: 92% 88%;
    --card-accent: var(--pg-copper-600);
}

.pg-portrait-card {
    min-height: 225px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .68);
    border-radius: 15px;
    background: rgba(255, 255, 255, .75);
    box-shadow: 0 12px 28px rgba(4, 38, 56, .18);
}

.pg-portrait-placeholder {
    min-height: 182px;
    flex: 1 1 auto;
    display: grid;
    place-items: center;
    background-image:
        linear-gradient(135deg, rgba(8, 43, 63, .48), rgba(255, 255, 255, .12), rgba(169, 82, 49, .38)),
        var(--pg-art-image);
    background-size: cover;
    background-position: center;
}

.pg-portrait-placeholder img {
    width: 112px;
    height: 112px;
    object-fit: contain;
    padding: 7px;
    border: 3px solid rgba(255, 222, 165, .92);
    border-radius: 50%;
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 15px 36px rgba(0, 21, 35, .32);
}

.pg-portrait-caption {
    padding: 9px 8px;
    color: var(--pg-navy-900);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .065em;
    text-align: center;
    text-transform: uppercase;
    background: rgba(255, 250, 241, .93);
}

.pg-about-text {
    align-self: center;
    min-width: 0;
}

.pg-about-text h3,
.pg-card-heading h3 {
    margin: 3px 0 10px;
    color: var(--pg-navy-950);
    font-size: 18px;
    line-height: 1.15;
    font-weight: 900;
}

.pg-about-text h3 {
    font-size: 22px;
}

.pg-about-text p,
.pg-section p,
.pg-contact p {
    margin: 0 0 9px;
    color: var(--pg-text);
    text-align: justify;
}

.pg-about-highlight {
    margin-top: 11px !important;
    padding: 9px 11px;
    color: var(--pg-navy-900) !important;
    font-weight: 800;
    border-left: 4px solid var(--pg-amber-500);
    border-radius: 0 10px 10px 0;
    background: rgba(255, 244, 221, .78);
}

.pg-card-heading {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 10px;
}

.pg-card-heading h3 {
    margin-bottom: 0;
}

.pg-heading-icon {
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    color: var(--pg-white);
    font-size: 18px;
    font-weight: 900;
    border-radius: 12px;
    background-image:
        linear-gradient(135deg, rgba(13, 56, 81, .96), rgba(169, 82, 49, .82)),
        var(--pg-art-image);
    background-size: cover;
    background-position: center;
    box-shadow: 0 8px 20px rgba(5, 39, 57, .22);
}

/* Downloads */
.pg-download-list {
    display: grid;
    gap: 8px;
}

.pg-download-list-scroll {
    max-height: 330px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 2px 5px 2px 1px;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: var(--pg-blue-700) rgba(255, 255, 255, .55);
}

.pg-download-list-scroll::-webkit-scrollbar {
    width: 8px;
}

.pg-download-list-scroll::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, .58);
    border-radius: 999px;
}

.pg-download-list-scroll::-webkit-scrollbar-thumb {
    background: linear-gradient(var(--pg-blue-700), var(--pg-copper-600));
    border-radius: 999px;
}

.pg-download-item {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 10px;
    color: var(--pg-navy-900);
    text-decoration: none;
    border: 1px solid rgba(22, 78, 107, .15);
    border-radius: 11px;
    background-image:
        linear-gradient(105deg, rgba(255, 255, 255, .96), rgba(239, 247, 249, .83)),
        var(--pg-art-image);
    background-size: cover;
    background-position: 14% 50%;
    box-shadow: 0 6px 15px rgba(4, 38, 56, .08);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.pg-download-item:nth-child(even) {
    background-position: 86% 28%;
}

.pg-download-item:hover,
.pg-download-item:focus-visible {
    transform: translateX(3px);
    border-color: rgba(169, 82, 49, .42);
    box-shadow: 0 9px 20px rgba(4, 38, 56, .14);
    outline: none;
}

.pg-download-copy {
    min-width: 0;
}

.pg-download-title {
    display: block;
    color: var(--pg-copper-700);
    font-size: 12.5px;
    font-weight: 900;
    line-height: 1.2;
}

.pg-download-desc {
    display: block;
    margin-top: 3px;
    color: var(--pg-muted);
    font-size: 11px;
    font-weight: 650;
    line-height: 1.22;
}

.pg-download-tag {
    flex: 0 0 auto;
    max-width: 94px;
    padding: 5px 8px;
    color: var(--pg-white);
    font-size: 9.5px;
    font-weight: 900;
    line-height: 1.15;
    text-align: center;
    text-transform: uppercase;
    border: 1px solid rgba(255, 255, 255, .32);
    border-radius: 999px;
    background: linear-gradient(105deg, var(--pg-blue-700), var(--pg-copper-600));
}

.pg-download-scroll-hint {
    display: none;
    margin: 7px 2px 0 !important;
    color: var(--pg-blue-700) !important;
    font-size: 10.5px;
    font-weight: 900;
    text-align: right !important;
}

.pg-download-list-scroll.is-scrollable + .pg-download-scroll-hint {
    display: block;
}

.pg-empty {
    margin: 0;
    padding: 12px;
    color: var(--pg-muted);
    border-radius: 10px;
    background: rgba(255, 255, 255, .75);
}

/* Guides and actions */
.pg-steps {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: pg-step;
    display: grid;
    gap: 7px;
}

.pg-steps li {
    counter-increment: pg-step;
    position: relative;
    min-height: 31px;
    padding: 6px 8px 6px 37px;
    color: var(--pg-text);
    border-radius: 9px;
    background: rgba(255, 255, 255, .62);
}

.pg-steps li::before {
    content: counter(pg-step);
    position: absolute;
    left: 7px;
    top: 5px;
    width: 22px;
    height: 22px;
    display: grid;
    place-items: center;
    color: var(--pg-white);
    font-size: 10px;
    font-weight: 900;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--pg-blue-700), var(--pg-copper-600));
}

.pg-action-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.pg-action-btn,
.pg-contact-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 8px 12px;
    color: var(--pg-white);
    font-size: 11.5px;
    font-weight: 900;
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 10px;
    background-image:
        linear-gradient(105deg, rgba(13, 56, 81, .97), rgba(45, 112, 140, .88)),
        var(--pg-art-image);
    background-size: cover;
    background-position: center;
    box-shadow: 0 8px 18px rgba(4, 38, 56, .18);
    transition: transform .18s ease, box-shadow .18s ease;
}

.pg-action-btn.secondary {
    background-image:
        linear-gradient(105deg, rgba(169, 82, 49, .96), rgba(220, 139, 44, .88)),
        var(--pg-art-image);
}

.pg-action-btn:hover,
.pg-action-btn:focus-visible,
.pg-contact-link:hover,
.pg-contact-link:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(4, 38, 56, .25);
    outline: none;
}

.pg-contact-link {
    margin-top: 2px;
    min-height: 34px;
    padding: 7px 11px;
}

.pg-footer {
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px 18px;
    color: rgba(255, 255, 255, .94);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: .02em;
    background-image:
        linear-gradient(105deg, rgba(8, 43, 63, .94), rgba(169, 82, 49, .72)),
        var(--pg-art-image);
    background-size: cover;
    background-position: center 75%;
    border-top: 1px solid rgba(255, 255, 255, .30);
}

/* ============================================================
   Important Notice modal
   ============================================================ */
.pg-notice-overlay {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: rgba(2, 20, 32, .82);
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
}

.pg-notice-overlay.pg-notice-open {
    display: flex;
}

.pg-notice-window {
    width: min(920px, calc(100vw - 30px));
    height: min(620px, calc(100vh - 34px));
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .62);
    border-radius: 20px;
    background: rgba(255, 250, 241, .96);
    box-shadow: 0 30px 90px rgba(0, 11, 20, .55);
}

.pg-notice-titlebar {
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 12px 9px 18px;
    color: var(--pg-white);
    font-size: 17px;
    font-weight: 900;
    background-image:
        linear-gradient(105deg, rgba(8, 43, 63, .96), rgba(169, 82, 49, .78)),
        var(--pg-art-image);
    background-size: cover;
    background-position: center;
}

.pg-notice-titlebar button {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    padding: 0;
    color: var(--pg-navy-950);
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    border: 1px solid rgba(255, 255, 255, .55);
    border-radius: 10px;
    background: rgba(255, 255, 255, .86);
}

.pg-notice-body {
    height: calc(100% - 54px);
    overflow: auto;
    padding: 18px 22px 22px !important;
    color: var(--pg-text);
    font-size: 14px;
    font-weight: 650;
    background-image:
        linear-gradient(125deg, rgba(255, 250, 241, .96), rgba(238, 247, 249, .90)),
        var(--pg-art-image);
    background-size: cover;
    background-position: center;
}

.pg-proceed-btn {
    display: block;
    width: 100%;
    min-height: 50px;
    margin-bottom: 12px;
    color: var(--pg-white);
    font-size: 16px;
    font-weight: 900;
    cursor: pointer;
    border: 1px solid rgba(255, 255, 255, .40);
    border-radius: 12px;
    background-image:
        linear-gradient(105deg, rgba(13, 56, 81, .96), rgba(169, 82, 49, .84)),
        var(--pg-art-image);
    background-size: cover;
    background-position: center;
}

.pg-notice-list {
    display: grid;
    gap: 7px;
    margin-bottom: 12px;
}

.pg-notice-list > a,
.pg-popup-notice-item {
    padding: 9px 10px;
    border: 1px solid rgba(22, 78, 107, .15);
    border-radius: 10px;
    background: rgba(255, 255, 255, .72);
}

.pg-notice-list a {
    color: var(--pg-copper-700);
    font-weight: 900;
}

.pg-popup-notice-item p {
    margin: 3px 0 0;
    color: var(--pg-muted);
    font-size: 12px;
    font-weight: 650;
}

.pg-notice-guide,
.pg-application-payment-guide {
    text-align: left !important;
    color: var(--pg-text) !important;
    font-weight: 650 !important;
    border-top: 1px solid rgba(22, 78, 107, .20) !important;
    margin-top: 12px !important;
    padding-top: 13px !important;
}

.pg-notice-guide h4,
.pg-application-payment-guide h4 {
    margin: 5px 0 7px !important;
    color: var(--pg-copper-700) !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
}

.pg-application-payment-guide .pg-notice-intro {
    max-width: 850px !important;
    margin: 4px auto 11px !important;
    color: var(--pg-navy-900) !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    text-align: center !important;
    font-weight: 750 !important;
}

.pg-application-payment-guide ul,
.pg-notice-guide ul {
    display: block !important;
    max-width: none !important;
    margin: 8px 0 0 18px !important;
    padding-left: 18px !important;
    color: var(--pg-text) !important;
}

.pg-application-payment-guide li,
.pg-notice-guide li {
    margin: 5px 0 !important;
    color: var(--pg-text) !important;
    font-size: 13px !important;
    line-height: 1.32 !important;
}

.pg-application-payment-guide strong {
    color: var(--pg-copper-700) !important;
    font-weight: 900 !important;
}

.pg-notice-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px !important;
    margin-top: 13px !important;
    padding-top: 11px !important;
    border-top: 1px solid rgba(22, 78, 107, .18) !important;
}

.pg-notice-actions a {
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 7px 12px !important;
    color: var(--pg-white) !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    border: 1px solid rgba(255, 255, 255, .35) !important;
    border-radius: 10px !important;
    background: linear-gradient(105deg, var(--pg-blue-700), var(--pg-copper-600)) !important;
}

body.pg-modal-open {
    overflow: hidden;
}

/* ============================================================
   Responsive design
   ============================================================ */
@media (max-width: 1120px) {
    .pg-page-shell {
        width: min(100% - 20px, 1400px);
        margin: 10px auto;
        min-height: calc(100vh - 20px);
    }

    .pg-landing-header {
        padding: 20px 24px;
    }

    .pg-header-notice-card {
        width: min(390px, 40%);
    }

    .pg-main-layout {
        grid-template-columns: 215px minmax(0, 1fr);
        padding: 14px;
        gap: 14px;
    }

    .pg-content-area {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "intro"
            "downloads"
            "application"
            "payment"
            "objectives"
            "contact";
    }
}

@media (max-width: 820px) {
    body.pg-landing-body {
        background-attachment: scroll;
    }

    .pg-page-shell {
        width: 100%;
        min-height: 100vh;
        margin: 0;
        border: 0;
        border-radius: 0;
    }

    .pg-landing-header {
        min-height: 0;
        flex-wrap: wrap;
        gap: 17px;
        padding: 18px;
    }

    .pg-header-brand {
        width: 100%;
        gap: 14px;
    }

    .pg-header-logo-wrap {
        width: 84px;
        height: 84px;
    }

    .pg-header-logo {
        width: 74px;
        height: 74px;
    }

    .pg-header-text h1 {
        font-size: clamp(25px, 7vw, 34px);
    }

    .pg-header-text h2 {
        font-size: 17px;
    }

    .pg-header-notice-card {
        width: 100%;
        min-height: 74px;
    }

    .pg-main-layout {
        grid-template-columns: 1fr;
        padding: 12px;
    }

    .pg-menu-stack {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pg-menu-home {
        grid-column: 1 / -1;
    }
}

@media (max-width: 620px) {
    .pg-header-logo-wrap {
        width: 72px;
        height: 72px;
    }

    .pg-header-logo {
        width: 63px;
        height: 63px;
    }

    .pg-header-kicker {
        font-size: 9px;
        letter-spacing: .09em;
    }

    .pg-header-text h1 {
        font-size: 24px;
    }

    .pg-header-text h2 {
        font-size: 15px;
    }

    .pg-menu-stack {
        grid-template-columns: 1fr;
    }

    .pg-intro-card {
        grid-template-columns: 1fr;
    }

    .pg-portrait-card {
        min-height: 190px;
    }

    .pg-portrait-placeholder {
        min-height: 155px;
    }

    .pg-card {
        padding: 15px;
        border-radius: 15px;
    }

    .pg-download-item {
        align-items: flex-start;
        flex-direction: column;
    }

    .pg-download-tag {
        max-width: none;
    }

    .pg-action-row {
        display: grid;
        grid-template-columns: 1fr;
    }

    .pg-action-btn {
        width: 100%;
    }

    .pg-footer {
        flex-wrap: wrap;
    }

    .pg-notice-overlay {
        padding: 8px;
    }

    .pg-notice-window {
        width: 100%;
        height: calc(100vh - 16px);
        border-radius: 14px;
    }

    .pg-notice-body {
        padding: 14px !important;
    }

    .pg-notice-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
    }

    .pg-notice-actions a {
        width: 100% !important;
    }
}

@media (min-width: 1000px) and (max-height: 780px) {
    .pg-page-shell {
        margin-top: 8px;
        margin-bottom: 8px;
    }

    .pg-landing-header {
        min-height: 128px;
        padding-top: 14px;
        padding-bottom: 14px;
    }

    .pg-header-logo-wrap {
        width: 90px;
        height: 90px;
    }

    .pg-header-logo {
        width: 80px;
        height: 80px;
    }

    .pg-header-notice-card {
        min-height: 74px;
    }

    .pg-main-layout {
        padding-top: 13px;
    }

    .pg-card {
        padding-top: 14px;
        padding-bottom: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

@media print {
    body.pg-landing-body {
        color: #000;
        background: #fff;
    }

    .pg-page-shell {
        width: auto;
        margin: 0;
        border: 0;
        box-shadow: none;
        background: #fff;
    }

    .pg-left-menu,
    .pg-header-notice-card,
    .pg-action-row,
    .pg-notice-overlay {
        display: none !important;
    }

    .pg-main-layout,
    .pg-content-area,
    .pg-intro-card {
        display: block;
    }

    .pg-card {
        margin-bottom: 12px;
        break-inside: avoid;
        box-shadow: none;
        border: 1px solid #bbb;
    }
}

/* ============================================================
   Compact phone landing experience
   ============================================================ */
.pg-mobile-landing-access{display:none}
@media (max-width:820px){
    body.pg-landing-body{overflow-x:hidden}
    .pg-page-shell{width:100%;margin:0;min-height:100dvh;border-radius:0;box-shadow:none}
    .pg-landing-header{padding:12px;gap:10px;min-height:auto}
    .pg-header-brand{align-items:center;gap:10px}
    .pg-header-logo-wrap{width:64px;height:64px;flex:0 0 64px}
    .pg-header-logo{width:56px;height:56px}
    .pg-header-text h1{font-size:clamp(20px,6.2vw,28px);line-height:1.05;margin:2px 0}
    .pg-header-text h2{font-size:13px}
    .pg-header-kicker{font-size:8px;letter-spacing:.08em}
    .pg-header-notice-card{min-height:58px;padding:9px 11px;border-radius:14px}
    .pg-header-notice-icon{font-size:18px}
    .pg-header-notice-copy strong{font-size:10px}
    .pg-header-notice-copy small{font-size:9px}
    .pg-mobile-landing-access{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;padding:10px 10px 2px;background:#f2f6f3}
    .pg-mobile-landing-access a,.pg-mobile-landing-access button{min-width:0;min-height:58px;border:1px solid rgba(6,78,59,.15);border-radius:13px;background:#fff;color:#064e3b;text-decoration:none;padding:8px 5px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font:inherit;box-shadow:0 5px 14px rgba(6,78,59,.07)}
    .pg-mobile-landing-access span{font-size:11px;font-weight:900;line-height:1.1}
    .pg-mobile-landing-access small{font-size:8px;color:#6b7771;margin-top:3px}
    .pg-mobile-landing-access button{background:#064e3b;color:#fff;cursor:pointer}
    .pg-mobile-landing-access button small{color:#f2d57a}
    .pg-main-layout{padding:8px 10px 14px;display:block}
    .pg-left-menu{display:none;margin:0 0 10px;padding:10px;border-radius:15px}
    .pg-left-menu.is-mobile-open{display:block}
    .pg-menu-stack{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
    .pg-menu-group{border-radius:12px;padding:8px}
    .pg-menu-title,.pg-menu-head{font-size:10px}
    .pg-menu-group a{font-size:10px;padding:7px 8px}
    .pg-content-area{display:grid;gap:10px}
    .pg-card{padding:13px;border-radius:14px;margin:0}
    .pg-intro-card{grid-template-columns:1fr;gap:10px}
    .pg-portrait-card{min-height:130px}
    .pg-portrait-placeholder{min-height:100px}
    .pg-about-text h3,.pg-card-heading h3{font-size:17px}
    .pg-about-text p,.pg-section p,.pg-steps{font-size:12px;line-height:1.5}
    .pg-section-label{font-size:8px}
    .pg-download-list{gap:7px}
    .pg-download-item{padding:10px;border-radius:11px}
    .pg-download-title{font-size:11px}
    .pg-download-desc{font-size:9px}
    .pg-action-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
    .pg-action-btn{min-height:40px;padding:9px;font-size:10px;text-align:center}
    .pg-footer{font-size:9px;padding:10px 12px}
}
@media (max-width:420px){
    .pg-mobile-landing-access{grid-template-columns:repeat(2,minmax(0,1fr))}
    .pg-menu-stack{grid-template-columns:1fr}
    .pg-action-row{grid-template-columns:1fr}
    .pg-header-brand{align-items:flex-start}
    .pg-header-text h1{font-size:21px}
}
@media (max-width:340px){
    .pg-landing-header{padding:9px}
    .pg-header-logo-wrap{width:56px;height:56px;flex-basis:56px}
    .pg-header-logo{width:49px;height:49px}
    .pg-header-text h1{font-size:18px}
    .pg-header-text h2{font-size:11px}
    .pg-mobile-landing-access{padding-left:7px;padding-right:7px;gap:5px}
    .pg-main-layout{padding-left:7px;padding-right:7px}
}
