/* ===== tokens ===== */
:root{
    --moc-green:#157575;
    --moc-orange:#F26C36;
    --ink:#1b2327;
    --ink-2:#5e6b72;
    --paper:#fff;
    --bg:#f7f9fa;
    --line:#e7edf0;
    --radius:14px;
    --gap:clamp(10px,1.4vw,18px);
    --shadow:0 8px 24px rgba(0,0,0,.06);
}

/* ===== utilities ===== */
.no-pad{padding:0!important;}
.no-marg{margin:0!important;}
.pad-s{padding:8px;}
.pad-m{padding:14px;}
.pad-l{padding:22px;}
.mt-s{margin-top:8px;} .mt-m{margin-top:14px;} .mt-l{margin-top:22px;}
.mb-s{margin-bottom:8px;} .mb-m{margin-bottom:14px;} .mb-l{margin-bottom:22px;}
.center{text-align:center;}
.muted{color:var(--ink-2);} .ink{color:var(--ink);}
.round{border-radius:var(--radius);}

/* layout helpers */
.container-1100{max-width:1100px; margin:0 auto; padding:0 14px;}
.grid-2{display:grid; grid-template-columns:1fr; gap:var(--gap);}
@media (min-width: 900px){ .grid-2{ grid-template-columns:1fr 1fr; } }
.grid-3{display:grid; grid-template-columns:1fr; gap:var(--gap);}
@media (min-width: 900px){ .grid-3{ grid-template-columns:repeat(3,1fr);} }

/* ===== components ===== */
.card{
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow);
    overflow:hidden;
}
.card--pad{padding:14px;}
.card__media img, .card__media video{
    display:block; width:100%; height:auto; object-fit:cover;
}
.card__body{padding:12px 14px;}
.card__title{font-weight:700; font-size:1.05rem; margin:0 0 4px; color:var(--ink);}
.card__tagline{font-size:.92rem; color:var(--ink-2);}

/* image overlay title option */
.card--overlay{position:relative;}
.card--overlay .card__overlay{
    position:absolute; left:0; right:0; bottom:0;
    padding:12px 14px; color:#fff;
    background:linear-gradient(180deg, rgba(0,0,0,.0) 0%, rgba(0,0,0,.55) 100%);
}

/* headings (sections) */
.section-heading{margin:0 0 6px; display:flex; justify-content:space-between; align-items:center;}
.section-heading h2, .section-heading h3, .section-heading h4{margin:0; font-weight:700; color:var(--ink);}

/* buttons (keep light) */
.btn{
    display:inline-block; border:1px solid var(--line); border-radius:10px;
    padding:6px 10px; font-size:.95rem; background:#fff; color:var(--ink);
}
.btn--pill{border-radius:999px;}
.btn--accent{border-color:var(--moc-green); color:var(--moc-green);}

/* nav/slider overlap fix */
.moc-topnav{position:relative; z-index:50;}
#home-hero{position:relative; z-index:1;}
:root { --headerH: 72px; }
body.with-fixed-header { padding-top: var(--headerH); }