/* Department of Chemistry · shared styles for the redesigned content pages.
   Everything is scoped under .dp, so the master page and the rest of the site are not affected.
   Accent: the department's blue (#2386FF) from its header band; a deeper shade carries text for contrast. */
.dp{--acc:#0b63d1;--acc-soft:#e6f0ff;--navy:#0b1e34;--muted:#55667a;--paper:#f5f8fc;color:var(--navy);font-size:17px;line-height:1.7;margin:8px 0 56px}
.dp *{box-sizing:border-box}
.dp h1{margin:0;font-size:clamp(28px,4vw,40px);font-weight:800;letter-spacing:-.02em;line-height:1.1;color:var(--navy)}
.dp h2{margin:0 0 14px;font-size:clamp(21px,2.3vw,27px);font-weight:800;letter-spacing:-.01em;line-height:1.25;color:var(--navy)}
.dp h3{margin:0;font-size:19px;font-weight:800;line-height:1.3;color:var(--navy)}
.dp p{margin:0 0 16px}
.dp a{color:var(--acc)}
.dp-lead{max-width:66ch;margin-top:16px!important;font-size:clamp(18px,1.6vw,21px);line-height:1.6}
.dp-muted{color:var(--muted)}

/* Figures row */
.dp-stats{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 0;padding:0;list-style:none}
.dp-stats li{background:var(--paper);border-radius:16px;padding:14px 20px;min-width:130px}
.dp-stats b{display:block;font-size:28px;line-height:1;font-weight:800;color:var(--acc)}
.dp-stats span{font-size:14px;color:var(--muted)}

/* Cards and grids */
.dp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin:32px 0 0;padding:0;list-style:none}
.dp-card{background:var(--paper);border-radius:20px;padding:22px 22px 20px;transition:transform .25s}
.dp-card:hover{transform:translateY(-3px)}
.dp-card p:last-child{margin-bottom:0}
.dp-ring{display:block;width:18px;height:18px;border-radius:50%;border:5px solid var(--acc);margin-bottom:14px}
.dp-tag{display:inline-block;font-size:13px;font-weight:700;color:var(--acc);background:var(--acc-soft);border-radius:999px;padding:3px 12px}

/* Link tiles (PDF archives) */
.dp-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin:28px 0 0;padding:0;list-style:none}
.dp-tiles a{display:flex;flex-direction:column;gap:6px;height:100%;padding:18px 18px 16px;border-radius:18px;background:var(--paper);color:var(--navy);text-decoration:none;transition:background .2s,transform .25s}
.dp-tiles a:hover{background:var(--acc-soft);transform:translateY(-2px)}
.dp-tiles b{font-size:22px;line-height:1.1;font-weight:800}
.dp-tiles span{font-size:14px;color:var(--muted)}
.dp-tiles i{font-style:normal;font-size:13px;font-weight:700;color:var(--acc)}

/* People chips */
.dp-people{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0;padding:0;list-style:none}
.dp-people li{padding:6px 14px;border-radius:999px;background:#fff;font-size:15px}
.dp-people li.head{background:var(--acc);color:#fff;font-weight:700}

/* Message from the Head */
.dp-msg{display:grid;grid-template-columns:minmax(200px,280px) 1fr;gap:clamp(24px,4vw,56px);align-items:start;margin-top:28px;background:var(--paper);border-radius:24px;padding:clamp(20px,4vw,44px)}
.dp-msg figure{margin:0;position:sticky;top:24px}
.dp-msg figure img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:top;border-radius:18px;background:#e7e4ee}
.dp-msg figcaption{margin-top:14px;line-height:1.4}
.dp-msg figcaption b{display:block;font-size:18px}
.dp-msg figcaption span{color:var(--muted);font-size:15px}
.dp-msg .text{max-width:64ch}
.dp-quote{position:relative;margin:0 0 22px!important;padding-left:22px;font-size:clamp(19px,1.8vw,22px);line-height:1.5;font-weight:600}
.dp-quote::before{content:"";position:absolute;left:0;top:.25em;bottom:.25em;width:5px;border-radius:5px;background:var(--acc)}
.dp-values{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin:6px 0 22px;padding:0;list-style:none}
.dp-values li{display:flex;gap:12px;align-items:baseline;background:#fff;border-radius:14px;padding:12px 16px}
.dp-values li::before{content:"";flex:none;width:12px;height:12px;border-radius:50%;border:3px solid var(--acc)}
.dp-sign{margin-top:28px;padding-top:22px;border-top:2px solid #e4e1ec}
.dp-sign b{display:block;font-size:19px}
.dp-sign span{color:var(--muted)}

/* Two-column section */
.dp-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);margin-top:48px;align-items:start}

@media (max-width:760px){
  .dp-msg,.dp-split{grid-template-columns:1fr}
  .dp-msg figure{position:static;max-width:260px}
}
@media (prefers-reduced-motion:reduce){.dp-card,.dp-card:hover,.dp-tiles a,.dp-tiles a:hover{transition:none;transform:none}}
