/* ============================================================
   MTI Campus Life — /campus.html
   ============================================================ */
.cf-hero{position:relative;overflow:hidden;isolation:isolate;background:#1D161C;text-align:center;
  padding:clamp(58px,7vw,100px) 0 clamp(42px,5.5vw,68px)}
.cf-hero-bg{position:absolute;inset:0;z-index:-2}
.cf-hero-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;display:block}
.cf-hero::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(176deg,rgba(29,22,28,.94) 0%,rgba(29,22,28,.88) 46%,rgba(74,35,30,.93) 100%)}
.cf-hero .ab-crumb{justify-content:center;color:rgba(252,247,234,.72);margin-bottom:16px}
.cf-hero .ab-crumb a{color:var(--hb-gold-dot)}
.cf-crest{display:block;width:76px;margin:0 auto 16px;filter:drop-shadow(0 12px 20px rgba(0,0,0,.6))}
.cf-h1{margin:0 auto 12px;max-width:22ch;
  font:800 clamp(27px,4.2vw,46px)/1.12 var(--hb-display);color:#FCF7EA;letter-spacing:-.015em}
.cf-sub{margin:0 auto;max-width:60ch;
  font:600 clamp(15px,1.7vw,18px)/1.6 var(--hb-display);color:#F3D58C}
.cf-promise{max-width:680px;margin:26px auto 0;padding:20px 26px;border-radius:16px;
  background:rgba(252,247,234,.07);border:1px solid rgba(226,177,93,.34);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.cf-promise .k{display:block;margin-bottom:8px;font:700 9.8px/1 var(--hb-text);letter-spacing:.18em;
  text-transform:uppercase;color:var(--hb-gold-dot)}
.cf-promise p{margin:0;font:italic 600 15px/1.75 var(--hb-display);color:#FCF7EA}
.cf-hero .ab-cta-row{justify-content:center;margin-top:26px}

/* facility showcase */
.cf-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;
  max-width:1180px;margin:0 auto;align-items:stretch}
.cf-card{position:relative;display:flex;flex-direction:column;height:100%;
  padding:26px 22px 22px;border-radius:20px;
  border:1px solid var(--hb-border);background:linear-gradient(180deg,#FFFDF6,#F6EEDB);
  box-shadow:0 20px 40px -26px rgba(29,22,28,.32),inset 0 1px 0 #fff;
  transition:transform .18s ease,border-color .18s ease}
.cf-card:hover{transform:translateY(-4px);border-color:#B08542}
.cf-no{position:absolute;top:16px;right:18px;
  font:800 26px/1 var(--hb-display);color:rgba(110,83,39,.18);letter-spacing:-.03em}
.cf-ic{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;margin-bottom:14px;
  background:radial-gradient(circle at 35% 30%,#F3D58C,var(--hb-gold) 55%,#B08542);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -2px 3px rgba(0,0,0,.2),
    0 10px 18px -10px rgba(143,106,46,.5)}
.cf-ic img{width:26px;height:26px}
.cf-card h3{margin:0 0 9px;padding-right:34px;font:800 17px/1.28 var(--hb-display);color:var(--hb-ink)}
.cf-card p{margin:0 0 12px;font:400 13.7px/1.72 var(--hb-text);color:var(--hb-body)}
.cf-list{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.cf-list li{padding:5px 11px;border-radius:999px;
  font:600 11.4px/1.35 var(--hb-text);color:#3F2F10;
  background:rgba(226,177,93,.2);border:1px solid rgba(226,177,93,.42)}
.cf-tail{margin-top:auto!important;padding-top:12px;border-top:1px solid var(--hb-border);
  font-size:12.8px!important;font-style:italic;color:var(--hb-muted)!important}

/* photographic bands */
.cf-band{margin:0 auto 28px;max-width:1080px;border-radius:22px;overflow:hidden;
  border:1.5px solid #D9A64C;box-shadow:0 30px 58px -34px rgba(29,22,28,.5)}
.cf-band img{display:block;width:100%;height:auto;aspect-ratio:2/1;object-fit:cover}
.ab-sec.ab--dark .cf-band{border-color:rgba(226,177,93,.45)}

@media (max-width:1024px){.cf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:660px){.cf-grid{grid-template-columns:minmax(0,1fr)}
  .cf-band img{aspect-ratio:16/10}}
