/* Niskus VALOR — the front-door look (/start), shared by the client pages: registration, client sign-in, onboarding
   and VALOR Lite welcomes, and the Lite and portal dashboards. The same still photograph (illustrative) under an ink
   gradient, a gold eyebrow and a serif headline, white cards with a teal or gold top that rise into it, and the
   portal header in the front door's ink gradient. Served at /onboard/look.css (a style asset — no data). Prefix nk-. */
.nk-hero { position: relative; color: #fff; background-color: #10212B;
  background-image: linear-gradient(90deg, rgba(16, 33, 43, .92) 0%, rgba(16, 33, 43, .76) 38%, rgba(16, 33, 43, .14) 72%, rgba(16, 33, 43, 0) 100%), url('/img/front-plant-2000.jpg');
  background-size: cover; background-position: center 60%; min-height: clamp(250px, 26vw, 360px); display: flex; align-items: center; }
.nk-hero-in { width: 100%; max-width: 1160px; margin: 0 auto; padding: 30px 24px 66px; }
.nk-hero-in > * { max-width: 600px; }
.nk-eyebrow { font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #E6AD2B; margin: 0 0 8px; }
.nk-hero h1 { font-family: Georgia, 'Times New Roman', serif; font-size: 42px; line-height: 1.08; margin: 0 0 12px; font-weight: 700; color: #fff; }
.nk-lede { font-size: 16.5px; color: #E6EEEC; margin: 0; line-height: 1.55; }
/* the first block after the hero rises into it, as the front door's cards do */
.nk-main { padding-top: 0 !important; }
.nk-lift { position: relative; margin-top: -44px; }
.nk-lift.ow-flow li { background: #fff; box-shadow: 0 12px 30px rgba(16, 33, 43, .08); }
/* cards as on the front door: white, rounded, a coloured top */
.nk-card { background: #fff !important; border: 1px solid #E2DED2; border-radius: 18px !important; box-shadow: 0 12px 30px rgba(16, 33, 43, .06); }
.nk-teal { border-top: 5px solid #1F7A75 !important; } .nk-gold { border-top: 5px solid #E6AD2B !important; }
/* a strip of steps or flow boxes laid over the hero's edge */
.nk-strip { background: #fff; border: 1px solid #E2DED2; border-radius: 16px; padding: 12px 14px; box-shadow: 0 12px 30px rgba(16, 33, 43, .06); }

/* the dashboards' banners carry the same photograph */
.nk-photo { background-color: #10212B !important;
  background-image: linear-gradient(90deg, rgba(16, 33, 43, .95) 0%, rgba(16, 33, 43, .82) 45%, rgba(16, 33, 43, .42) 78%, rgba(16, 33, 43, .3) 100%), url('/img/front-plant-1100.jpg') !important;
  background-size: cover !important; background-position: center 60% !important; }

/* the portal header in the front door's ink gradient */
body.portal header.top { background: linear-gradient(150deg, #10212B, #163A39); }

@media (max-width: 760px) {
  .nk-hero { background-image: linear-gradient(180deg, rgba(16, 33, 43, .72) 0%, rgba(16, 33, 43, .9) 100%), url('/img/front-plant-1100.jpg'); min-height: 0; }
  .nk-hero-in { padding: 28px 16px 56px; }
  .nk-hero h1 { font-size: 30px; } .nk-lede { font-size: 15.5px; }
  .nk-lift { margin-top: -36px; }
  .nk-photo { background-image: linear-gradient(180deg, rgba(16, 33, 43, .86) 0%, rgba(16, 33, 43, .94) 100%), url('/img/front-plant-1100.jpg') !important; }
}
@media print { .nk-hero, .nk-photo { background-image: none !important; background-color: #10212B !important; } .nk-lift { margin-top: 0; } }
/* C8 — one blocked state (shared/blocked.js): what happened · what you can do · a way to a person */
.nk-blocked { border: 1px solid #E2DED2; border-left: 4px solid #B4452E; border-radius: 12px; background: #fff; padding: 12px 14px; margin: 12px 0; display: grid; gap: 6px; min-width: 0; color: #10212B; }
.nk-blocked[data-blocked="unverified"] { border-left-color: #E6AD2B; }
.nk-blocked p { margin: 0; display: grid; grid-template-columns: minmax(0, 150px) minmax(0, 1fr); gap: 2px 12px; font-size: 14px; line-height: 1.45; }
.nk-blocked p b { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: #4A5B5A; padding-top: 2px; }
.nk-blocked span { overflow-wrap: anywhere; }
.nk-blocked a { color: #155E5A; font-weight: 700; }
.nk-bl-btn { margin-left: 6px; min-height: 32px; padding: 4px 12px; border-radius: 8px; border: 1px solid #1F7A75; background: #fff; color: #155E5A; font-weight: 700; font-size: 13px; cursor: pointer; }
@media (max-width: 560px) { .nk-blocked p { grid-template-columns: minmax(0, 1fr); } }
