/* VemCampus — the Vem family look on WPLMS.
   Tokens: design_handoff_vem_site/BUILD-INSTRUCTIONS.md. Rules: radius 0, no shadows, no gradients.
   Font tokens are --font-*: Elementor containers own a --display custom property. */

@font-face{font-family:"Vem Display";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/instrument-serif-400-latin.woff2) format("woff2")}
@font-face{font-family:"Vem Sans";font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/instrument-sans-400-600-latin.woff2) format("woff2")}
@font-face{font-family:"Vem Mono";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-400-latin.woff2) format("woff2")}

:root{
  --vem:#FF007F; --net:#4E60FF; --com:#00F5D4;
  --com-text:#076B5C;            /* darker than the family's #0A8F7C: small text on bone needs 4.5:1 */
  --bone:#F7F5F1; --paper:#FFFDF9; --mist:#F2EFE9;
  --ink:#14110F; --ink-2:#47423D; --ink-3:#6E6862; --faint:#A9A29A;
  --line:#E2DED6; --line-2:#D8D3CA; --line-dark:rgba(242,239,233,.28);
  --font-display:"Vem Display","Instrument Serif",Georgia,serif;
  --font-body:"Vem Sans","Instrument Sans",Helvetica,Arial,sans-serif;
  --font-mono:"Vem Mono","IBM Plex Mono",ui-monospace,monospace;
  --gutter:clamp(20px,4vw,48px); --max:1280px;
  --pad:clamp(70px,9vw,120px); --pad-md:clamp(56px,7vw,88px);
}

/* ---- base (over WPLMS) ---------------------------------------------------- */
body.vem{background:var(--bone) !important;color:var(--ink);font-family:var(--font-body) !important;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased}
body.vem p,body.vem li,body.vem td,body.vem input,body.vem select,body.vem textarea,body.vem button{font-family:var(--font-body)}
body.vem h1,body.vem h2,body.vem h3,body.vem h4,body.vem h5,body.vem h6{font-family:var(--font-display) !important;font-weight:400 !important;color:var(--ink) !important;letter-spacing:-.01em}
body.vem a{color:var(--ink)}
body.vem a:hover,body.vem a:focus{color:var(--com-text)}
body.vem :focus-visible{outline:2px solid var(--com-text);outline-offset:3px}
body.vem .button,body.vem button,body.vem input[type=submit],body.vem input[type=button],body.vem .btn,
body.vem .woocommerce a.button,body.vem .woocommerce button.button{border-radius:0 !important;box-shadow:none !important;background-image:none !important}
body.vem .button.primary,body.vem .woocommerce a.button.alt,body.vem .woocommerce button.button.alt,body.vem .course_button,body.vem .vbp_button{background:var(--ink) !important;color:var(--bone) !important;border:1px solid var(--ink) !important}
body.vem .button.primary:hover,body.vem .woocommerce a.button.alt:hover,body.vem .woocommerce button.button.alt:hover,body.vem .course_button:hover{background:var(--com-text) !important;border-color:var(--com-text) !important}
body.vem input[type=text],body.vem input[type=search],body.vem input[type=email],body.vem input[type=number],body.vem select,body.vem textarea{border-radius:0 !important;border:1px solid var(--line-2);background:var(--paper);box-shadow:none}
body.vem img{border-radius:0}
body.vem #content,body.vem section#content{background:transparent}
body.vem #scrolltop{display:none}

/* ---- primitives ---------------------------------------------------------- */
.vem-wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter);box-sizing:border-box}
.vem-serif{font-family:var(--font-display);font-weight:400}
.vem-mono{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.14em}
.vem-com{color:var(--com-text)}
.vem-sq{width:6px;height:6px;background:var(--vem);display:inline-block}
.vem-muted{color:var(--ink-2);max-width:46ch;margin:0}
.vem-narrow{max-width:20ch}
.vem-mb{margin-bottom:44px !important}
.vem-skip{position:absolute;left:-9999px;top:0;z-index:1000;background:var(--ink);color:var(--bone) !important;padding:10px 14px}
.vem-skip:focus{left:8px;top:8px}
.vem-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 22px;font-size:15px;font-weight:500;text-decoration:none !important;border:1px solid var(--line-2);transition:background .18s,border-color .18s,color .18s}
.vem-btn--sm{min-height:40px;padding:8px 18px;font-size:14px}
.vem-btn--ink{background:var(--ink);color:var(--bone) !important;border-color:var(--ink)}
.vem-btn--ink:hover{background:var(--com-text);border-color:var(--com-text);color:var(--bone) !important}
.vem-btn--line{background:transparent;color:var(--ink) !important}
.vem-btn--line:hover{border-color:var(--ink);color:var(--ink) !important}
.vem-eyebrow{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--com-text);margin:0 0 16px;display:flex;align-items:center;gap:10px}
.vem-eyebrow::before{content:"";width:6px;height:6px;background:var(--com)}
.vem-eyebrow--rule{margin-bottom:28px;gap:12px}
.vem-eyebrow--rule::before{width:42px;height:1px}
.vem-arrow{font-size:12px;text-decoration:none !important;display:inline-flex;gap:7px;transition:gap .18s}
.vem-arrow:hover{gap:13px}

/* ---- header -------------------------------------------------------------- */
.vem-familybar{background:var(--ink);color:#C9C2B9}
.vem-familybar .vem-wrap{height:36px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.vem-familybar a{color:var(--paper) !important;text-decoration:none;font-size:10.5px;display:flex;align-items:center;gap:8px}
.vem-familybar .vem-sq{width:5px;height:5px}
.vem-header{position:sticky;top:0;z-index:100;background:rgba(247,245,241,.94);border-bottom:1px solid var(--line);backdrop-filter:saturate(140%) blur(10px)}
.admin-bar .vem-header{top:32px}
.vem-header--campus{background:var(--paper)}
.vem-header__row{height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.vem-header--campus .vem-header__row{height:84px}
.vem-brand{display:flex;align-items:baseline;gap:8px;text-decoration:none !important}
.vem-wordmark{font-size:30px;line-height:1;color:var(--ink)}
.vem-wordmark span{color:var(--com-text)}
.vem-brand--campus{align-items:center;gap:14px}
.vem-crest{width:48px;height:48px;object-fit:contain;border:1px solid var(--line-2);background:var(--bone)}
.vem-brand__text{display:flex;flex-direction:column;line-height:1.1}
.vem-brand__text .vem-serif{font-size:26px;color:var(--ink)}
.vem-brand__text .vem-mono{font-size:10px;color:var(--ink-3)}
.vem-nav{display:flex;align-items:center;gap:28px;font-size:14.5px}
.vem-nav__menu{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.vem-nav__menu a,.vem-nav__link{text-decoration:none !important;padding:4px 0;border-bottom:2px solid transparent}
.vem-nav__menu .current-menu-item>a{border-bottom-color:var(--com)}
.vem-nav__menu .menu-item-type-custom.current-menu-item>a{border-bottom-color:transparent} /* #anchors on the home page all count as current */
.vem-nav__link b{font-weight:500}
.vem-nav__quiet{color:var(--ink-3) !important}
.vem-lang{font-size:12px;color:var(--ink-3);display:flex;gap:6px}
.vem-lang a{text-decoration:none !important;color:var(--ink-3) !important}
.vem-lang a[aria-current]{color:var(--ink) !important;border-bottom:2px solid var(--com)}
.vem-familybar .vem-lang a{color:var(--faint) !important}
.vem-familybar .vem-lang a[aria-current]{color:var(--paper) !important}
.vem-burger{display:none;font-size:12px;background:none;border:1px solid var(--line-2);padding:10px 14px;min-height:44px;color:var(--ink);cursor:pointer}
.vem-mobile{border-top:1px solid var(--line);background:var(--paper)}
.vem-mobile .vem-wrap{display:flex;flex-direction:column;padding-top:12px;padding-bottom:20px}
.vem-mobile__menu{list-style:none;margin:0;padding:0}
.vem-mobile a{display:block;padding:12px 0;border-bottom:1px solid var(--line);text-decoration:none !important;font-size:16px}
@media (max-width:900px){.vem-nav{display:none}.vem-burger{display:inline-flex}}
@media (max-width:782px){.admin-bar .vem-header{top:46px}}

/* ---- footer -------------------------------------------------------------- */
.vem-footer{background:var(--mist);border-top:1px solid var(--line)}
.vem-footer .vem-wrap{padding-top:64px;padding-bottom:36px}
.vem-footer__cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:32px;font-size:14.5px;margin-bottom:56px}
.vem-footer__col{display:flex;flex-direction:column;gap:9px}
.vem-footer__col a{text-decoration:none !important}
.vem-footer__head{font-size:11px;color:var(--ink-3);margin-bottom:4px}
.vem-footer__sig{padding-top:22px;border-top:1px solid var(--line-2);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px}
.vem-footer__brand{display:flex;align-items:baseline;gap:10px;font-size:14px;color:var(--ink-2)}
.vem-footer__brand .vem-serif{font-size:24px;color:var(--ink)}
.vem-footer__brand a{color:var(--ink-2) !important;text-decoration:none !important}
.vem-footer__legal{font-size:11px;color:var(--ink-3);text-transform:none;letter-spacing:.04em}

/* ---- home ---------------------------------------------------------------- */
.vem-section{padding-top:var(--pad);padding-bottom:var(--pad)}
.vem-section--md{padding-top:var(--pad-md);padding-bottom:var(--pad-md)}
.vem-band{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.vem-hero{padding-top:clamp(72px,10vw,128px);padding-bottom:clamp(56px,7vw,96px)}
.vem-h1{font-size:clamp(2.9rem,6.6vw,5.6rem) !important;line-height:.99 !important;letter-spacing:-.02em !important;margin:0 !important;max-width:17ch}
.vem-h2{font-size:clamp(2.1rem,4vw,3.2rem) !important;line-height:1.02 !important;margin:0 !important}
.vem-lede{font-size:clamp(17px,1.35vw,19px);color:var(--ink-2);max-width:52ch;margin:28px 0 0}
.vem-search{margin:40px 0 0;display:flex;flex-wrap:wrap;max-width:760px}
.vem-search input[type=search]{flex:1 1 320px;min-width:0;height:56px;padding:0 18px;border:1px solid var(--ink) !important;border-right:0 !important;font-size:16px}
.vem-search .vem-btn{height:56px;padding:0 26px}
.vem-hero__strip{margin-top:clamp(56px,7vw,88px);border-top:1px solid var(--line-2);padding-top:18px;display:flex;flex-wrap:wrap;gap:10px 40px}
.vem-hero__strip .vem-mono{font-size:11.5px;color:var(--ink-3)}
.vem-sechead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:32px}
.vem-cells{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
.vem-cell{outline:1px solid var(--line);padding:22px 20px;background:var(--paper);display:flex;flex-direction:column;gap:10px;min-height:120px;text-decoration:none !important}
.vem-cell:hover{background:#fff}
.vem-cell .vem-serif{font-size:26px;line-height:1.1;color:var(--ink)}
.vem-cell .vem-mono{font-size:11px;color:var(--ink-3)}
.vem-cell--mist{background:var(--mist)}
.vem-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));gap:24px}
.vem-card{background:var(--paper);border-top:3px solid var(--com);outline:1px solid var(--line);display:flex;flex-direction:column;text-decoration:none !important}
.vem-card:hover{background:#fff}
.vem-card__img{aspect-ratio:16/10;background:var(--mist) center/cover no-repeat;border-bottom:1px solid var(--line);display:block}
.vem-card__body{padding:20px 20px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
.vem-card__kicker{font-size:10.5px;color:var(--ink-3)}
.vem-card__title{font-size:26px;line-height:1.1;color:var(--ink)}
.vem-card__by{font-size:14.5px;color:var(--ink-2)}
.vem-card__foot{margin-top:auto;padding-top:14px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px}
.vem-card__foot .vem-mono{font-size:10.5px}
.vem-card__price{font-size:15px;font-weight:600;color:var(--ink)}
.vem-steps,.vem-chain{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.vem-steps li{outline:1px solid var(--line);padding:28px 26px;display:flex;flex-direction:column;gap:12px}
.vem-steps .vem-mono{font-size:12px}
.vem-steps .vem-serif{font-size:28px;line-height:1.1}
.vem-steps li>span:last-child{font-size:15.5px;color:var(--ink-2)}
.vem-split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:clamp(40px,5vw,72px)}
.vem-split__col{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.vem-split__col .vem-eyebrow{margin:0}
.vem-split__col--rule{border-left:1px solid var(--line);padding-left:clamp(0px,4vw,56px)}
.vem-campus{border:1px solid var(--ink);background:var(--paper);padding:18px 20px;display:flex;flex-direction:column;gap:6px;align-self:stretch;max-width:460px}
.vem-campus .vem-mono{font-size:12px}
.vem-campus .vem-serif{font-size:24px}
.vem-campus .vem-com{font-size:10.5px}
.vem-dark{background:var(--ink);color:var(--paper)}
body.vem .vem-dark h2{color:var(--paper) !important}
.vem-dark__eyebrow{font-size:11px;color:#FF5CA8;margin:0 0 16px}
.vem-chain li{outline:1px solid var(--line-dark);padding:24px 22px;display:flex;flex-direction:column;gap:8px}
.vem-chain .vem-mono{font-size:10.5px;color:var(--faint)}
.vem-chain .vem-serif{font-size:30px}
.vem-chain li>span:last-child{font-size:14.5px;color:#C9C2B9}
.vem-dark__note{margin:36px 0 0;color:#C9C2B9;font-size:15.5px;max-width:60ch}
@media (max-width:640px){.vem-search input[type=search]{border-right:1px solid var(--ink) !important;flex-basis:100%}.vem-search .vem-btn{flex:1 1 100%}}
@media (max-width:900px){.vem-split__col--rule{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:40px}}

/* ---- catalogue ----------------------------------------------------------- */
.vem-cat__head{padding-top:clamp(48px,6vw,80px);padding-bottom:32px}
.vem-crumb{font-size:11px;color:var(--ink-3);margin:0 0 18px}
.vem-crumb a{color:var(--ink-3) !important;text-decoration:none !important}
.vem-h1--page{font-size:clamp(2.6rem,5.4vw,4.4rem) !important;line-height:1 !important}
.vem-search--sm{margin-top:28px;max-width:720px}
.vem-search--sm input[type=search],.vem-search--sm .vem-btn{height:52px}
.vem-cat__body{padding-bottom:var(--pad);display:flex;flex-wrap:wrap;gap:clamp(28px,4vw,56px);align-items:flex-start}
.vem-filters{flex:1 1 240px;max-width:280px;display:flex;flex-direction:column;gap:28px;border-top:1px solid var(--ink);padding-top:20px}
.vem-filters fieldset{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.vem-filters legend{font-size:11px;color:var(--ink-3);margin-bottom:10px;padding:0}
.vem-opt{display:flex;align-items:center;gap:10px;font-size:15px;min-height:34px;cursor:pointer;margin:0;font-weight:400}
.vem-opt input{width:16px;height:16px;accent-color:var(--ink);margin:0}
.vem-filters__actions{display:flex;gap:10px;flex-wrap:wrap}
.vem-results{flex:999 1 560px;min-width:0;display:flex;flex-direction:column;gap:24px}
.vem-results__bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;border-top:1px solid var(--ink);padding-top:16px}
.vem-results__bar>.vem-mono{font-size:11.5px;color:var(--ink-2)}
.vem-chips{display:flex;flex-wrap:wrap;gap:8px}
.vem-chip{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.14em;padding:8px 12px;min-height:36px;display:inline-flex;align-items:center;border:1px solid var(--line-2);background:var(--paper);text-decoration:none !important}
.vem-chip.is-on{background:var(--ink);border-color:var(--ink);color:var(--bone) !important}
.vem-cards--fill{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.vem-pages{display:flex;flex-wrap:wrap;margin-top:16px;font-size:12px}
.vem-pages .page-numbers{min-width:44px;height:44px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;outline:1px solid var(--line);background:var(--paper);text-decoration:none !important;box-sizing:border-box}
.vem-pages .page-numbers.current{background:var(--ink);color:var(--bone);outline-color:var(--ink)}
.vem-empty{border:1px solid var(--line);background:var(--paper);padding:40px 28px;display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.vem-empty .vem-serif{font-size:28px}

/* ---- WPLMS page title band (ordinary pages: legal, course status, certificate…) ----------
   WPLMS paints #title dark navy; our ink headings vanished on it. Family style: light band. */
body.vem #title{background:var(--bone) !important;color:var(--ink) !important;border-bottom:1px solid var(--line);padding:clamp(40px,5vw,72px) 0 clamp(24px,3vw,36px) !important;margin:0}
body.vem #title .pagetitle h1{font-size:clamp(2.6rem,5vw,4.2rem) !important;line-height:1 !important;letter-spacing:-.02em !important;margin:14px 0 0 !important;color:var(--ink) !important}
body.vem #title .breadcrumbs{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-3)}
body.vem #title .breadcrumbs li+li::before{content:"/";margin-right:6px;color:var(--faint)}
body.vem #title .breadcrumbs a,body.vem #title .breadcrumbs span{color:var(--ink-3) !important;text-decoration:none !important}
body.vem.page-template-default #content .container,body.vem.page-template-default #title .container{max-width:var(--max)}
body.vem.page-template-default #content h2{font-size:clamp(1.7rem,2.6vw,2.2rem) !important;line-height:1.1 !important;margin:2.2em 0 .6em !important}
body.vem.page-template-default #content p,body.vem.page-template-default #content li{color:var(--ink-2);max-width:72ch}

@media (prefers-reduced-motion:reduce){*{transition:none !important}}
