/* Veenode Learn platform theme. Shared by public, account, learner and operations shells.
   Only presentation changes: action URLs, form semantics and permission checks stay in templates/views. */
.vn-site {
  --vn-ink:#12294b; --vn-yellow:#f4cc55; --vn-paper:#fffdf5; --vn-canvas:#f8f5ec;
  --vn-line:#d9d5c9; --vn-shadow:0 4px 0 #12294b;
  background:var(--vn-canvas); color:var(--vn-ink);
}
.vn-site .vn-button,.vn-site :is(.checkout-pay,.vam-primary) {
  background:var(--vn-yellow);color:var(--vn-ink);border:1.5px solid var(--vn-ink);
  border-radius:10px;box-shadow:var(--vn-shadow);font-family:Outfit,sans-serif;font-weight:600;
  min-height:44px;padding:11px 20px;line-height:1.35;text-decoration:none;
  transition:transform .16s,box-shadow .16s,background .16s;
}
.vn-site .vn-button:hover,.vn-site :is(.checkout-pay,.vam-primary):hover {background:#fadd80;color:var(--vn-ink);transform:translateY(-2px);box-shadow:0 6px 0 var(--vn-ink)}
.vn-site .vn-button:active,.vn-site :is(.checkout-pay,.vam-primary):active {transform:translateY(2px);box-shadow:none}
.vn-site .vn-button:disabled,.vn-site :is(.checkout-pay,.vam-primary):disabled {opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
.vn-site :is(a,button,input,select,textarea,summary):focus-visible {outline:3px solid #9c7000;outline-offset:3px}
.vn-site :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]),select,textarea) {border-color:#b6b5ae;border-radius:10px;color:#12294b;background-color:#fff;max-width:100%}
.vn-site :is(input,select,textarea):disabled {background-color:#efede6;color:#646b75}
.vn-site :is(.shadow-card,.shadow-cardHi) {border-color:#c9c8bd;border-radius:20px;box-shadow:0 4px 0 #12294b18}
.vn-site .text-muted {color:#626977}
.vn-site .bg-fog {background-color:var(--vn-canvas)}
.vn-site .vn-public-nav {background:var(--vn-paper)}
.vn-public-page {background:var(--vn-paper)}
.vn-public-page .vn-public-hero {
  background-color:#fff9e9;background-image:radial-gradient(#a08d5825 1px,transparent 1px);
  background-size:22px 22px;border-bottom:1px solid var(--vn-line);color:var(--vn-ink);
}
.vn-public-hero h1 {letter-spacing:-.045em;color:var(--vn-ink);line-height:1.1}
.vn-public-hero .eyebrow {color:#725200}
.vn-illustrated-hero>div {position:relative;padding-right:44%;min-height:350px}
.vn-hero-art {position:absolute;right:2%;top:50%;transform:translateY(-50%);width:40%;height:auto;mix-blend-mode:multiply;pointer-events:none}
.vn-public-page article {border-color:#b9bdbe;border-radius:22px;box-shadow:0 5px 0 #12294b1c}
.vn-public-page article:nth-child(3n+2) {background-color:#fff5d6}
.vn-public-page section.bg-navy {margin:24px clamp(12px,3vw,36px);border-radius:28px;overflow:hidden}
/* Dark surfaces need a visible edge: navy shadows disappear into navy sections. */
.vn-site :is(section.bg-navy,section.bg-brand,.vn-public-footer) .vn-button {
 border:2px solid #fff3c4;box-shadow:0 5px 0 #b58a20;
}
.vn-site :is(section.bg-navy,section.bg-brand,.vn-public-footer) .vn-button:hover {
 box-shadow:0 7px 0 #b58a20;
}
.vn-site :is(section.bg-navy,section.bg-brand,.vn-public-footer) .vn-button:active {
 box-shadow:0 1px 0 #b58a20;transform:translateY(4px);
}
.vn-site :is(section.bg-navy,section.bg-brand,.vn-public-footer) .vn-button:disabled {
 box-shadow:none;transform:none;
}
.vn-public-page .rounded-full.bg-brand {background:#12294b}
.vn-auth {background-color:var(--vn-canvas);background-image:radial-gradient(#a08d5820 1px,transparent 1px);background-size:22px 22px}
.vn-auth-layout {width:100%;max-width:1060px;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:64px}
.vn-auth-art {background:#fff0ba;border:2px solid var(--vn-ink);border-radius:36px;box-shadow:8px 8px 0 var(--vn-ink);overflow:hidden;transform:rotate(-2deg)}
.vn-auth-art img {width:100%;height:auto;mix-blend-mode:multiply}
.vn-auth-form {justify-self:center}
.vn-auth-form>.shadow-card {border:1.5px solid var(--vn-ink);box-shadow:0 6px 0 var(--vn-ink);border-radius:24px}
.vn-site .learner-shell {background:var(--vn-canvas);color:var(--vn-ink)}
.vn-site :is(.learner-desktop,.learner-topbar,.learner-mobile-menu,.learner-sidebar) {background:var(--vn-paper);border-color:var(--vn-line)}
.vn-site .learner-nav-link:hover {background:#fff0bc;color:var(--vn-ink)}
.vn-site .learner-nav-link.is-active {background:#f4cc55;color:var(--vn-ink);border:1px solid var(--vn-ink);box-shadow:0 3px 0 var(--vn-ink)}
.vn-site .learner-profile {background:#f6efd9;border-color:var(--vn-line)}
.vn-site .learner-avatar {background:#f4cc55;color:var(--vn-ink);border:1px solid var(--vn-ink);border-radius:12px}
.vn-site :is(.vam-stat,.vam-destination,.checkout-summary,.programme-paper) {border:1px solid #bfc3be;border-radius:22px;box-shadow:0 5px 0 #12294b17}
.vn-site .vam-stat {background:#fffdf5}
.vn-site .vam-destination:hover {transform:translateY(-2px);box-shadow:0 7px 0 #12294b25}
.vn-site .vam-labs-destination {background:var(--vn-ink)}
.vn-site .checkout-summary {background:#fffdf5;border:1.5px solid var(--vn-ink);box-shadow:0 6px 0 var(--vn-ink)}
.vn-ops {background:var(--vn-canvas)}
.vn-ops :is(aside,header) {background-color:var(--vn-paper)}
.vn-ops main>.bg-white {border-color:#c9c8bd;border-radius:20px;box-shadow:0 4px 0 #12294b15}
.vn-ops table {font-variant-numeric:tabular-nums}
.vn-ops thead {background:#f6efd9;color:var(--vn-ink)}
.vn-ops tbody tr:hover {background-color:#fff9e9}
.vn-ops .vn-button {min-height:40px;padding:9px 16px;box-shadow:0 3px 0 var(--vn-ink)}
.vn-error {background-color:#fff9e9;background-image:radial-gradient(#a08d5825 1px,transparent 1px);background-size:22px 22px}
.vn-error>div {padding:40px 28px;border:2px solid #12294b;border-radius:28px;background:#fffdf5;box-shadow:0 7px 0 #12294b}
@media(max-width:1023px) {
 .vn-illustrated-hero>div {padding-right:38%;min-height:300px}
 .vn-hero-art {width:34%}
 .vn-auth-layout {gap:32px}
 .vn-footer-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
 .vn-footer-grid>div:first-child,.vn-footer-grid>div:last-child {grid-column:1/-1}
}
@media(max-width:700px) {
 .vn-illustrated-hero>div {padding-right:24px}
 .vn-hero-art {position:static;transform:none;width:100%;max-width:380px;margin:24px auto 0}
 .vn-auth-layout {display:block;max-width:440px}
 .vn-auth-art {display:none}
 .vn-public-hero h1 {font-size:clamp(34px,9vw,44px)}
 .vn-site .vn-button {white-space:normal;text-align:center}
 .vn-public-page section.bg-navy {border-radius:22px}
}
@media(prefers-reduced-motion:reduce) {
 .vn-site .vn-button,.vn-site :is(.checkout-pay,.vam-primary),.vn-site .vam-destination {transition:none;transform:none}
}

.vn-ops aside nav a.bg-navy {background:#f4cc55;color:#12294b;border:1px solid #12294b;box-shadow:0 3px 0 #12294b}
.vn-ops aside nav a:not(.bg-navy):hover {background:#fff0bc;color:#12294b}

.vn-track-filters button {border:1px solid #12294b;border-radius:10px;min-height:44px}
.vn-track-filters button.bg-navy {background:#f4cc55;color:#12294b;box-shadow:0 3px 0 #12294b}
.vn-track-link {border-top:1px solid #d9d5c9;padding-top:18px;color:#12294b}

.vn-public-page .vn-public-hero {background:#fff9e9 radial-gradient(#a08d5825 1px,transparent 1px)!important;background-size:22px 22px!important}
.vn-public-hero :is(h1,p,.eyebrow) {color:#12294b!important}
.vn-learner-welcome {margin:24px 24px 0;border-radius:26px;border:1px solid #12294b;box-shadow:0 5px 0 #d9b849}
@media(max-width:700px) { .vn-ops header h1 {white-space:normal;overflow:visible;font-size:17px} .vn-learner-welcome {margin:16px 12px 0;border-radius:22px} }

.vn-site .vn-surface {border:1px solid #c9c8bd;border-radius:20px;box-shadow:0 4px 0 #12294b18}
.vn-public-page .vn-surface {border-color:#b9bdbe;box-shadow:0 5px 0 #12294b1c}
.vn-auth-form>.vn-surface {border:1.5px solid #12294b;border-radius:24px;box-shadow:0 6px 0 #12294b}

/* Closing actions and footer controls use the same tactile button treatment. */
.vn-site .vn-button {align-items:center;justify-content:center;gap:8px;height:auto}
.vn-site .vn-social-button {width:44px;height:44px;border:1.5px solid #f4cc55;border-radius:10px;background:#fffdf5;color:#12294b;box-shadow:0 3px 0 #a98624;transition:transform .16s,box-shadow .16s,background .16s}
.vn-site .vn-social-button:hover {background:#f4cc55;transform:translateY(-2px);box-shadow:0 5px 0 #a98624}
.vn-site .vn-social-button:active {transform:translateY(2px);box-shadow:none}
.vn-footer-subscribe input {min-width:0;width:100%}
.vn-footer-subscribe input::placeholder {color:#626977;opacity:1}
.vn-footer-subscribe .vn-button {flex-shrink:0}
.vn-public-footer a.text-brand {color:#f4cc55}
@media(max-width:380px) {.vn-footer-subscribe {flex-wrap:wrap}.vn-footer-subscribe .vn-button {width:100%}}
@media(prefers-reduced-motion:reduce) {.vn-site .vn-social-button {transition:none;transform:none}}