/* ============================================================================
   NW Management theme — palette and landing-page styles adapted from the
   nw_homepage design (dark ink/navy, gold accent, warm paper, serif display).
   Loaded after bootstrap/app.css so its overrides win.
   ========================================================================== */

:root {
  --nw-ink: #071016;
  --nw-charcoal: #101922;
  --nw-navy: #172532;
  --nw-slate: #2e3b47;
  --nw-steel: #9ba7b1;
  --nw-mist: #edf1f3;
  --nw-paper: #f8f6f1;
  --nw-white: #ffffff;
  --nw-line: rgba(255, 255, 255, 0.16);
  --nw-line-dark: rgba(16, 25, 34, 0.14);
  --nw-accent: #b79358;
  --nw-accent-light: #d3ba82;
  --nw-accent-dark: #896b3d;
  --nw-shadow: 0 28px 80px rgba(0, 0, 0, 0.34);
  --nw-radius-xl: 30px;
  --nw-radius-lg: 22px;
  --nw-radius-md: 14px;
  --nw-max: 1180px;
}

body {
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--nw-charcoal);
  background: var(--nw-paper);
}

/* ---------------------------------------------------------------------------
   Authenticated app shell: paper content, serif headings, gold primary
   actions, navy table headers.
   ------------------------------------------------------------------------- */

article.content { background: var(--nw-paper); }

h1, h2 {
  font-family: "Libre Baskerville", Georgia, serif;
  letter-spacing: -0.02em;
  color: var(--nw-ink);
}

a { color: var(--nw-accent-dark); }
a:hover { color: var(--nw-ink); }

.btn-primary {
  background: linear-gradient(135deg, var(--nw-accent), var(--nw-accent-light));
  border-color: var(--nw-accent);
  color: #13100b;
  font-weight: 700;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
  background: linear-gradient(135deg, var(--nw-accent-dark), var(--nw-accent)) !important;
  border-color: var(--nw-accent-dark) !important;
  color: var(--nw-white) !important;
}

.table thead th {
  background: var(--nw-navy);
  color: var(--nw-white);
  border-color: var(--nw-slate);
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: rgba(16, 25, 34, 0.03);
}

.form-control:focus, .form-select:focus {
  border-color: var(--nw-accent);
  box-shadow: 0 0 0 4px rgba(183, 147, 88, 0.14);
}

/* ---------------------------------------------------------------------------
   Bootstrap accent components follow the NW palette EVERYWHERE (2026-08-13):
   the admin screens define the app's identity — gold actions, navy chips —
   and the investor portal, the registration wizard, and the fund subscription
   wizard render the same Bootstrap classes, so this one set of overrides
   keeps every view consistent. Without it, outline buttons, checkboxes,
   tabs, and badges stayed Bootstrap blue beside gold primaries.
   ------------------------------------------------------------------------- */

.btn-outline-primary {
  color: var(--nw-accent-dark);
  border-color: var(--nw-accent);
}
.btn-outline-primary:hover, .btn-outline-primary:focus,
.btn-outline-primary:active, .btn-outline-primary.active {
  background: linear-gradient(135deg, var(--nw-accent), var(--nw-accent-light)) !important;
  border-color: var(--nw-accent-dark) !important;
  color: #13100b !important;
}

.form-check-input:checked {
  background-color: var(--nw-accent);
  border-color: var(--nw-accent);
}
.form-check-input:focus {
  border-color: var(--nw-accent);
  box-shadow: 0 0 0 4px rgba(183, 147, 88, 0.14);
}

.badge.bg-primary, .badge.text-bg-primary {
  background-color: var(--nw-navy) !important;
  color: var(--nw-white);
}

.nav-tabs .nav-link { color: var(--nw-accent-dark); }
.nav-tabs .nav-link.active { color: var(--nw-ink); }
.nav-pills .nav-link.active {
  background: linear-gradient(135deg, var(--nw-accent), var(--nw-accent-light));
  color: #13100b;
}

.btn-link { color: var(--nw-accent-dark); }
.btn-link:hover { color: var(--nw-ink); }

/* ---------------------------------------------------------------------------
   Public pages (landing + account cards). Class names follow the design.
   ------------------------------------------------------------------------- */

.nw-public { line-height: 1.6; }
.nw-public img { max-width: 100%; display: block; }
.nw-public a { text-decoration: none; }

.shell { width: min(var(--nw-max), calc(100% - 40px)); margin: 0 auto; }

.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 50;
  background: linear-gradient(180deg, rgba(7, 16, 22, 0.92), rgba(7, 16, 22, 0.52));
  border-bottom: 1px solid var(--nw-line);
  backdrop-filter: blur(16px);
}
.nav-shell {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}
.brand-logo { width: 255px; height: auto; }
.primary-nav {
  display: flex;
  align-items: center;
  gap: 28px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.primary-nav a { color: inherit; transition: color 180ms ease; }
.primary-nav a:hover { color: var(--nw-white); }
.nav-login {
  padding: 11px 18px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 999px;
  color: var(--nw-white) !important;
}
.nav-toggle {
  display: none;
  width: 46px;
  height: 42px;
  border: 1px solid var(--nw-line);
  border-radius: 12px;
  background: transparent;
  cursor: pointer;
}
.nav-toggle span {
  display: block;
  width: 22px;
  height: 2px;
  margin: 5px auto;
  background: var(--nw-white);
}

.hero {
  position: relative;
  min-height: 780px;
  padding: 162px 0 96px;
  color: var(--nw-white);
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 20%, rgba(155, 167, 177, 0.26), transparent 34%),
    linear-gradient(135deg, #071016 0%, #101922 48%, #2e3b47 100%);
}
.hero-bg {
  position: absolute;
  inset: 0;
  opacity: 0.22;
  background:
    linear-gradient(110deg, rgba(7, 16, 22, 0.92) 0%, rgba(7, 16, 22, 0.64) 52%, rgba(7, 16, 22, 0.2) 100%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1600' height='900' viewBox='0 0 1600 900'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.42'%3E%3Cpath d='M50 750 L520 360 L760 520 L1200 190 L1560 430' stroke-width='2'/%3E%3Cpath d='M80 780 L520 420 L775 590 L1230 250 L1540 470' stroke-width='1'/%3E%3C/g%3E%3Cg fill='%23ffffff' fill-opacity='.08'%3E%3Crect x='920' y='270' width='380' height='430' rx='18'/%3E%3Crect x='1000' y='185' width='275' height='515' rx='14'/%3E%3Crect x='1080' y='330' width='350' height='370' rx='16'/%3E%3C/g%3E%3C/svg%3E") center/cover no-repeat;
}
.hero::after {
  content: "";
  position: absolute;
  right: -140px;
  top: 180px;
  width: 540px;
  height: 540px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 50%;
}
.hero-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) 430px;
  align-items: center;
  gap: 78px;
}
.eyebrow {
  margin: 0 0 14px;
  color: var(--nw-accent);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.nw-public h1, .nw-public h2, .nw-public h3 { line-height: 1.08; margin: 0; }
.nw-public h1 {
  max-width: 800px;
  font-size: clamp(2.6rem, 6vw, 5.4rem);
  color: var(--nw-white);
}
.nw-public h2 { font-size: clamp(2rem, 4vw, 3.4rem); }
.nw-public h3 { font-size: 1.1rem; font-family: Inter, system-ui, sans-serif; }
.hero-lede {
  max-width: 660px;
  margin: 28px 0 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: clamp(1.05rem, 1.4vw, 1.22rem);
}
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 38px; }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 22px;
  border-radius: 999px;
  font-weight: 800;
  border: 1px solid transparent;
  cursor: pointer;
  font: inherit;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
.button:hover { transform: translateY(-2px); }
.button-primary {
  background: linear-gradient(135deg, var(--nw-accent), #d3ba82);
  color: #13100b !important;
  box-shadow: 0 18px 42px rgba(183, 147, 88, 0.24);
}
.button-secondary, .button-outline {
  background: rgba(255, 255, 255, 0.08);
  color: var(--nw-white) !important;
  border-color: rgba(255, 255, 255, 0.24);
}
.button-outline { background: transparent; }
.button-full { width: 100%; border-radius: 14px; }

.login-card {
  color: var(--nw-charcoal);
  background: rgba(248, 246, 241, 0.96);
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-radius: var(--nw-radius-xl);
  box-shadow: var(--nw-shadow);
  padding: 34px;
  backdrop-filter: blur(22px);
}
.login-header h2 {
  color: var(--nw-ink);
  font-family: Inter, system-ui, sans-serif;
  font-size: 2rem;
  letter-spacing: -0.05em;
}
.login-header p:not(.eyebrow) { margin: 10px 0 0; color: #53606a; }
.investor-form { margin-top: 26px; }
.investor-form label:not(.check-label) {
  display: block;
  margin: 16px 0 7px;
  font-size: 0.86rem;
  font-weight: 800;
}
.investor-form input[type="text"],
.investor-form input[type="email"],
.investor-form input[type="password"] {
  width: 100%;
  height: 54px;
  padding: 0 15px;
  color: var(--nw-ink);
  background: var(--nw-white);
  border: 1px solid var(--nw-line-dark);
  border-radius: 14px;
  outline: none;
  font: inherit;
}
.investor-form input:focus {
  border-color: var(--nw-accent);
  box-shadow: 0 0 0 4px rgba(183, 147, 88, 0.14);
}
.form-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin: 18px 0 20px;
  font-size: 0.86rem;
}
.form-row a, .login-footer a { color: var(--nw-accent-dark); font-weight: 800; }
.check-label { display: inline-flex; align-items: center; gap: 8px; color: #53606a; }
.form-note { margin: 14px 0 0; color: #6a747c; font-size: 0.82rem; }
.form-error { margin: 14px 0 0; color: #a4373a; font-size: 0.88rem; font-weight: 600; }
.form-success { margin: 14px 0 0; color: #1d6f42; font-size: 0.88rem; font-weight: 600; }
.login-footer {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-top: 22px;
  padding-top: 22px;
  border-top: 1px solid var(--nw-line-dark);
  font-size: 0.9rem;
}
.button-link {
  background: none;
  border: none;
  padding: 0;
  color: var(--nw-accent-dark);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}
.button-link:hover { color: var(--nw-ink); }

.trust-strip { background: var(--nw-white); border-bottom: 1px solid var(--nw-line-dark); }
.trust-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-left: 1px solid var(--nw-line-dark);
  border-right: 1px solid var(--nw-line-dark);
}
.trust-grid > div { padding: 30px; border-right: 1px solid var(--nw-line-dark); }
.trust-grid > div:last-child { border-right: 0; }
.trust-grid strong { display: block; font-size: 1rem; color: var(--nw-ink); }
.trust-grid span { display: block; margin-top: 5px; color: #64707a; font-size: 0.92rem; }

.section { padding: 112px 0; }
.section-dark {
  color: var(--nw-white);
  background: linear-gradient(135deg, #071016, #172532 55%, #2e3b47);
}
.section-dark h2 { color: var(--nw-white); }
.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 34px;
  flex-wrap: wrap;
}
.property-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.property-card {
  min-height: 410px;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--nw-radius-xl);
  background: #18242f;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.24);
}
.property-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(7, 16, 22, 0.16), rgba(7, 16, 22, 0.9)), var(--card-art);
  background-size: cover;
  background-position: center;
  transform: scale(1.02);
  transition: transform 300ms ease;
}
.property-card:hover::before { transform: scale(1.08); }
.card-industrial { --card-art: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='520' viewBox='0 0 720 520'%3E%3Crect width='720' height='520' fill='%232e3b47'/%3E%3Cg fill='%239ba7b1' fill-opacity='.55'%3E%3Crect x='70' y='210' width='570' height='190'/%3E%3Crect x='120' y='170' width='170' height='70'/%3E%3Crect x='350' y='145' width='220' height='95'/%3E%3C/g%3E%3Cg stroke='%23ffffff' stroke-opacity='.33'%3E%3Cpath d='M90 405h550M110 250h500M160 250v150M270 250v150M390 250v150M510 250v150'/%3E%3C/g%3E%3C/svg%3E"); }
.card-office { --card-art: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='520' viewBox='0 0 720 520'%3E%3Crect width='720' height='520' fill='%23172532'/%3E%3Cg fill='%239ba7b1' fill-opacity='.5'%3E%3Crect x='210' y='90' width='290' height='350' rx='10'/%3E%3Crect x='120' y='210' width='470' height='230' rx='10'/%3E%3C/g%3E%3Cg fill='%23ffffff' fill-opacity='.22'%3E%3Crect x='250' y='130' width='44' height='42'/%3E%3Crect x='325' y='130' width='44' height='42'/%3E%3Crect x='400' y='130' width='44' height='42'/%3E%3Crect x='250' y='205' width='44' height='42'/%3E%3Crect x='325' y='205' width='44' height='42'/%3E%3Crect x='400' y='205' width='44' height='42'/%3E%3C/g%3E%3C/svg%3E"); }
.card-saleleaseback { --card-art: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='520' viewBox='0 0 720 520'%3E%3Crect width='720' height='520' fill='%23101922'/%3E%3Cg fill='none' stroke='%239ba7b1' stroke-width='4' stroke-opacity='.55'%3E%3Cpath d='M105 342h510'/%3E%3Cpath d='M145 342V178h430v164'/%3E%3Cpath d='M145 178l215-82 215 82'/%3E%3Cpath d='M252 342V232h94v110M410 342V232h94v110'/%3E%3C/g%3E%3Cg fill='%23b79358' fill-opacity='.34'%3E%3Ccircle cx='230' cy='145' r='58'/%3E%3Ccircle cx='500' cy='368' r='84'/%3E%3C/g%3E%3Cg fill='%23ffffff' fill-opacity='.2'%3E%3Crect x='254' y='234' width='90' height='106'/%3E%3Crect x='412' y='234' width='90' height='106'/%3E%3C/g%3E%3C/svg%3E"); }
.card-special { --card-art: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='520' viewBox='0 0 720 520'%3E%3Crect width='720' height='520' fill='%23071016'/%3E%3Cg fill='none' stroke='%239ba7b1' stroke-width='3' stroke-opacity='.54'%3E%3Cpath d='M70 380 C170 280 240 360 330 250 S520 160 650 250'/%3E%3Cpath d='M70 420 C210 300 290 410 410 260 S560 150 665 190'/%3E%3C/g%3E%3Cg fill='%23b79358' fill-opacity='.32'%3E%3Ccircle cx='180' cy='330' r='54'/%3E%3Ccircle cx='525' cy='205' r='82'/%3E%3C/g%3E%3C/svg%3E"); }
.card-content { position: absolute; inset: auto 0 0 0; padding: 28px; z-index: 1; }
.card-content span {
  color: var(--nw-accent);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.card-content h3 { margin-top: 8px; color: var(--nw-white); font-size: 1.34rem; }
.card-content p { margin: 11px 0 0; color: rgba(255, 255, 255, 0.76); }

.process-grid { display: grid; grid-template-columns: 0.78fr 1fr; gap: 70px; }
.timeline { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.timeline li {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 20px;
  padding: 26px;
  background: var(--nw-white);
  border: 1px solid var(--nw-line-dark);
  border-radius: var(--nw-radius-lg);
}
.timeline span {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--nw-white);
  background: var(--nw-navy);
  font-weight: 900;
}
.timeline h3 { color: var(--nw-ink); margin-top: 2px; }
.timeline p { margin: 8px 0 0; color: #64707a; }

.cta-band {
  padding: 70px 0;
  color: var(--nw-white);
  background: linear-gradient(135deg, var(--nw-navy), var(--nw-slate));
}
.cta-band h2 { color: var(--nw-white); }
.cta-grid { display: grid; grid-template-columns: 1fr auto; gap: 38px; align-items: center; }
.cta-grid p:not(.eyebrow) { color: rgba(255, 255, 255, 0.76); max-width: 680px; }
.cta-actions { display: flex; gap: 14px; flex-wrap: wrap; justify-content: flex-end; }

.site-footer { padding: 58px 0 24px; color: rgba(255, 255, 255, 0.72); background: var(--nw-ink); }
.footer-grid { display: grid; grid-template-columns: 1.5fr 0.7fr 0.7fr; gap: 50px; }
.footer-logo { width: 250px; margin-bottom: 16px; }
.site-footer h3 {
  margin-bottom: 14px;
  color: var(--nw-white);
  font-size: 0.92rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}
.site-footer a { display: block; margin-top: 9px; color: rgba(255, 255, 255, 0.72); }
.site-footer a:hover { color: var(--nw-white); }
.legal {
  margin-top: 44px;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 0.82rem;
}

/* Standalone account pages (sign-in, change password, access denied): the
   login card centered on the hero gradient. */
.auth-hero {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 40px 16px;
  background:
    radial-gradient(circle at 18% 20%, rgba(155, 167, 177, 0.26), transparent 34%),
    linear-gradient(135deg, #071016 0%, #101922 48%, #2e3b47 100%);
}
.auth-hero .login-card { width: min(460px, 100%); }
.auth-brand { display: block; width: 240px; margin: 0 auto 26px; }

@media (max-width: 1180px) {
  .property-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 980px) {
  .brand-logo { width: 210px; }
  .nav-toggle { display: block; }
  .primary-nav {
    position: absolute;
    top: 82px;
    left: 20px;
    right: 20px;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 14px;
    background: rgba(7, 16, 22, 0.96);
    border: 1px solid var(--nw-line);
    border-radius: 18px;
  }
  .primary-nav.open { display: flex; }
  .primary-nav a { padding: 14px; }
  .hero { padding-top: 135px; }
  .hero-grid, .process-grid, .cta-grid, .footer-grid { grid-template-columns: 1fr; }
  .hero-grid { gap: 44px; }
  .login-card { max-width: 520px; }
  .trust-grid, .property-grid { grid-template-columns: 1fr; }
  .trust-grid > div { border-right: 0; border-bottom: 1px solid var(--nw-line-dark); }
  .trust-grid > div:last-child { border-bottom: 0; }
  .cta-actions { justify-content: flex-start; }
}
@media (max-width: 560px) {
  .shell { width: min(100% - 28px, var(--nw-max)); }
  .hero { min-height: auto; padding-bottom: 56px; }
  .login-card { padding: 24px; border-radius: 22px; }
  .form-row, .login-footer { flex-direction: column; align-items: flex-start; }
  .section { padding: 72px 0; }
  .property-card { min-height: 340px; }
}

/* ---- Investor portal shared panel (promoted from Portal.razor.css scoped styles 2026-08-15) ----
   One style for every navy rounded section title bar — Portal, InvestorDocumentsSection,
   OnboardingSection, FundRegistrationOffer all read THIS rule. Scoped CSS could not reach the
   shared components, which is why "Investment opportunities" and "Fund documents" used to render
   with plain headers while "Quarterly statements" was navy. */
.portal-panel {
    border: 1px solid var(--nw-line-dark, rgba(16, 25, 34, 0.14));
    border-radius: var(--nw-radius-md, 14px);
    overflow: hidden;
}

.portal-panel .card-header {
    background: var(--nw-navy, #172532);
    color: var(--nw-white, #ffffff);
    font-weight: 700;
    letter-spacing: 0.02em;
}

/* ---- "Register your account" offer box (portal) -------------------------------------------- */

/* Step chips inside the offer box's navy header: numbered pills, the active one lifted to paper. */
.offer-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    list-style: none;
    padding: 0;
    margin: 0.6rem 0 0.2rem;
    counter-reset: offerstep;
}

.offer-steps li {
    counter-increment: offerstep;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.6rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.12);
    color: #dfe5ea;
    font-size: 0.78rem;
    font-weight: 600;
}

.offer-steps li::before {
    content: counter(offerstep) ".";
}

.offer-steps li.current {
    background: var(--nw-paper, #f8f6f1);
    color: var(--nw-ink, #071016);
}