/* ==========================================================================
   COMPASS Lab — Project subpage overrides (shared by cage/ccai/moat/...)
   Loaded after the legacy theme stylesheet.
   ========================================================================== */

:root{
  --cp-blue:#0A5CFF; --cp-blue-deep:#0043C8; --cp-blue-soft:#EEF3FF;
  --cp-red:#E4002B; --cp-navy:#0B1B33;
  --cp-grad:linear-gradient(100deg,#E4002B 0%,#93006C 52%,#1B2FD8 100%);
  --cp-text:#1D1D1F; --cp-text-2:#6E6E73;
  --cp-line:rgba(15,30,56,.09);
  --cp-radius:16px;
  --cp-shadow:0 2px 8px rgba(11,27,51,.05), 0 12px 32px rgba(11,27,51,.07);
  --cp-font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text",
            "Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",
            "Helvetica Neue",Arial,sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--cp-font) !important;
  font-size:16px; line-height:1.7; color:var(--cp-text) !important;
  background:#fff; -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{ color:var(--cp-blue); }
a:hover{ color:var(--cp-blue-deep); text-decoration:none; }
::selection{ background:rgba(10,92,255,.16); }

/* ---------- Top bar: back to lab ---------- */
.cp-projbar{
  position:sticky; top:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  height:56px; padding:0 24px;
  background:rgba(255,255,255,.85);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid var(--cp-line);
}
.cp-projbar-brand{
  display:inline-flex; align-items:center; gap:9px;
  font-size:15px; font-weight:700; letter-spacing:-.01em; color:var(--cp-text) !important;
}
.cp-projbar-brand img{ width:24px; height:auto; }
.cp-projbar-link{
  font-size:13px; font-weight:500; color:var(--cp-blue) !important;
  padding:6px 14px; border:1px solid rgba(15,30,56,.16); border-radius:999px;
  transition:all .2s ease;
}
.cp-projbar-link:hover{ background:var(--cp-blue); border-color:var(--cp-blue); color:#fff !important; }

/* ---------- Page head ---------- */
.page-head{
  background:#F4F8FF !important;
  background-image:
    radial-gradient(720px 300px at 88% -20%, rgba(10,92,255,.12), transparent 60%),
    radial-gradient(560px 260px at 6% -30%, rgba(10,92,255,.08), transparent 60%),
    linear-gradient(180deg,#F0F6FF 0%,#FFFFFF 100%) !important;
  display:flex !important; flex-direction:column;
  align-items:center !important; justify-content:center; text-align:center;
  padding:88px 24px 72px !important; gap:20px;
  margin:0 !important; min-height:0 !important;
}
.page-head::before, .page-head::after{ display:none !important; }
.page-head .container{
  flex:0 0 auto !important; width:auto !important; max-width:880px !important;
  margin:0 !important; padding:0 !important; float:none !important;
}
.page-head .container img{ width:150px !important; height:auto; filter:drop-shadow(0 4px 16px rgba(10,92,255,.14)); }
.page-head .page-title{
  font-family:var(--cp-font) !important;
  font-size:clamp(36px,6vw,56px) !important; font-weight:700; letter-spacing:-.02em;
  color:#1D1D1F !important; margin:0 !important; line-height:1.1;
}
.page-head .page-title:empty{ display:none; }
.page-head small, .page-head large{
  font-size:clamp(15px,2vw,19px) !important; color:#6E6E73 !important;
  font-weight:400; letter-spacing:0;
}
.page-head small i, .page-head large i{ font-style:normal; }

/* ---------- Content ---------- */
.main-content{ padding:0 !important; }
.fullwidth-block{ padding:56px 0 !important; }
.fullwidth-block:nth-child(even){ background:#F7F8FA; }
.container{
  width:auto !important; max-width:880px !important;
  margin-left:auto !important; margin-right:auto !important;
  padding-left:24px !important; padding-right:24px !important;
  float:none !important;
}
.row{ margin:0 !important; }
.col-md-12{ padding:0 !important; float:none !important; width:auto !important; }

.section-title{
  font-family:var(--cp-font) !important;
  font-size:28px !important; font-weight:700; letter-spacing:-.02em;
  color:var(--cp-text) !important; margin:0 0 20px !important;
  padding-bottom:12px; position:relative; text-transform:none !important;
}
.section-title::after{
  content:""; position:absolute; left:0; bottom:0; width:44px; height:3px;
  border-radius:3px; background:var(--cp-grad);
}
p{
  font-size:16px !important; line-height:1.8 !important;
  color:#414146 !important; margin:0 0 16px !important; font-weight:400 !important;
}
h3,h4{ font-family:var(--cp-font) !important; color:var(--cp-text) !important; }
ul,ol{ padding-left:1.4em !important; }
li{ line-height:1.8; color:#414146; }

.main-content img{
  max-width:100%; height:auto; display:block; margin:24px auto;
  border-radius:var(--cp-radius); border:1px solid var(--cp-line);
  box-shadow:var(--cp-shadow);
}

/* Tables */
table{
  width:100% !important; border-collapse:separate !important; border-spacing:0;
  border:1px solid var(--cp-line) !important; border-radius:14px; overflow:hidden;
  margin:20px 0; font-size:14.5px;
}
th{
  background:#EEF3FF !important; color:#1D1D1F !important; font-weight:600;
  padding:12px 14px !important; border:0 !important;
}
td{
  padding:10px 14px !important; border:0 !important;
  border-top:1px solid var(--cp-line) !important; color:#414146 !important;
}
tr:nth-child(even) td{ background:#F7F8FA; }

/* Buttons (legacy theme) */
.button, form input[type="submit"], form button{
  border-radius:999px !important; background:var(--cp-blue) !important;
  border:0 !important; color:#fff !important; font-weight:600;
  box-shadow:0 4px 12px rgba(10,92,255,.24);
}
.button:hover, form input[type="submit"]:hover, form button:hover{
  background:var(--cp-blue-deep) !important;
}

/* Footer strip if present */
.site-footer, .site-content > footer{
  background:#F7F8FA !important; border-top:1px solid var(--cp-line);
  color:var(--cp-text-2) !important;
}

@media (max-width:640px){
  .page-head{ padding:64px 20px 52px !important; }
  .fullwidth-block{ padding:40px 0 !important; }
}

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