:root {
  --ink: #102946;
  --ink-soft: #27415c;
  --leaf: #8bc34a;
  --leaf-deep: #5d9335;
  --mist: #edf5f3;
  --sand: #f7f3eb;
  --cream: #fffdf8;
  --white: #ffffff;
  --line: rgba(16, 41, 70, .13);
  --muted: #6d7d8b;
  --shadow: 0 24px 65px rgba(16, 41, 70, .12);
  --shadow-soft: 0 10px 30px rgba(16, 41, 70, .08);
  --radius: 22px;
  --serif: "Fraunces", Georgia, serif;
  --sans: "DM Sans", Arial, sans-serif;
  --mono: "Space Mono", "Courier New", monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--cream);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  padding: 0;
  min-height: 100%;
}
body.dark {
  --ink: #f0f5f2;
  --ink-soft: #c0d0d1;
  --mist: #142d40;
  --sand: #1c2730;
  --cream: #0c1c2b;
  --white: #152d40;
  --line: rgba(235, 245, 242, .16);
  --muted: #a8b6ba;
  --shadow: 0 24px 65px rgba(0, 0, 0, .3);
  --shadow-soft: 0 10px 30px rgba(0, 0, 0, .24);
}
body, button, input, select, textarea { font-family: var(--sans); }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
img { max-width: 100%; display: block; }

.container { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
/* .topbar {
  position: sticky; top: 0; z-index: 20; min-height: 78px;
  background: color-mix(in srgb, var(--cream) 90%, transparent);
  border-bottom: 1px solid var(--line); backdrop-filter: blur(18px);
} */
 .topbar {
    position: sticky;
    top: 0;
    z-index: 9999;
    width: 100%;
    min-height: 78px;

    background: color-mix(
        in srgb,
        var(--cream) 90%,
        transparent
    );

    border-bottom: 1px solid var(--line);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}
.nav { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.brand img { width: 112px; height: auto; }
.nav-links { display: flex; align-items: center; gap: 30px; font-size: 13px; font-weight: 700; color: var(--ink-soft); }
.nav-links a { position: relative; padding-block: 7px; }
.nav-links a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 2px; background: var(--leaf); transition: right .25s ease; }
.nav-links a:hover::after, .nav-links a.active::after { right: 0; }
.nav-links a.active { color: var(--ink); }
.nav-actions { display: flex; align-items: center; gap: 9px; }
.icon-btn, .ghost-btn, .primary-btn, .lime-btn, .text-btn, .chip {
  border: 0; background: transparent; color: inherit; font-weight: 700; transition: transform .2s ease, background .2s ease, border-color .2s ease, color .2s ease;
}
.icon-btn { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 50%; }
.icon-btn:hover, .ghost-btn:hover, .chip:hover { transform: translateY(-2px); background: var(--mist); }
.ghost-btn, .primary-btn, .lime-btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; border-radius: 99px; padding: 12px 19px; font-size: 13px; }
.ghost-btn { border: 1px solid var(--line); }
.primary-btn { color: var(--white); background: var(--ink); box-shadow: 0 11px 22px rgba(16, 41, 70, .16); }
.primary-btn:hover { transform: translateY(-2px); box-shadow: 0 15px 28px rgba(16, 41, 70, .22); }
.lime-btn { color: var(--ink); background: var(--leaf); }
.lime-btn:hover { transform: translateY(-2px); filter: saturate(1.1); }
.text-btn { display: inline-flex; align-items: center; gap: 8px; padding: 4px 0; }
.text-btn:hover { color: var(--leaf-deep); transform: translateX(2px); }
.mobile-menu { display: none; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; color: var(--leaf-deep); font: 700 11px var(--mono); text-transform: uppercase; letter-spacing: .12em; }
.eyebrow::before { content: ""; width: 26px; height: 2px; background: var(--leaf); }
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2 { font-family: var(--serif); font-weight: 400; letter-spacing: -.04em; line-height: .98; }
h1 { font-size: clamp(3.8rem, 7.5vw, 6.8rem); margin: 22px 0 22px; max-width: 760px; }
h1 em { color: var(--leaf-deep); font-style: normal; }
h2 { font-size: clamp(2.55rem, 5vw, 4.55rem); margin: 18px 0; }
h3 { line-height: 1.15; }
.muted { color: var(--muted); }
.mono { font-family: var(--mono); font-size: 11px; }
.hero { background: var(--mist); overflow: hidden; }
.hero-grid { min-height: 600px; display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 40px; padding-block: 72px 62px; }
.hero-copy { max-width: 580px; color: var(--ink-soft); font-size: 17px; line-height: 1.75; }
.hero-ctas { display: flex; gap: 12px; margin-top: 30px; }
.trust-note { display: flex; align-items: center; gap: 14px; margin-top: 32px; color: var(--ink-soft); font-size: 12px; }
.trust-dots { display: flex; }
.trust-dots span { display: grid; place-items: center; width: 25px; height: 25px; margin-left: -4px; border: 2px solid var(--mist); border-radius: 50%; background: #e7bd9c; color: var(--ink); font-size: 8px; }
.trust-dots span:nth-child(2) { background: #c3d9e4; }.trust-dots span:nth-child(3) { background: #e9c7bf; }.trust-dots span:nth-child(4) { background: var(--leaf); }
.hero-art { position: relative; min-height: 460px; display: grid; place-items: center; }
.art-ring { position: absolute; width: 420px; height: 420px; border: 1px solid rgba(93, 147, 53, .22); border-radius: 50%; box-shadow: 0 0 0 32px rgba(139,195,74,.06), 0 0 0 64px rgba(139,195,74,.07); }
.hero-card { position: relative; z-index: 1; width: min(365px, 86%); padding: 28px; border: 1px solid rgba(255,255,255,.75); border-radius: 24px; background: var(--cream); box-shadow: var(--shadow); animation: float 5s ease-in-out infinite; }
.hero-card-top, .job-top, .job-bottom, .modal-header, .form-row, .employer-card-row, .footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.mini-logo, .company-mark { display: grid; place-items: center; flex: 0 0 auto; width: 48px; height: 48px; border-radius: 14px; background: var(--ink); color: var(--leaf); font: 700 22px var(--serif); }
.status-pill, .job-chip { border-radius: 99px; padding: 5px 9px; color: var(--leaf-deep); background: #e6f1d7; font-size: 10px; font-weight: 700; }
.hero-card h3 { margin: 33px 0 5px; font-size: 22px; font-weight: 500; }
.company, .job-company { color: var(--muted); font-size: 12px; }
.hero-card-meta, .job-meta, .detail-meta { display: flex; flex-wrap: wrap; gap: 14px; color: var(--muted); font-size: 11px; }
.hero-card-meta { margin-top: 25px; }
.hero-card-meta span, .job-meta span, .detail-meta span { display: inline-flex; align-items: center; gap: 5px; }
.salary-line { display: flex; justify-content: space-between; align-items: center; margin-top: 25px; padding-top: 18px; border-top: 1px solid var(--line); font-family: var(--mono); font-size: 12px; }
.salary-line small { color: var(--muted); }
.float-tag { position: absolute; z-index: 2; padding: 11px 14px; border-radius: 14px; background: var(--ink); color: white; box-shadow: var(--shadow-soft); font: 10px var(--mono); }
.float-tag strong { display: block; color: white; font: 700 17px var(--serif); }.float-tag.one { top: 86px; left: 4%; }.float-tag.two { right: 0; bottom: 84px; background: var(--leaf); color: var(--ink); }.float-tag.two strong { color: var(--ink); }
.search-wrap { position: relative; z-index: 3; margin-top: -25px; }
.search-panel { display: grid; grid-template-columns: 1.25fr 1fr 1fr auto; gap: 6px; padding: 10px; border: 1px solid var(--line); border-radius: 18px; background: var(--cream); box-shadow: var(--shadow-soft); }
.field, .input-label { display: flex; flex-direction: column; gap: 7px; color: var(--muted); font-size: 11px; font-weight: 700; }
.field { flex-direction: row; align-items: center; padding: 13px 14px; border-radius: 12px; background: var(--mist); }
.field input, .field select { width: 100%; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 13px; }
.search-panel .primary-btn { border-radius: 12px; padding-inline: 20px; }
.search-summary { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; font-size: 12px; }
.marquee-shell { overflow: hidden; border-bottom: 1px solid var(--line); }
.marquee-label { padding: 27px 20px 10px; text-align: center; color: var(--muted); font: 10px var(--mono); text-transform: uppercase; letter-spacing: .12em; }
.marquee { display: flex; justify-content: space-around; min-width: 900px; padding: 5px 0 26px; color: #8b969c; font: 700 17px var(--serif); text-transform: lowercase; animation: marquee 25s linear infinite; }
.marquee i { color: var(--leaf); font-style: normal; }
.section { padding: 112px 0; }
.section-tint { background: var(--mist); }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 36px; margin-bottom: 42px; }
.section-head p { max-width: 365px; color: var(--muted); line-height: 1.8; }
.category-row { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { padding: 8px 14px; border: 1px solid var(--line); border-radius: 99px; color: var(--muted); font-size: 12px; }
.chip.active { color: var(--ink); border-color: var(--leaf); background: #e8f3dc; }
.jobs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.job-card { padding: 23px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--cream); box-shadow: 0 2px 0 transparent; transition: transform .25s ease, box-shadow .25s ease; }
.job-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-soft); }
.job-card.featured { border-color: rgba(139,195,74,.55); background: linear-gradient(145deg, var(--cream), #f3f8eb); }
.job-card h3 { margin: 24px 0 3px; font-size: 19px; font-weight: 500; }
.job-card .job-meta { margin-top: 22px; }
.job-bottom { margin-top: 25px; padding-top: 17px; border-top: 1px solid var(--line); font: 700 11px var(--mono); }
.bookmark { display: grid; place-items: center; width: 33px; height: 33px; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); background: transparent; }
.bookmark.saved { color: var(--leaf-deep); background: #e8f3dc; border-color: var(--leaf); }
.empty-state { grid-column: 1 / -1; padding: 60px 20px; text-align: center; color: var(--muted); }
.empty-state h3 { color: var(--ink); }
.split-section { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 90px; }
.split-section p { max-width: 500px; color: var(--muted); line-height: 1.8; }
.proof-list { margin: 32px 0 27px; }
.proof-item { display: flex; gap: 13px; margin: 16px 0; font-size: 13px; }
.proof-icon { display: grid; place-items: center; flex: 0 0 auto; width: 28px; height: 28px; border-radius: 9px; color: var(--leaf-deep); background: #e3f0d4; }
.stats-board { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.stat-tile { min-height: 155px; padding: 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--cream); }
.stat-tile.wide { grid-column: 1 / -1; background: var(--ink); color: white; }
.stat-tile span { display: block; color: var(--muted); font-size: 11px; }.stat-tile.wide span { color: #b8cccf; }
.stat-tile strong { display: block; margin: 15px 0 3px; font: 400 43px var(--serif); }.stat-tile.wide strong { color: var(--leaf); }
.category-grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 13px; }
.category-card { position: relative; min-height: 210px; padding: 24px; text-align: left; border: 1px solid var(--line); border-radius: 20px; color: var(--ink); background: var(--sand); overflow: hidden; transition: transform .25s ease, box-shadow .25s ease; }
.category-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-soft); }.category-card.large { grid-row: span 2; min-height: 433px; background: #e8f1de; }
.category-card svg:first-child { margin: 7px 0 25px; color: var(--leaf-deep); opacity: .8; }.category-card h3 { margin-bottom: 5px; font-weight: 500; }.category-card p { max-width: 230px; color: var(--muted); font-size: 12px; }.category-card > svg:last-child { position: absolute; right: 22px; bottom: 22px; }
.timeline { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); }.step { padding: 25px 22px 0 0; border-right: 1px solid var(--line); }.step + .step { padding-left: 22px; }.step:last-child { border-right: 0; }.step-num { margin-bottom: 35px; color: var(--leaf-deep); font: 12px var(--mono); }.step h3 { font-weight: 500; }.step p { color: var(--muted); font-size: 13px; }
.quote-section { background: var(--sand); }.quote-grid { display: grid; grid-template-columns: .65fr 1.35fr; align-items: center; gap: 90px; }.rating-number { display: block; margin: 20px 0 0; font: 75px var(--serif); }.stars { color: var(--leaf-deep); letter-spacing: 4px; }.rating small { display: block; margin-top: 12px; color: var(--muted); font-size: 11px; }.quote { max-width: 690px; font: 400 clamp(2rem, 4vw, 3.7rem) var(--serif); line-height: 1.08; letter-spacing: -.04em; }.quote-by { display: flex; align-items: center; gap: 13px; font-size: 12px; }.quote-avatar { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; color: var(--ink); background: var(--leaf); }
.resources { display: grid; grid-template-columns: 1.1fr .9fr; gap: 14px; }.resource-feature { min-height: 310px; padding: 34px; border-radius: 22px; color: white; background: var(--ink); }.resource-feature h3 { max-width: 530px; margin: 42px 0 14px; font: 400 clamp(2rem, 4vw, 3.1rem) var(--serif); line-height: 1; }.resource-feature p { max-width: 400px; color: #b8cccf; }.resource-feature .text-btn { color: var(--leaf); }.resource-stack { display: grid; gap: 10px; }.resource-card { display: flex; justify-content: space-between; align-items: center; padding: 22px; border: 1px solid var(--line); border-radius: 17px; background: var(--sand); }.resource-card h3 { margin-bottom: 6px; font-size: 16px; font-weight: 500; }.resource-card p { margin: 0; color: var(--muted); font-size: 12px; }.resource-card > svg { flex: 0 0 auto; color: var(--leaf-deep); }
.employer { padding: 92px 0; color: white; background: var(--ink); }.employer-grid { display: grid; grid-template-columns: 1fr .8fr; align-items: center; gap: 90px; }.employer h2 { max-width: 620px; color: white; }.employer p { max-width: 550px; color: #b8cccf; line-height: 1.8; }.employer .eyebrow { color: var(--leaf); }.employer-card { padding: 30px; border: 1px solid rgba(255,255,255,.12); border-radius: 20px; background: rgba(255,255,255,.06); }.employer-card h3 { margin-bottom: 22px; font: 400 25px var(--serif); }.employer-card-row { padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.12); color: #4d4f4f; font-size: 12px; }.employer-card-row:last-of-type { border-bottom: 0; }.employer-card-row strong { color: rgb(72, 70, 70); }
.newsletter { padding: 65px 0; background: var(--sand); }.newsletter-box { display: flex; align-items: center; justify-content: space-between; gap: 35px; }.newsletter h2 { font-size: 42px; }.newsletter p { color: var(--muted); }.subscribe { display: flex; gap: 6px; padding: 6px; border: 1px solid var(--line); border-radius: 99px; background: var(--cream); }.subscribe input { min-width: 240px; padding: 11px 15px; border: 0; outline: 0; color: var(--ink); background: transparent; }
.footer { padding: 65px 0 20px; background: var(--ink); color: white; }.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 60px; }.footer .brand img { width: 118px; background: white; border-radius: 5px; padding: 3px; }.footer p, .footer a { display: block; color: #b8cccf; font-size: 12px; }.footer h4 { margin: 5px 0 14px; font-size: 12px; color: white; }.footer a { margin: 10px 0; }.footer a:hover { color: var(--leaf); }.footer-bottom { padding-top: 20px; border-top: 1px solid rgba(255,255,255,.14); color: #8fa4a9; font: 10px var(--mono); }
.page-hero { padding: 92px 0 72px; background: var(--mist); }.page-hero h1 { max-width: 850px; font-size: clamp(3.4rem, 7vw, 6rem); }.page-hero p { max-width: 610px; color: var(--muted); font-size: 17px; line-height: 1.8; }
.story-grid, .contact-grid, .team-grid, .blog-layout, .admin-layout { display: grid; gap: 22px; }.story-grid { grid-template-columns: 1.1fr .9fr; align-items: start; }.story-card, .contact-card, .team-card, .article-card, .sidebar-card { padding: 26px; border: 1px solid var(--line); border-radius: 20px; background: var(--cream); }.story-card h3, .contact-card h3, .team-card h3 { font: 400 28px var(--serif); }.story-card p, .contact-card p, .team-card p, .article-card p, .sidebar-card p { color: var(--muted); line-height: 1.8; }.value-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }.value-grid .story-card { min-height: 180px; }.timeline-list { border-left: 1px solid var(--leaf); padding-left: 24px; }.timeline-list article { position: relative; margin-bottom: 28px; }.timeline-list article::before { content: ""; position: absolute; left: -30px; top: 7px; width: 10px; height: 10px; border-radius: 50%; background: var(--leaf); }
.team-grid { grid-template-columns: repeat(2, 1fr); }.team-card {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 22px;
    padding: 26px;
    border: 1px solid var(--line);
    border-radius: 20px;
}

/* Mobile */
@media (max-width: 768px) {
    .team-card {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .photo-placeholder {
        width: 100%;
        height: 280px;
    }
}.photo-placeholder {
    width: 100%;
    height: 145px;
    border-radius: 16px;
    overflow: hidden;
    background: var(--ink);
}.team-links { display: flex; gap: 14px; color: var(--leaf-deep); font-size: 12px; }
.contact-grid { grid-template-columns: .8fr 1.2fr; align-items: start; }.contact-details { display: grid; gap: 12px; }.contact-card strong { display: block; margin-bottom: 3px; }.map-placeholder { min-height: 190px; display: grid; place-items: center; border-radius: 17px; color: var(--muted); background: repeating-linear-gradient(45deg, var(--mist), var(--mist) 10px, var(--sand) 10px, var(--sand) 20px); }.faq details { padding: 16px 0; border-bottom: 1px solid var(--line); }.faq summary { cursor: pointer; font-weight: 700; }
.blog-layout { grid-template-columns: 1fr 300px; }.article-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; }.article-card.featured { grid-column: 1 / -1; min-height: 250px; color: white; background: var(--ink); }.article-card.featured p { color: #b8cccf; }.article-card h3 { margin: 12px 0; font: 400 29px var(--serif); }.article-card .eyebrow { font-size: 10px; }.blog-search { width: 100%; padding: 13px 15px; border: 1px solid var(--line); border-radius: 12px; outline: 0; color: var(--ink); background: var(--mist); }.sidebar-card + .sidebar-card { margin-top: 14px; }.sidebar-card ul { padding-left: 18px; color: var(--muted); font-size: 13px; }.pagination { display: flex; justify-content: center; gap: 8px; margin-top: 28px; }
.modal-backdrop { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; padding: 20px; background: rgba(7, 20, 32, .65); backdrop-filter: blur(7px); }.modal { width: min(620px, 100%); max-height: min(820px, 92vh); overflow: auto; padding: 30px; border: 1px solid var(--line); border-radius: 23px; background: var(--cream); box-shadow: var(--shadow); animation: modal-in .25s ease both; }.modal.wide { width: min(940px, 100%); }.close-btn { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 50%; color: var(--ink); background: transparent; }.modal h2 { font-size: 39px; }.modal-header { align-items: start; margin-bottom: 22px; }.detail-meta { margin-top: 10px; }.apply-form, .inquiry-form, .admin-form { display: grid; gap: 16px; }.form-row { align-items: start; }.input-label input, .input-label select, .input-label textarea { width: 100%; padding: 12px 13px; border: 1px solid var(--line); border-radius: 10px; outline: 0; color: var(--ink); background: var(--mist); }.input-label textarea { min-height: 105px; resize: vertical; }.input-label input:focus, .input-label select:focus, .input-label textarea:focus, .blog-search:focus { border-color: var(--leaf-deep); box-shadow: 0 0 0 3px rgba(139,195,74,.17); }.modal-actions { display: flex; justify-content: end; gap: 8px; margin-top: 5px; }.success-state { padding: 24px 4px; text-align: center; }.success-icon { display: grid; place-items: center; width: 54px; height: 54px; margin: 0 auto 20px; border-radius: 50%; color: var(--ink); background: var(--leaf); }
.poster-layout { display: grid; grid-template-columns: 1fr 240px; align-items: start; gap: 25px; }.poster-preview { width: 100%; border-radius: 14px; background: var(--ink); }.poster-controls { display: grid; gap: 16px; }.poster-note { padding: 13px; border-radius: 12px; color: var(--muted); background: var(--mist); font-size: 12px; }
.admin-body { background: var(--mist); }.admin-layout { grid-template-columns: 220px 1fr; min-height: calc(100vh - 78px); }.admin-sidebar { padding: 28px 15px; background: var(--ink); color: white; }.admin-sidebar .brand img { width: 125px; padding: 3px; background: white; border-radius: 4px; }.admin-sidebar nav { display: grid; gap: 5px; margin-top: 45px; }.admin-sidebar nav a { padding: 10px 12px; border-radius: 9px; color: #b8cccf; font-size: 12px; }.admin-sidebar nav a:hover, .admin-sidebar nav a.active { color: var(--ink); background: var(--leaf); }.admin-main { padding: 35px; }.admin-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 28px; }.admin-heading h1 { margin: 0; font-size: 53px; }.admin-cards { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-bottom: 25px; }.admin-stat { padding: 19px; border: 1px solid var(--line); border-radius: 15px; background: var(--cream); }.admin-stat span { color: var(--muted); font-size: 11px; }.admin-stat strong { display: block; margin-top: 10px; font: 36px var(--serif); }.admin-panel { padding: 22px; border: 1px solid var(--line); border-radius: 17px; background: var(--cream); }.admin-panel h2 { margin: 0 0 18px; font: 400 28px var(--serif); }.admin-table { width: 100%; border-collapse: collapse; font-size: 12px; }.admin-table th { color: var(--muted); text-align: left; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }.admin-table th, .admin-table td { padding: 13px 8px; border-bottom: 1px solid var(--line); }.status { display: inline-block; padding: 4px 8px; border-radius: 99px; color: var(--leaf-deep); background: #e8f3dc; font-size: 10px; }.table-actions { display: flex; gap: 7px; }.table-actions button { padding: 4px 7px; border: 0; border-radius: 6px; color: var(--ink); background: var(--mist); font-size: 10px; }.table-actions button:hover { background: var(--leaf); }.chart-row { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; }.chart { width: 100%; min-height: 240px; }
.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 25px; background: radial-gradient(circle at 12% 15%, rgba(139,195,74,.25), transparent 32%), var(--mist); }.login-card { width: min(430px,100%); padding: 38px; border: 1px solid var(--line); border-radius: 24px; background: color-mix(in srgb, var(--cream) 82%, transparent); box-shadow: var(--shadow); backdrop-filter: blur(18px); }.login-card .brand { display: inline-block; margin-bottom: 27px; }.login-card h1 { margin: 0 0 10px; font-size: 43px; }.login-card p { color: var(--muted); font-size: 13px; }.login-card form { display: grid; gap: 16px; margin-top: 28px; }.login-card .primary-btn { width: 100%; }

@media (max-width: 900px) {
  .nav-links { gap: 16px; }.hero-grid, .split-section, .story-grid, .contact-grid, .employer-grid { grid-template-columns: 1fr; gap: 45px; }.hero-art { min-height: 410px; }.jobs-grid { grid-template-columns: repeat(2, 1fr); }.category-grid { grid-template-columns: 1fr 1fr; }.category-card.large { grid-row: auto; min-height: 250px; }.resources, .quote-grid, .blog-layout { grid-template-columns: 1fr; }.value-grid { grid-template-columns: repeat(2,1fr); }.admin-cards { grid-template-columns: repeat(2,1fr); }
}

.team-card {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 22px;
    padding: 26px;
    border: 1px solid var(--line);
    border-radius: 20px;
}

.photo-placeholder {
    width: 100%;
    height: 145px;
    border-radius: 16px;
    overflow: hidden;
    background: var(--ink);
}

.photo-placeholder img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

.team-card h3 {
    font: 400 28px var(--serif);
}

.team-card p {
    color: var(--muted);
    line-height: 1.8;
}

/* MOBILE */
@media (max-width: 768px) {
    .team-card {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .photo-placeholder {
        width: 100%;
        height: 280px;
    }
}

@media (max-width: 768px) {
    .team-card {
        grid-template-columns: 1fr;
    }

    .photo-placeholder {
        width: fit-content;
        height: auto;
        margin: 0 auto;
        background: transparent;
        border-radius: 16px;
        overflow: hidden;
    }

    .photo-placeholder img {
        display: block;
        width: auto;
        height: auto;
        max-width: 100%;
        max-height: 280px;
        border-radius: 16px;
        object-fit: contain;
    }
}