/* Corporate home first screen. Scoped; honors [hidden]. */
#corporate-hero[hidden],
#standard-hero[hidden] { display: none !important; }

html.corporate-home .landing { padding-top: max(70px, var(--corporate-nav-height, 70px)); }
html.corporate-home .hero-fold { min-height: 0; padding-bottom: 16px; }
/* The marquee follows this content-sized first screen. No spacer or clipping:
   shorter viewports and longer content naturally increase its height. */
html.corporate-home #corporate-hero {
    min-height: calc(100svh - max(70px, var(--corporate-nav-height, 70px)));
    display: flex;
    align-items: center;
}

/* The longer section title must not make the fixed shared header taller
   than page offsets on small laptops. Other presentations are untouched. */
@media (min-width: 769px) and (max-width: 1599px) {
    html.corporate-home .nav {
        grid-template-columns: minmax(0, 1fr) auto auto auto auto;
        row-gap: 8px;
    }
    html.corporate-home .nav .nav-links {
        grid-column: 1 / -1;
        grid-row: 2;
        margin-left: 0;
        position: static;
        transform: none;
        justify-self: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 12px 20px;
    }
    html.corporate-home .nav .nav-right {
        grid-column: 2;
        grid-row: 1;
    }
}
@media (min-width: 769px) and (max-width: 1100px) {
    html.corporate-home .nav { padding-inline: 24px; }
    html.corporate-home .nav .nav-right {
        max-width: calc(100vw - 360px);
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 8px;
    }
}

.corp-hero {
    --corp-magenta: hsl(330, 100%, 45%);
    --corp-magenta-ink: var(--corp-magenta);
    --corp-surface: var(--bg-card);
    --corp-text: #e2e8f0;
    --corp-muted: rgba(255, 255, 255, 0.62);
    --corp-tag-bg: rgba(255, 255, 255, 0.07);
    --corp-icon-bg: rgba(230, 0, 115, 0.16);
    position: relative;
    padding: 16px 0 40px;
}
[data-theme="light"] .corp-hero {
    --corp-magenta-ink: var(--corp-magenta);
    --corp-surface: #ffffff;
    --corp-text: #1a1a2e;
    --corp-muted: rgba(0, 0, 0, 0.66);
    --corp-tag-bg: rgba(0, 0, 0, 0.05);
    --corp-icon-bg: rgba(230, 0, 115, 0.10);
}
.corp-hero .container {
    width: 100%;
    max-width: 1760px;
    padding-inline: clamp(24px, 3vw, 64px);
}

.corp-hero-head { text-align: center; max-width: 720px; margin: 0 auto 40px; }
.corp-hero-badge {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 0.7rem; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
    color: var(--corp-magenta-ink); margin-bottom: 16px; text-align: left;
}
.corp-hero-title {
    font-size: clamp(2.2rem, 5vw, 3.2rem); font-weight: 700; line-height: 1.1;
    letter-spacing: -0.02em; color: var(--corp-text); margin-bottom: 16px;
}
.corp-hero-sub { font-size: 1.05rem; line-height: 1.7; font-weight: 500; color: var(--corp-muted); }
.corp-hero-sub strong { color: var(--corp-text); font-weight: 700; }

.corp-grid {
    display: grid; gap: 16px; align-items: stretch;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
@media (min-width: 1200px) { .corp-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (min-width: 700px) and (max-width: 1199px) {
    .corp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 699px) { .corp-grid { grid-template-columns: 1fr; } .corp-hero { padding-top: 32px; } }

.corp-card {
    display: flex; flex-direction: column; align-items: flex-start;
    padding: 20px 20px 18px; min-height: 100%;
    background: var(--corp-surface); color: var(--corp-text);
    border: 1px solid var(--border); border-top: 3px solid var(--corp-magenta);
    border-radius: 0; transition: border-color 0.2s, background 0.2s;
}
.corp-card:hover { border-color: var(--border-hover); border-top-color: var(--corp-magenta); }
.corp-card:focus-visible { outline: 2px solid var(--corp-magenta-ink); outline-offset: 3px; }

.corp-num { font-size: 0.7rem; font-weight: 700; letter-spacing: 1px; color: var(--corp-muted); margin-bottom: 14px; }
.corp-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; margin-bottom: 18px;
    background: var(--corp-icon-bg); color: var(--corp-magenta-ink);
}
.corp-name { font-size: 1.15rem; font-weight: 700; line-height: 1.25; letter-spacing: -0.01em; margin-bottom: 10px; }
.corp-tag {
    font-size: 0.65rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px;
    padding: 3px 8px; background: var(--corp-tag-bg); color: var(--corp-muted); margin-bottom: 14px;
}
.corp-desc { font-size: 0.85rem; line-height: 1.6; color: var(--corp-muted); margin-bottom: 20px; }
.corp-link {
    margin-top: auto; width: 100%; display: flex; justify-content: space-between; align-items: center;
    padding-top: 14px; border-top: 1px solid var(--border);
    font-size: 0.85rem; font-weight: 700; color: var(--corp-magenta-ink);
}
.corp-arrow { transition: transform 0.2s; }
.corp-card:hover .corp-arrow { transform: translateX(4px); }

/* Emphasis card: My Lessons */
.corp-card--primary { background: var(--corp-magenta); border-color: var(--corp-magenta); color: #fff; }
.corp-card--primary:hover { background: hsl(330, 100%, 38%); border-color: hsl(330, 100%, 38%); }
.corp-card--primary:focus-visible { outline-color: var(--corp-text); }
.corp-card--primary .corp-num,
.corp-card--primary .corp-desc { color: rgba(255, 255, 255, 0.9); }
.corp-card--primary .corp-icon { background: rgba(255, 255, 255, 0.2); color: #fff; }
.corp-card--primary .corp-tag { background: rgba(255, 255, 255, 0.92); color: hsl(330, 100%, 30%); }
.corp-card--primary .corp-link { color: #fff; border-top-color: rgba(255, 255, 255, 0.35); }

@media (prefers-reduced-motion: reduce) { .corp-arrow, .corp-card { transition: none; } }

/* ---- Task 919: articles + sections split ---- */
.corp-hero { --corp-line: var(--border); }
.corp-hero-head { max-width: none; margin: 0 0 36px; text-align: left; display: grid; gap: 16px 32px; align-items: end; grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr); }
/* Move only the heading's visual box; its flow space and everything below stay
   unchanged. The measured lift never consumes the safe gap below the nav. */
html.corporate-home #corporate-hero .corp-hero-head {
    position: relative;
    top: calc(0px - var(--corporate-heading-lift, 0px));
}
.corp-hero-badge { margin-bottom: 8px; line-height: 1.4; }
.corp-hero-title { margin-bottom: 0; }
.corp-accent { color: var(--corp-magenta-ink); }
.corp-hero-sub { font-size: 0.95rem; line-height: 1.6; padding-left: 16px; border-left: 2px solid var(--corp-magenta); margin: 0; }
.corp-client-value[hidden],
.corp-client-value-detail[hidden] { display: none !important; }
html.corporate-home #corporate-hero .corp-client-value:not([hidden]) {
    position: static;
    grid-column: 1 / -1;
    max-width: 1050px;
    margin: 0;
    font-size: 1rem;
    line-height: 1.65;
    font-weight: 400;
    color: var(--corp-magenta-ink);
}
/* Client copy now has its own space. Employee/admin geometry is unchanged. */
html.client-home #corporate-hero .corp-hero-head {
    top: 0;
    row-gap: 16px;
    margin-bottom: 20px;
}
@media (min-width: 1000px) {
    html.client-home #corporate-hero {
        min-height: calc(100svh - max(70px, var(--corporate-nav-height, 70px)) - var(--client-cookie-height, 0px));
        padding-bottom: 16px;
    }
    html.client-home #corporate-hero > .container {
        position: relative;
        top: calc(0px - var(--client-content-lift, 0px));
    }
    html.client-home #corporate-hero .corp-card {
        padding-block: var(--client-card-padding, 14px);
        row-gap: var(--client-card-gap, 8px);
    }
}
@media (max-width: 1199px) {
    .corp-client-value-detail { display: none; }
}
@media (max-width: 389px) {
    html.corporate-home #corporate-hero .corp-client-value:not([hidden]) {
        font-size: 0.875rem;
        line-height: 1.2;
    }
}
.corp-split { display: grid; gap: clamp(40px, 3.5vw, 64px); grid-template-columns: minmax(300px, 3fr) minmax(0, 7fr); align-items: start; }
.corp-col-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 14px; min-height: 22px; }
.corp-col-head h2 { font-size: 0.75rem; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--corp-text); margin: 0; }
.corp-all { font-size: 0.82rem; font-weight: 700; color: var(--corp-magenta-ink); }
.corp-all:hover { text-decoration: underline; }
.corp-grid, .corp-grid[class] { grid-template-columns: 1fr !important; gap: 16px; }
.corp-card {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    grid-template-areas: "icon title action" "icon description description";
    align-items: center;
    gap: 8px 16px;
    padding: 14px 18px;
    min-height: 0;
    border-top: 1px solid var(--border);
    border-left: 3px solid var(--corp-magenta);
}
.corp-card:hover { border-top-color: var(--border-hover); }
.corp-card--primary { border-color: var(--corp-magenta); }
.corp-card--primary:hover { border-color: hsl(330, 100%, 38%); }
.corp-icon { grid-area: icon; margin: 0; flex: none; }
.corp-body { display: contents; }
.corp-titleline { grid-area: title; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.corp-name { margin: 0; }
.corp-tag { margin: 0; }
.corp-desc { grid-area: description; margin: 0; font-size: 0.9rem; line-height: 1.45; max-width: 100ch; }
.corp-link { grid-area: action; margin: 0; width: auto; flex: none; padding: 0; border: 0; gap: 8px; white-space: nowrap; }

.corp-art { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 14px; padding: 18px; background: var(--corp-surface); border: 1px solid var(--border); color: var(--corp-text); }
.corp-art + .corp-art { margin-top: 16px; }
/* Only an overflowing corporate-home list is converted to a bounded column. */
#corporate-hero .corp-articles-body.corp-scroll {
    display: block;
    max-height: var(--corp-scroll-height);
    overflow-y: auto;
    overflow-x: hidden;
    overflow-anchor: none;
    scroll-behavior: auto;
    scrollbar-width: thin;
    scrollbar-gutter: stable;
}
.corp-scroll-set { display: flex; flex-direction: column; gap: 16px; }
.corp-scroll-set > .corp-art { flex: none; margin: 0; }
.corp-scroll-mirror { margin-top: 16px; }
.corp-scroll-mirror .corp-art { font: inherit; text-align: left; width: 100%; cursor: pointer; }
.corp-art--text { grid-template-columns: minmax(0, 1fr); }
.corp-art:hover { border-color: var(--corp-magenta); }
.corp-art:focus-visible { outline: 2px solid var(--corp-magenta-ink); outline-offset: 2px; }
.corp-art-cover { width: 76px; height: 76px; object-fit: cover; background: var(--corp-tag-bg); display: block; }
.corp-art-main { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.corp-art-cat { font-size: 0.65rem; font-weight: 700; letter-spacing: 0.8px; text-transform: uppercase; color: var(--corp-muted); }
.corp-art-title { font-size: 0.95rem; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.corp-art-ex { font-size: 0.8rem; line-height: 1.5; color: var(--corp-muted); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.corp-art-read,.corp-art-views { color: var(--corp-magenta-ink); }
.corp-art-read { font-size: 0.8rem; font-weight: 700; margin-top: 2px; }
.corp-hero .corp-art-ex,.corp-hero .corp-art-read { font-size: 0.875rem; }
.corp-art-read--dated { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; white-space: nowrap; margin-top: auto; padding-top: 2px; }
.corp-art:has(.corp-art-date) { width: 100%; box-sizing: border-box; }
.corp-art-date { flex: none; color: var(--corp-muted); font-size: 0.75rem; font-weight: 400; font-variant-numeric: tabular-nums; }
.corp-art-main:has(.corp-art-date) { container-type: inline-size; }
@container (max-width: 230px) {
    .corp-art .corp-art-read--dated { font-size: 0.6875rem; gap: 6px; }
    .corp-art-date { font-size: inherit; }
}
@container (max-width: 180px) {
    .corp-art-read--dated { letter-spacing: -0.25px; }
}
#corporate-hero .corp-art-ex { -webkit-line-clamp: 3; }
.corp-state { padding: 20px; border: 1px dashed var(--border); color: var(--corp-muted); font-size: 0.88rem; line-height: 1.5; background: var(--corp-surface); }
.corp-state strong { display: block; color: var(--corp-text); margin-bottom: 4px; }
.corp-state--error { border-style: solid; border-left: 3px solid var(--corp-magenta); }
.corp-state button { margin-top: 10px; font: inherit; font-weight: 700; font-size: 0.82rem; padding: 7px 14px; background: transparent; color: var(--corp-magenta-ink); border: 1px solid var(--corp-magenta); cursor: pointer; }
.corp-state button:hover { background: var(--corp-icon-bg); }
.corp-skel { height: 104px; background: var(--corp-tag-bg); margin-bottom: 10px; animation: corpPulse 1.4s ease-in-out infinite; }
@keyframes corpPulse { 50% { opacity: 0.5; } }

/* Keep the useful two-column composition on laptops at normal browser zoom. */
@media (min-width: 1200px) {
    .corp-hero-title { font-size: clamp(2.2rem, 2.8vw, 3.2rem); }
    .corp-hero-title br { display: none; }
}
html.corporate-home .proof-marquee-label-standalone { padding-top: 12px; }
html.corporate-home .proof-marquee-label-standalone .section-label { margin-bottom: 0; }
html.corporate-home .proof-marquee-section { padding: 12px 0 16px; }
html.corporate-home .proof-marquee-card { max-width: 440px; padding-block: 12px; }
@media (min-width: 1000px) and (max-width: 1199px) {
    .corp-split { grid-template-columns: minmax(280px, 3fr) minmax(0, 7fr); gap: 32px; }
    .corp-hero-head { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 20px; }
    .corp-card { grid-template-areas: "icon title title" "icon description description" "icon action action"; }
    .corp-link { justify-self: start; margin-top: 4px; }
}
@media (max-width: 999px) {
    .corp-hero-head { grid-template-columns: 1fr; }
    .corp-split { grid-template-columns: 1fr; gap: 32px; }
    .corp-articles-body { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }
    .corp-articles-body > .corp-art + .corp-art { margin-top: 0; }
    .corp-articles-body > .corp-state { grid-column: 1 / -1; }
}
@media (max-width: 599px) {
    .corp-hero .container { padding-inline: 16px; }
    .corp-card { grid-template-columns: 38px minmax(0, 1fr); grid-template-areas: "icon title" "description description" "action action"; padding: 14px; gap: 10px 12px; }
    .corp-icon { width: 38px; height: 38px; }
    .corp-link { justify-self: start; }
    .corp-articles-body { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .corp-skel { animation: none; } }

.corp-art{position:relative}
.corp-art-views{position:absolute;top:10px;right:12px;display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:999px;font-size:.75rem;font-weight:700;line-height:1.4;background:var(--corp-surface);border:1px solid var(--border);pointer-events:none}
.corp-art-views svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.corp-art .corp-art-main{padding-right:0}
.corp-art-cat,.corp-art-titleline{max-width:calc(100% - 64px)}