/* ============================================================
   inline-extracted.css
   Classes extracted from former inline style="" attributes so the
   markup carries no inline CSS. Loaded AFTER style.css so these rules
   win specificity ties and the rendered result is unchanged.
   Declarations are kept identical to the original inline styles.
   ============================================================ */

/* ---------- Opacity utilities ---------- */
.op-92 { opacity: .92; }
.op-90 { opacity: .9; }
.op-85 { opacity: .85; }
.op-80 { opacity: .8; }
.op-70 { opacity: .7; }
.op-40 { opacity: .4; }

/* ---------- Width / max-width utilities ---------- */
.mw-760  { max-width: 760px; }
.mw-640  { max-width: 640px; }
.mw-130  { max-width: 130px; }
.minw-180 { min-width: 180px; }

/* ---------- Text colour utilities ---------- */
.text-white-80 { color: #fff; opacity: .8; }
.text-white-85 { color: rgba(255, 255, 255, .85); }
.text-secdark-ls { color: var(--secondary-dark); letter-spacing: 1px; }

/* ---------- Font helpers ---------- */
.ff-poppins { font-family: 'Poppins'; }
.sdg-num { font-family: 'Poppins'; font-size: 1.5rem; font-weight: 700; }

/* ---------- Icon helpers ---------- */
.icon-2     { font-size: 2rem; opacity: .9; }
.icon-4-sec { font-size: 4rem; color: var(--secondary); }
.icon-3-sec { font-size: 3rem; color: var(--secondary); opacity: .7; }

/* ---------- Attend-icon size variants ---------- */
.attend-icon-sm { width: 54px; height: 54px; font-size: 1.3rem; margin: 0; }
.attend-icon-md { width: 56px; height: 56px; font-size: 1.4rem; }

/* ---------- Border accents ---------- */
.border-top-sec    { border-top: 4px solid var(--secondary); }
.border-bottom-sec { border-bottom: 4px solid var(--secondary); }
.border-left-sec   { border-left-color: var(--secondary); }

/* ---------- Card / media helpers ---------- */
.card-grad-primary { background: linear-gradient(135deg, var(--primary), var(--primary-light)); border-left-color: var(--secondary); }
.img-cover-170 { width: 100%; height: 170px; object-fit: cover; }
.bg-accent { background: var(--accent); }
.frame-none { border: none; overflow: hidden; }

/* ---------- SDG cards (background colour + min-height) ---------- */
.sdg-card-4  { background: #C5192D; min-height: 170px; }
.sdg-card-9  { background: #FD6925; min-height: 170px; }
.sdg-card-10 { background: #DD1367; min-height: 170px; }
.sdg-card-11 { background: #FD9D24; min-height: 170px; }
.sdg-card-17 { background: #19486A; min-height: 170px; }

/* ---------- Logos ---------- */
.site-logo   { height: 54px; width: auto; }
.footer-logo { height: 54px; width: auto; background: #fff; padding: 4px; border-radius: 8px; }
.footer-about { font-size: .92rem; line-height: 1.8; }