/* =====================================================================
   PE Group of Institutions: LEGAL PAGES ONLY styles
   Used by the privacy policy and terms & conditions pages.
   Reuses the colour tokens from pe-header.css, with fallbacks.
   ===================================================================== */

.pl-head, .pl-body {
    --pl-forest: var(--pe-forest, #17392c);
    --pl-green: var(--pe-green, #2f6b4f);
    --pl-sage-50: var(--pe-sage-50, #f3f6f0);
    --pl-sage-100: var(--pe-sage-100, #e5ebe0);
    --pl-mustard: var(--pe-mustard, #d9a036);
    --pl-ink: var(--pe-ink, #1c2521);
    --pl-muted: var(--pe-muted, #5b675f);
    --pl-line: #dfe4dd;

    color: var(--pl-ink);
    font-family: var(--pe-font-ui, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
}
.pl-head *, .pl-body *,
.pl-head *::before, .pl-body *::before { box-sizing: border-box; }
.pl-head ol, .pl-body ol, .pl-body ul { margin: 0; padding: 0; list-style: none; }
.pl-body :focus-visible { outline: 2px solid var(--pl-forest); outline-offset: 3px; }
.pl-head :focus-visible { outline: 2px solid var(--pl-mustard); outline-offset: 3px; }

/* =====================================================================
   Page header
   ===================================================================== */
.pl-head {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding-block: clamp(28px, 3.5vw, 48px) clamp(32px, 4vw, 56px);
    background: var(--pl-forest);
    color: #cfdac9;
}
.pl-head::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(46% 70% at 82% 18%, rgba(124, 140, 107, .4), transparent 70%),
        radial-gradient(rgba(255, 255, 255, .07) 1px, transparent 1.5px) 0 0 / 22px 22px;
}
.pl-head::after {
    content: "";
    position: absolute;
    right: -3%;
    bottom: -58%;
    z-index: -1;
    width: min(28%, 300px);
    aspect-ratio: 4 / 5;
    border: 26px solid rgba(255, 255, 255, .07);
    border-radius: 50% 50% 0 0 / 40% 40% 0 0;
    pointer-events: none;
}
.pl-crumbs { margin-bottom: clamp(14px, 2vw, 22px); font-size: .875rem; }
.pl-crumbs ol { display: flex; flex-wrap: wrap; gap: 8px; }
.pl-crumbs li + li::before { content: "/"; margin-right: 8px; color: rgba(255, 255, 255, .4); }
.pl-crumbs a { color: #cfdac9; text-decoration: none; }
.pl-crumbs a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.pl-crumbs li[aria-current] { color: var(--pl-mustard); font-weight: 600; }
.pl-head__title {
    margin: 0 0 12px;
    color: #fff;
    font-family: var(--pe-font-display, Georgia, "Times New Roman", serif);
    font-size: clamp(1.875rem, 1.2rem + 2.4vw, 3rem);
    font-weight: 400;
    line-height: 1.1;
}
.pl-head__lead {
    max-width: 46rem;
    margin: 0 0 16px;
    font-size: clamp(1rem, .95rem + .3vw, 1.125rem);
    line-height: 1.65;
}
.pl-head__date {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 8px 16px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
    font-size: .875rem;
    font-weight: 600;
}
.pl-head__date i { color: var(--pl-mustard); }

/* =====================================================================
   Layout
   ===================================================================== */
.pl-body { padding-block: clamp(32px, 4.5vw, 60px); }
.pl-body__grid {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 2fr);
    align-items: start;
    gap: clamp(24px, 4vw, 56px);
}

/* ---------- Contents ---------- */
.pl-toc { position: sticky; top: 100px; }
.pl-toc__box {
    padding: 20px 22px 22px;
    border: 1.5px solid var(--pl-line);
    border-radius: 18px;
    background: var(--pl-sage-50);
}
.pl-toc__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: var(--pl-forest);
    font-size: 1rem;
    font-weight: 700;
    list-style: none;
    cursor: pointer;
}
.pl-toc__summary::-webkit-details-marker { display: none; }
.pl-toc__summary i { transition: transform .25s; }
.pl-toc__box[open] .pl-toc__summary i { transform: rotate(180deg); }
.pl-toc__list {
    display: grid;
    gap: 2px;
    margin-top: 14px;
}
.pl-toc__list a {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 10px;
    color: var(--pl-muted);
    font-size: .9375rem;
    line-height: 1.45;
    text-decoration: none;
    transition: background-color .2s, color .2s;
}
.pl-toc__list a:hover { background: #fff; color: var(--pl-forest); }
.pl-toc__num {
    flex: none;
    min-width: 20px;
    color: var(--pl-mustard);
    font-weight: 700;
}

/* ---------- Document ---------- */
.pl-doc { min-width: 0; }
.pl-sec {
    scroll-margin-top: 110px;        /* clears the sticky header when jumping */
    padding-bottom: clamp(24px, 3vw, 34px);
}
.pl-sec + .pl-sec {
    padding-top: clamp(24px, 3vw, 34px);
    border-top: 1px solid var(--pl-line);
}
.pl-sec__title {
    display: flex;
    align-items: baseline;
    gap: 14px;
    margin: 0 0 14px;
    color: var(--pl-forest);
    font-family: var(--pe-font-display, Georgia, "Times New Roman", serif);
    font-size: clamp(1.375rem, 1.15rem + 1vw, 1.875rem);
    font-weight: 400;
    line-height: 1.2;
}
.pl-sec__num {
    display: grid;
    flex: none;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--pl-sage-100);
    color: var(--pl-forest);
    font-family: var(--pe-font-ui, system-ui, sans-serif);
    font-size: .9375rem;
    font-weight: 700;
}
.pl-sec p {
    max-width: 68ch;
    margin: 0 0 14px;
    color: var(--pl-muted);
    font-size: 1.0625rem;
    line-height: 1.75;
}
.pl-sec p:last-child { margin-bottom: 0; }
.pl-sec__list {
    display: grid;
    gap: 10px;
    max-width: 68ch;
    margin: 0 !important;
}
.pl-sec__list li {
    position: relative;
    padding-left: 26px;
    color: var(--pl-muted);
    font-size: 1.0625rem;
    line-height: 1.7;
}
.pl-sec__list li::before {
    content: "";
    position: absolute;
    top: .65em;
    left: 6px;
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: var(--pl-mustard);
    transform: rotate(45deg);
}

.pl-top { margin: 8px 0 0; }
.pl-top a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--pl-forest);
    font-size: .9375rem;
    font-weight: 700;
    text-decoration: none;
}
.pl-top a:hover { text-decoration: underline; text-decoration-color: var(--pl-mustard); text-underline-offset: 4px; }

/* =====================================================================
   Responsive
   ===================================================================== */
@media (max-width: 991.98px) {
    .pl-body__grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    .pl-toc { position: static; }
    /* the contents list starts closed on small screens: one tap to open */
    .pl-toc__box:not([open]) .pl-toc__list { display: none; }
}
@media (max-width: 575.98px) {
    .pl-toc__box { padding: 16px 16px 18px; }
    .pl-sec__title { gap: 10px; font-size: 1.25rem; }
    .pl-sec__num { width: 30px; height: 30px; font-size: .875rem; }
    .pl-sec p, .pl-sec__list li { font-size: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
    .pl-toc__summary i, .pl-toc__list a { transition-duration: .01ms !important; }
}
