/* buildcontrol — Page-specific styles. */
/* hero + search */
.hc-hero{background:linear-gradient(155deg,#0E2E56 0%,#113967 45%,#1F58AE 100%);color:#fff;padding:24px 0 44px;position:relative;overflow:hidden}
.hc-hero:before{content:"";position:absolute;top:-90px;right:-50px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(45,107,200,.4),transparent 70%)}
.hc-hero:after{content:"";position:absolute;bottom:-110px;left:-60px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(16,201,208,.15),transparent 70%)}
.hc-dots{position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.08) 1px,transparent 1px);background-size:16px 16px;mask-image:linear-gradient(135deg,#000,transparent 65%);-webkit-mask-image:linear-gradient(135deg,#000,transparent 65%)}
.hc-hero .wrap{position:relative;z-index:1;max-width:640px;text-align:center;margin:0 auto}
.hc-hero h1{font-family:var(--f-header);font-weight:700;font-size:34px;line-height:1.15;letter-spacing:-.02em;margin:0 0 12px}
.hc-hero p{font-size:16px;color:#CDDCEF;margin:0 0 26px}
.hc-search{position:relative;max-width:540px;margin:0 auto}
.hc-search .si{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:20px;height:20px;stroke:#9AA3AD;fill:none;stroke-width:2}
.hc-search input{width:100%;height:56px;border:none;border-radius:14px;padding:0 20px 0 50px;font-family:inherit;font-size:15.5px;color:#212121;box-shadow:0 16px 40px rgba(11,32,60,.25);outline:none;box-sizing:border-box}

.hc-body{background:var(--screen-bg-alt);padding:0 0 72px;min-height:50vh}
/* the panel used to be pulled -56px into the hero. That works only when the
   first thing in it is a white card. On the category and article views the
   first thing is navy heading text, which landed on the navy hero and became
   unreadable, and collided with the breadcrumb. Sit below the hero instead. */
.hc-panel{max-width:960px;margin:30px auto 0;position:relative;z-index:2;padding:0 20px}

/* breadcrumb */
.hc-crumb{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--n-600,#5A6068);margin:0 2px 18px;flex-wrap:wrap}
.hc-crumb a{color:#1F58AE;text-decoration:none;font-weight:600}
.hc-crumb .sep{color:#C3CAD2}
.hc-crumb b{color:var(--navy-900,#0E2E56);font-weight:700}

/* category grid (home) */
.hc-lab{font-family:var(--f-header);font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--brand-600,#2D6BC8);margin:0 4px 16px}
.hc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:820px){.hc-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.hc-grid{grid-template-columns:1fr}}
.hc-folder{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--n-150,#E8EBEF);border-radius:14px;padding:18px;text-decoration:none;cursor:pointer;transition:transform .16s,box-shadow .16s,border-color .16s;text-align:left}
.hc-folder:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(17,57,103,.1);border-color:#CFE0F6}
.hc-folder .fi{width:46px;height:46px;border-radius:11px;flex:none;display:grid;place-items:center;background:#EAF1FB;color:#1F58AE}
.hc-folder .fi svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.hc-folder .ft{min-width:0}
.hc-folder .ft b{display:block;font-family:var(--f-header);font-weight:700;font-size:15px;color:var(--navy-900,#0E2E56);line-height:1.3}
.hc-folder .ft span{font-size:12.5px;color:var(--n-500,#9AA3AD)}

/* category view: article rows */
.hc-cathead{display:flex;align-items:center;gap:14px;margin:2px 2px 22px}
.hc-cathead .ci{width:52px;height:52px;border-radius:13px;flex:none;display:grid;place-items:center;background:#EAF1FB;color:#1F58AE}
.hc-cathead .ci svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.hc-cathead h2{font-family:var(--f-header);font-weight:700;font-size:26px;color:var(--navy-900,#0E2E56);margin:0;letter-spacing:-.015em}
.hc-arts{display:flex;flex-direction:column;gap:10px}
.hc-artrow{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--n-150,#E8EBEF);border-radius:12px;padding:17px 18px;text-decoration:none;cursor:pointer;transition:border-color .16s,transform .16s}
.hc-artrow:hover{border-color:#CFE0F6;transform:translateY(-2px)}
.hc-artrow .doc{width:20px;height:20px;flex:none;color:#1F58AE;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.hc-artrow span{flex:1;min-width:0;font-family:var(--f-header);font-weight:600;font-size:15px;color:var(--navy-900,#0E2E56)}
.hc-artrow .chev{width:18px;height:18px;color:#B9CDEA;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hc-empty{background:#fff;border:1px dashed var(--n-200,#D5D9DE);border-radius:12px;padding:22px;text-align:center;color:var(--n-500,#9AA3AD);font-size:14px}

/* article view */
.hc-art{max-width:760px}
.hc-art h1{font-family:var(--f-header);font-weight:700;font-size:29px;color:var(--navy-900,#0E2E56);margin:2px 0 6px;letter-spacing:-.02em}
.hc-updated{font-size:13px;color:#ED932B;font-weight:600;margin-bottom:26px}
.hc-step{margin-bottom:28px}
.hc-step .sh{display:flex;gap:11px;align-items:flex-start;margin-bottom:12px}
.hc-step .sn{width:26px;height:26px;border-radius:50%;flex:none;background:linear-gradient(180deg,#2D6BC8,#1F58AE);color:#fff;font-family:var(--f-header);font-weight:700;font-size:13px;display:grid;place-items:center}
.hc-step .st{font-size:15.5px;color:#2E333A;line-height:1.55;padding-top:2px}
.hc-shot{margin-left:37px;background:#F1F4F9;border:1px solid var(--n-150,#E8EBEF);border-radius:10px;min-height:150px;display:flex;align-items:center;justify-content:center;color:var(--n-400,#9AA3AD);font-size:13px;text-align:center;padding:20px}
.hc-artempty{background:#fff;border:1px dashed var(--n-200,#D5D9DE);border-radius:12px;padding:30px;text-align:center;color:var(--n-500,#9AA3AD);font-size:14.5px;line-height:1.6}

/* contact */
.hc-contact{max-width:960px;margin:36px auto 0;background:linear-gradient(160deg,#11396E,#1F58AE);border-radius:18px;padding:30px 34px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;position:relative;overflow:hidden}
.hc-contact:before{content:"";position:absolute;top:-50px;right:-30px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(16,201,208,.2),transparent 70%)}
.hc-contact .ct{position:relative;flex:1;min-width:220px}
.hc-contact h3{font-family:var(--f-header);font-weight:700;font-size:20px;color:#fff;margin:0 0 5px}
.hc-contact p{font-size:14px;color:#CDDCEF;margin:0}
.hc-contact a{position:relative;display:inline-flex;align-items:center;height:46px;padding:0 24px;border-radius:9px;background:#fff;color:#1F58AE;font-family:var(--f-header);font-weight:700;font-size:14px;text-decoration:none;white-space:nowrap}

.hc-none{display:none;text-align:center;padding:36px 20px;color:var(--n-500,#9AA3AD);font-size:15px}
.hc-none.on{display:block}
