/*
Theme Name: MTC Admissions
Theme URI: https://admissions.mtc.edu.pg/
Description: Front end for the MTC online admissions portal. Shares the header, footer and palette of the MTC LMS so the three college sites read as one.
Author: MTC / Cloud 9 PNG Services
Version: 1.0.3
Text Domain: mtc-admissions
*/

/* ---------- design tokens (mirrors the LMS token file) ---------- */
:root{
  --mtc-plum:#3D0B60; --mtc-plum-deep:#2A0743;
  --mtc-purple:#6B2B8F; --mtc-purple-600:#57217A;
  --mtc-purple-soft:#F4EDF9; --mtc-purple-line:#E1D2EC;
  --mtc-gold:#C8811B; --mtc-gold-soft:#FDF4E4;
  --mtc-ink:#221A28; --mtc-muted:#675C70; --mtc-line:#E5DEEA;
  --mtc-bg:#FBF9FC; --mtc-surface:#FFFFFF;
  --mtc-navy:#16256B; --mtc-red:#D3202A;
  --mtc-radius:14px; --mtc-radius-sm:8px;
  --mtc-shadow:0 1px 2px rgba(34,26,40,.05),0 10px 28px -14px rgba(61,11,96,.22);
  --mtc-maxw:1180px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:96px}
body{margin:0;background:var(--mtc-bg);color:var(--mtc-ink);
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--mtc-purple)}
h1,h2,h3,h4{color:var(--mtc-ink);line-height:1.2;margin:0 0 14px}
.mtc-shell{max-width:var(--mtc-maxw);margin:0 auto;padding:0 20px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:8px;top:8px;z-index:999;background:#fff;padding:10px 16px;border-radius:8px}

/* ---------- buttons ---------- */
.mtc-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  background:var(--mtc-purple);color:#fff;border:1px solid var(--mtc-purple);
  border-radius:var(--mtc-radius-sm);padding:12px 20px;font-weight:700;font-size:15px;
  text-decoration:none;cursor:pointer;transition:background .16s ease}
.mtc-button:hover{background:var(--mtc-purple-600);color:#fff}
.mtc-button--sm{padding:9px 15px;font-size:14px}
.mtc-button--ghost{background:transparent;color:var(--mtc-purple);border-color:var(--mtc-purple-line)}
.mtc-button--ghost:hover{background:var(--mtc-purple-soft);color:var(--mtc-purple-600)}
.mtc-button:focus-visible{outline:3px solid var(--mtc-gold);outline-offset:2px}
/* ---------- header ---------- */
.mtc-site-header{background:#fff;border-bottom:1px solid var(--mtc-line);position:sticky;top:0;z-index:100;transition:box-shadow .22s ease}
body.admin-bar .mtc-site-header{top:32px}
@media screen and (max-width:782px){body.admin-bar .mtc-site-header{top:46px}}
.mtc-site-header.is-stuck{box-shadow:0 10px 30px -14px rgba(61,11,96,.42)}
.mtc-header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:14px;padding-bottom:14px;transition:padding .25s ease}
.mtc-site-header.is-stuck .mtc-header-inner{padding-top:9px;padding-bottom:9px}
.mtc-brand{display:flex;align-items:center;gap:13px;text-decoration:none;min-width:0}
.mtc-brand-mark{width:50px;height:auto;flex:0 0 auto;transition:width .25s ease}
.mtc-site-header.is-stuck .mtc-brand-mark{width:40px}
.mtc-brand-text{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.mtc-brand-name{font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--mtc-navy);text-transform:uppercase}
.mtc-brand-sub{font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--mtc-purple);margin-top:2px}
.mtc-primary-nav{display:flex;align-items:center;gap:26px}
.mtc-menu{list-style:none;display:flex;align-items:center;gap:22px;margin:0;padding:0}
.mtc-menu a{color:#2E133D;text-decoration:none;font-family:'Oswald',sans-serif;font-size:14px;font-weight:500;letter-spacing:.3px;text-transform:uppercase;line-height:14px;padding:6px 0;display:inline-block;border-bottom:2px solid transparent}
.mtc-menu a:hover{color:var(--mtc-purple);border-bottom-color:var(--mtc-purple)}
.mtc-menu .current-menu-item>a{color:#521A7D;border-bottom-color:var(--mtc-gold)}
.mtc-header-actions{display:flex;align-items:center;gap:9px}
.mtc-navtoggle{display:none;background:none;border:1px solid var(--mtc-line);border-radius:9px;padding:8px 10px;cursor:pointer;color:var(--mtc-plum)}
.mtc-navtoggle:focus-visible,.mtc-brand:focus-visible{outline:2px solid var(--mtc-gold);outline-offset:2px}

/* ---------- footer ---------- */
.mtc-site-footer{background:var(--mtc-plum);color:#EBE2F1;margin-top:60px}
.mtc-site-footer a{color:#EBE2F1;text-decoration:none}
.mtc-site-footer a:hover{color:var(--mtc-gold);text-decoration:underline}
.mtc-footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1.4fr 1fr;gap:40px;padding-top:52px;padding-bottom:44px}
.mtc-footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;font-size:14.5px}
.mtc-footer-head{font-size:11.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--mtc-gold);margin:0 0 16px}
.mtc-footer-mark{width:62px;height:auto;margin-bottom:14px}
.mtc-footer-name{margin:0;font-size:16px;font-weight:800;color:#fff;text-transform:uppercase}
.mtc-footer-tagline{margin:8px 0 0;font-size:14px;font-style:italic;opacity:.82;max-width:30ch}
.mtc-footer-contact{line-height:1.6}
.mtc-footer-contact li{opacity:.92}
.mtc-dherst{width:92px;height:auto;background:#fff;border-radius:50%;padding:5px;display:block;margin-bottom:12px}
.mtc-footer-small{font-size:12.5px;opacity:.72;margin:0;line-height:1.55}
.mtc-social{display:flex;gap:10px;margin-top:14px}
.mtc-social a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);transition:background .18s ease}
.mtc-social a:hover{background:var(--mtc-gold);text-decoration:none}
.mtc-social svg{width:18px;height:18px;fill:currentColor}
.mtc-footer-base{border-top:1px solid rgba(255,255,255,.14)}
.mtc-footer-base-inner{display:flex;flex-wrap:wrap;gap:8px 26px;align-items:center;justify-content:space-between;padding-top:18px;padding-bottom:18px;font-size:13px}
.mtc-footer-base-inner p{margin:0;opacity:.8}

@media(max-width:980px){.mtc-footer-grid{grid-template-columns:1fr 1fr;gap:32px}}
@media(max-width:860px){
  .mtc-navtoggle{display:inline-flex}
  .mtc-primary-nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--mtc-line);box-shadow:0 18px 40px -22px rgba(61,11,96,.4);flex-direction:column;align-items:stretch;gap:0;padding:10px 20px 18px}
  .mtc-primary-nav.is-open{display:flex}
  .mtc-menu{flex-direction:column;align-items:stretch;gap:0}
  .mtc-menu a{padding:12px 0;border-bottom:1px solid var(--mtc-line)}
  .mtc-header-actions{padding-top:14px}
  .mtc-header-actions .mtc-button{flex:1;justify-content:center}
}
@media(max-width:560px){.mtc-brand-name{font-size:14.5px}.mtc-brand-mark{width:42px}.mtc-footer-grid{grid-template-columns:1fr;gap:28px;padding-top:38px}}
@media(prefers-reduced-motion:reduce){.mtc-site-header,.mtc-header-inner,.mtc-brand-mark{transition:none}}
/* ---------- page shell ---------- */
.mtc-page-band{background:linear-gradient(160deg,var(--mtc-plum) 0%,var(--mtc-purple-600) 62%,var(--mtc-purple) 100%);color:#fff;padding:52px 0 56px}
.mtc-page-band h1{color:#fff;margin:0 0 12px;font-size:clamp(28px,4.2vw,42px);line-height:1.14;max-width:22ch}
.mtc-eyebrow{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;opacity:.85;margin:0 0 12px}
.mtc-underline{display:block;width:74px;height:4px;background:var(--mtc-gold);border-radius:2px;margin:0 0 20px}
.mtc-page-lead{margin:0;max-width:62ch;opacity:.92;font-size:17px}
.mtc-main{padding:44px 0 20px}
.mtc-card{background:var(--mtc-surface);border:1px solid var(--mtc-line);border-radius:var(--mtc-radius);box-shadow:var(--mtc-shadow);padding:30px}
.mtc-prose{max-width:74ch}
.mtc-prose h2{font-size:24px;margin:34px 0 12px}
.mtc-prose h2:first-child{margin-top:0}
.mtc-prose h3{font-size:18px;margin:24px 0 8px}
.mtc-prose ul,.mtc-prose ol{padding-left:22px}
.mtc-prose li{margin-bottom:7px}
.mtc-prose table{width:100%;border-collapse:collapse;margin:18px 0}
.mtc-prose th,.mtc-prose td{border:1px solid var(--mtc-line);padding:10px 12px;text-align:left;font-size:15px}
.mtc-prose th{background:var(--mtc-purple-soft);font-weight:700}
.mtc-note{background:var(--mtc-gold-soft);border-left:4px solid var(--mtc-gold);border-radius:8px;padding:16px 20px;margin:22px 0}
.mtc-note p{margin:0 0 8px}
.mtc-note p:last-child{margin:0}

/* the application form is embedded in an iframe by Calculated Fields Form */
.mtc-form-wrap{background:var(--mtc-surface);border:1px solid var(--mtc-line);border-radius:var(--mtc-radius);box-shadow:var(--mtc-shadow);padding:14px;overflow:hidden}
.mtc-form-wrap iframe{width:100%!important;border:0;display:block}

/* ---------- login ---------- */
.mtc-login-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:start}
@media(max-width:820px){.mtc-login-grid{grid-template-columns:1fr}}
.mtc-login-card{background:var(--mtc-surface);border:1px solid var(--mtc-line);border-radius:var(--mtc-radius);box-shadow:var(--mtc-shadow);padding:30px}
.mtc-login-card h2{margin-top:0;font-size:21px}
.mtc-login-card label{display:block;font-weight:600;font-size:14px;margin:0 0 6px}
.mtc-login-card input[type=text],.mtc-login-card input[type=password]{width:100%;padding:11px 13px;border:1px solid var(--mtc-line);border-radius:var(--mtc-radius-sm);font-size:15px;margin-bottom:16px;background:#fff;color:var(--mtc-ink)}
.mtc-login-card input:focus{outline:2px solid var(--mtc-purple);outline-offset:1px;border-color:var(--mtc-purple)}
.mtc-login-card .mtc-remember{display:flex;align-items:center;gap:8px;font-size:14px;margin-bottom:18px}
.mtc-login-meta{font-size:14px;color:var(--mtc-muted);margin-top:16px}
.mtc-signedin{background:var(--mtc-purple-soft);border:1px solid var(--mtc-purple-line);border-radius:var(--mtc-radius);padding:24px}
.mtc-signedin p{margin:0 0 14px}
.mtc-wide{max-width:920px;margin:0 auto}
.mtc-wide .mtc-form-wrap{padding:10px}

/* ---------- login rendered as a button in the nav ---------- */
.mtc-menu .mtc-menu-cta{margin-left:6px}
.mtc-menu .mtc-menu-cta > a{
  background:var(--mtc-purple);color:#fff;border:1px solid var(--mtc-purple);
  border-radius:var(--mtc-radius-sm);padding:9px 18px;font-family:'Oswald',sans-serif;font-weight:600;font-size:12px;letter-spacing:.8px;text-transform:uppercase;
  border-bottom:1px solid var(--mtc-purple);transition:background .16s ease;
}
.mtc-menu .mtc-menu-cta > a:hover{
  background:var(--mtc-purple-600);border-color:var(--mtc-purple-600);
  color:#fff;border-bottom-color:var(--mtc-purple-600);
}
.mtc-menu .mtc-menu-cta > a:focus-visible{outline:3px solid var(--mtc-gold);outline-offset:2px}
/* the active-page underline must not apply to a button */
.mtc-menu .mtc-menu-cta.current-menu-item > a{
  color:#fff;background:var(--mtc-purple-600);
  border-color:var(--mtc-purple-600);border-bottom-color:var(--mtc-purple-600);
}
@media(max-width:860px){
  .mtc-menu .mtc-menu-cta{margin:14px 0 0}
  .mtc-menu .mtc-menu-cta > a{display:block;text-align:center;padding:12px 18px}
}

/* ---------- application-form backdrop (front page) ----------
   The artwork carries its own colour here; the wash over it is light enough
   to leave the purple reading as purple. Nothing legible sits on it except
   the privacy line, which gets its own scrim below — the form card keeps an
   opaque surface, so labels and inputs never touch the pattern. The wash is\n   flat rather than graded: a graded one left the top and bottom edges looking\n   washed out, which is not what a backdrop should do. */
.home .mtc-main{position:relative;isolation:isolate}
.home .mtc-main::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(rgba(251,249,252,.40), rgba(251,249,252,.40)),
    url('/wp-content/uploads/2026/09/mtc-designs4.jpg') center top / cover no-repeat;
}
/* The card stays fully opaque, and lifts harder now the backdrop is dark. */
.home .mtc-form-wrap{background:#fff;box-shadow:0 26px 60px -24px rgba(16,4,30,.55),0 4px 14px rgba(16,4,30,.18)}
/* The one piece of text that does sit on the pattern. */
.home .mtc-form-privacy{
  color:#fff;opacity:1;
  background:rgba(26,6,44,.72);
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  padding:13px 20px;
}
.home .mtc-form-privacy a{color:#fff}
@media(max-width:600px){
  /* A phone card leaves only a narrow strip of pattern either side, so lift
     the wash slightly to stop it reading as a dark bar. */
  .home .mtc-main::before{background:
    linear-gradient(rgba(251,249,252,.46), rgba(251,249,252,.46)),
    url('/wp-content/uploads/2026/09/mtc-designs4.jpg') center top / cover no-repeat;}
}

/* The footer's 60px standoff would leave a pale seam between the pattern and
   the plum footer, so on the front page the two meet and the standoff moves
   inside the backdrop instead. */
.home .mtc-site-footer{margin-top:0}
.home .mtc-main{padding-bottom:86px}

/* ---------- reading column on a wide screen ----------
   74ch is a comfortable measure on a laptop but leaves the content column at
   about 640px in the middle of a 1500px window, with the tables and the note
   boxes squeezed inside it. Widen the content column on a wide screen; the
   page band's lead follows it so the two line up. */
@media(min-width:1080px){
  .mtc-main .mtc-prose{max-width:94ch}
  .mtc-page-lead{max-width:80ch}
}
@media(min-width:1400px){
  .mtc-main .mtc-prose{max-width:104ch}
}


/* ---- unified 6-column footer (MTC Website / MTC LMS / MTC Admissions / Contact / Accreditation), 2026-09-23 ---- */
.mtc-footer-grid{grid-template-columns:1.3fr 1.25fr .95fr 1fr 1.1fr .95fr;}
.mtc-footer-contact-row{display:flex;align-items:flex-start;gap:9px;}
.mtc-footer-contact-icon{flex:0 0 auto;width:14px;height:14px;margin-top:3px;opacity:.85;}
.mtc-footer-contact-icon svg{width:100%;height:100%;fill:currentColor;}
@media(max-width:1180px){.mtc-footer-grid{grid-template-columns:1.3fr 1fr 1fr;}}
@media(max-width:760px){.mtc-footer-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:480px){.mtc-footer-grid{grid-template-columns:1fr;}}