/**
 * iTrend Holding — Institutional Ledger production surface
 * Tokens: ./holding-tokens.css (--ih-*) · SSOT also docs/itrend-holding/design/holding-tokens-v1.css
 * Design law: ink/slate, pale-blue accent limited, radius ≤8px,
 * fine-rule grid, no pill CTAs, no charts, no decorative motion/gradients.
 * Mockup archive: sites/itrendholding/mockup/ (frozen after Wave 1B)
 */

/* -------------------------------------------------------------------------- */
/* Reset / base                                                                */
/* -------------------------------------------------------------------------- */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

.ih-body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--ih-font);
  font-size: var(--ih-fs-base);
  line-height: var(--ih-lh-body);
  color: var(--ih-text);
  background-color: var(--ih-bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.ih-mono {
  font-family: var(--ih-mono);
}

.ih-muted {
  color: var(--ih-muted);
}

.ih-br-wide {
  display: none;
}

@media (min-width: 640px) {
  .ih-br-wide {
    display: inline;
  }
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: var(--ih-accent);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

a:hover {
  color: var(--ih-accent-hover);
}

a:focus-visible,
button:focus-visible,
.ih-btn:focus-visible {
  outline: none;
  box-shadow: var(--ih-focus-ring);
}

/* -------------------------------------------------------------------------- */
/* Layout helpers                                                              */
/* -------------------------------------------------------------------------- */

.ih-wrap {
  width: min(100% - 2rem, var(--ih-wide));
  margin-inline: auto;
}

.ih-narrow {
  width: min(100% - 2rem, var(--ih-max));
  margin-inline: auto;
}

/* -------------------------------------------------------------------------- */
/* Skip link                                                                   */
/* -------------------------------------------------------------------------- */

.ih-skip {
  position: absolute;
  left: var(--ih-space-4);
  top: -3rem;
  z-index: 100;
  padding: var(--ih-space-2) var(--ih-space-3);
  background: var(--ih-surface);
  color: var(--ih-text);
  border: 1px solid var(--ih-border);
  border-radius: var(--ih-radius-sm);
  text-decoration: none;
  font-size: var(--ih-fs-sm);
}

.ih-skip:focus {
  top: var(--ih-space-4);
  color: var(--ih-text);
  box-shadow: var(--ih-focus-ring);
}

/* -------------------------------------------------------------------------- */
/* Mock banner (Wave 0 only — strip on promote)                                */
/* -------------------------------------------------------------------------- */

.ih-mock-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--ih-space-2) var(--ih-space-4);
  padding: var(--ih-space-2) var(--ih-space-4);
  background: var(--ih-bg-elevated);
  border-bottom: var(--ih-rule-strong);
  color: var(--ih-meta);
  font-size: var(--ih-fs-xs);
  letter-spacing: var(--ih-tracking-tight);
}

.ih-mock-banner .ih-mono {
  color: var(--ih-muted);
  letter-spacing: var(--ih-tracking-label);
  text-transform: uppercase;
}

/* -------------------------------------------------------------------------- */
/* Header                                                                      */
/* -------------------------------------------------------------------------- */

.ih-header {
  position: sticky;
  top: 0;
  z-index: 20;
  background: var(--ih-header-bg);
  border-bottom: var(--ih-rule-strong);
  backdrop-filter: blur(10px);
}

.ih-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ih-space-4);
  padding: var(--ih-space-3) 0;
  flex-wrap: wrap;
}

.ih-brand {
  display: flex;
  align-items: center;
  gap: var(--ih-space-3);
  color: var(--ih-text);
  text-decoration: none;
  min-width: 0;
}

.ih-brand:hover {
  color: var(--ih-text);
}

.ih-seal {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: var(--ih-radius);
}

.ih-seal-sm {
  width: 28px;
  height: 28px;
}

.ih-brand-text {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}

.ih-brand-name {
  font-weight: 600;
  font-size: var(--ih-fs-sm);
  letter-spacing: var(--ih-tracking-tight);
  line-height: var(--ih-lh-tight);
}

.ih-brand-meta {
  font-size: var(--ih-fs-xs);
  color: var(--ih-meta);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Nav — sparse; AI World secondary */
.ih-nav-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15rem 1.15rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.ih-nav-list a {
  color: var(--ih-muted);
  text-decoration: none;
  font-size: var(--ih-fs-sm);
  font-weight: 500;
}

.ih-nav-list a:hover {
  color: var(--ih-text);
}

.ih-nav-list a[aria-current="page"] {
  color: var(--ih-text);
  border-bottom: 1px solid var(--ih-border-strong);
  padding-bottom: 0.1rem;
}

.ih-nav-secondary a {
  color: var(--ih-meta);
  font-weight: 400;
  font-size: var(--ih-fs-xs);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ih-nav-secondary a:hover {
  color: var(--ih-muted);
}

/* -------------------------------------------------------------------------- */
/* Main / hero                                                                 */
/* -------------------------------------------------------------------------- */

main {
  padding-bottom: var(--ih-space-7);
}

.ih-hero {
  padding: var(--ih-space-7) 0 var(--ih-space-6);
}

.ih-kicker {
  margin: 0 0 var(--ih-space-4);
  font-size: var(--ih-fs-xs);
  letter-spacing: var(--ih-tracking-label);
  text-transform: uppercase;
  color: var(--ih-meta);
  /* Meta line — not accent pill */
}

.ih-hero h1 {
  margin: 0 0 var(--ih-space-5);
  font-size: var(--ih-fs-2xl);
  font-weight: 600;
  line-height: var(--ih-lh-tight);
  letter-spacing: -0.01em;
  color: var(--ih-text-strong);
}

.ih-lead {
  margin: 0 0 var(--ih-space-5);
  max-width: 38rem;
  font-size: var(--ih-fs-md);
  line-height: var(--ih-lh-loose);
  color: var(--ih-muted);
}

.ih-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ih-space-3);
}

/* -------------------------------------------------------------------------- */
/* Buttons — rectangular institutional (radius 4–8px; never pills)             */
/* -------------------------------------------------------------------------- */

.ih-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--ih-btn-pad-y) var(--ih-btn-pad-x);
  font-family: var(--ih-font);
  font-size: var(--ih-fs-sm);
  font-weight: 500;
  line-height: 1.2;
  text-decoration: none;
  border-radius: var(--ih-radius);
  border: 1px solid transparent;
  cursor: pointer;
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

.ih-btn-primary {
  background: var(--ih-accent);
  color: #0a1018;
  border-color: var(--ih-accent);
}

.ih-btn-primary:hover {
  background: var(--ih-accent-hover);
  border-color: var(--ih-accent-hover);
  color: #0a1018;
}

.ih-btn-primary:active {
  background: var(--ih-accent-active);
  border-color: var(--ih-accent-active);
}

.ih-btn-ghost {
  background: transparent;
  color: var(--ih-text);
  border-color: var(--ih-border);
}

.ih-btn-ghost:hover {
  background: var(--ih-surface);
  border-color: var(--ih-border-strong);
  color: var(--ih-text-strong);
}

/* -------------------------------------------------------------------------- */
/* Section labels                                                              */
/* -------------------------------------------------------------------------- */

.ih-section-label {
  margin: 0;
  font-size: var(--ih-fs-xs);
  font-weight: 500;
  letter-spacing: var(--ih-tracking-label);
  text-transform: uppercase;
  color: var(--ih-meta);
}

/* -------------------------------------------------------------------------- */
/* Entity register — fine-rule ledger strip                                    */
/* -------------------------------------------------------------------------- */

.ih-register {
  margin: 0 0 var(--ih-space-7);
  padding: var(--ih-space-6) 0;
  background: var(--ih-bg-elevated);
  border-block: var(--ih-rule-strong);
}

.ih-register-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--ih-space-2) var(--ih-space-4);
  margin-bottom: var(--ih-space-5);
  padding-bottom: var(--ih-space-3);
  border-bottom: var(--ih-rule);
}

.ih-register-note {
  margin: 0;
  font-size: var(--ih-fs-sm);
  color: var(--ih-meta);
}

.ih-register-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin: 0;
  padding: 0;
  border: var(--ih-rule-strong);
  border-radius: var(--ih-radius-lg);
  background: var(--ih-surface);
  overflow: hidden;
}

@media (min-width: 560px) {
  .ih-register-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.ih-register-cell {
  margin: 0;
  padding: var(--ih-space-4) var(--ih-space-5);
  border-bottom: var(--ih-rule);
  border-right: none;
}

@media (min-width: 560px) {
  .ih-register-cell {
    border-right: var(--ih-rule);
  }

  .ih-register-cell:nth-child(3n) {
    border-right: none;
  }

  .ih-register-cell:nth-last-child(-n + 3) {
    border-bottom: none;
  }
}

@media (max-width: 559px) {
  .ih-register-cell:last-child {
    border-bottom: none;
  }
}

.ih-register-cell dt {
  margin: 0 0 var(--ih-space-1);
  font-family: var(--ih-mono);
  font-size: var(--ih-fs-xs);
  font-weight: 400;
  letter-spacing: var(--ih-tracking-label);
  text-transform: uppercase;
  color: var(--ih-meta);
}

.ih-register-cell dd {
  margin: 0;
  font-size: var(--ih-fs-sm);
  font-weight: 500;
  color: var(--ih-text);
  line-height: var(--ih-lh-body);
}

/* -------------------------------------------------------------------------- */
/* Stewardship — numbered editorial register (not equal cards)                 */
/* -------------------------------------------------------------------------- */

.ih-stewardship {
  padding: var(--ih-space-6) 0 var(--ih-space-7);
}

.ih-stewardship h2 {
  margin: 0 0 var(--ih-space-5);
  font-size: var(--ih-fs-xl);
  font-weight: 600;
  line-height: var(--ih-lh-tight);
  color: var(--ih-text-strong);
}

.ih-stewardship-prose {
  margin-bottom: var(--ih-space-6);
}

.ih-stewardship-prose p {
  margin: 0 0 var(--ih-space-4);
  color: var(--ih-muted);
  max-width: 40rem;
}

.ih-stewardship-prose p:last-child {
  margin-bottom: 0;
}

.ih-stewardship-register {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: var(--ih-rule-strong);
}

.ih-stewardship-register > li {
  display: grid;
  grid-template-columns: 3rem 1fr;
  gap: var(--ih-space-4);
  padding: var(--ih-space-5) 0;
  border-bottom: var(--ih-rule);
  align-items: start;
}

.ih-register-index {
  font-size: var(--ih-fs-sm);
  font-weight: 500;
  color: var(--ih-meta);
  letter-spacing: 0.06em;
  padding-top: 0.15rem;
}

.ih-stewardship-register h3 {
  margin: 0 0 var(--ih-space-2);
  font-size: var(--ih-fs-md);
  font-weight: 600;
  color: var(--ih-text-strong);
}

.ih-stewardship-register p {
  margin: 0;
  font-size: var(--ih-fs-sm);
  color: var(--ih-muted);
  max-width: 36rem;
}

/* -------------------------------------------------------------------------- */
/* Portfolio reserved — single cell                                            */
/* -------------------------------------------------------------------------- */

/* Compact interests line — single row, not a reserved panel slab */
.ih-interests-line {
  margin-bottom: var(--ih-space-6);
  padding-block: var(--ih-space-3);
  border-top: var(--ih-rule);
  border-bottom: var(--ih-rule);
}

.ih-interests-compact {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem 0.5rem;
  font-size: var(--ih-fs-sm);
  color: var(--ih-muted);
  line-height: var(--ih-lh-body);
}

.ih-interests-compact .ih-mono {
  font-size: var(--ih-fs-xs);
  letter-spacing: var(--ih-tracking-label);
  text-transform: uppercase;
  color: var(--ih-meta);
}

.ih-interests-sep {
  color: var(--ih-border-strong);
  user-select: none;
}

/* -------------------------------------------------------------------------- */
/* Principles                                                                  */
/* -------------------------------------------------------------------------- */

.ih-principles {
  margin-bottom: var(--ih-space-7);
  padding-bottom: var(--ih-space-6);
  border-bottom: var(--ih-rule);
}

.ih-principles .ih-section-label {
  margin-bottom: var(--ih-space-5);
}

.ih-principles-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
}

.ih-principles-list li {
  display: grid;
  gap: var(--ih-space-1);
  padding: var(--ih-space-4) 0;
  border-top: var(--ih-rule);
}

.ih-principles-list li:last-child {
  border-bottom: var(--ih-rule);
}

.ih-principles-list strong {
  font-size: var(--ih-fs-sm);
  font-weight: 600;
  color: var(--ih-text-strong);
}

.ih-principles-list span {
  font-size: var(--ih-fs-sm);
  color: var(--ih-muted);
  line-height: var(--ih-lh-body);
}

@media (min-width: 720px) {
  .ih-principles-list {
    grid-template-columns: 1fr 1fr;
    column-gap: var(--ih-space-6);
  }

  .ih-principles-list li {
    border-top: none;
    border-bottom: var(--ih-rule);
    padding: var(--ih-space-4) 0;
  }

  .ih-principles-list li:nth-child(-n + 2) {
    border-top: var(--ih-rule);
  }
}

/* -------------------------------------------------------------------------- */
/* Ecosystem (AI World — secondary)                                            */
/* -------------------------------------------------------------------------- */

.ih-ecosystem {
  margin-bottom: var(--ih-space-7);
  padding: var(--ih-space-5);
  background: var(--ih-bg-elevated);
  border: var(--ih-rule);
  border-radius: var(--ih-radius-lg);
}

.ih-ecosystem .ih-section-label {
  margin-bottom: var(--ih-space-3);
}

.ih-ecosystem p {
  margin: 0;
  font-size: var(--ih-fs-sm);
  line-height: var(--ih-lh-body);
  max-width: 40rem;
}

.ih-ecosystem strong {
  font-weight: 600;
  color: var(--ih-text);
}

/* -------------------------------------------------------------------------- */
/* Correspondence                                                              */
/* -------------------------------------------------------------------------- */

.ih-correspondence {
  margin-bottom: var(--ih-space-7);
}

.ih-correspondence h2 {
  margin: 0 0 var(--ih-space-3);
  font-size: var(--ih-fs-lg);
  font-weight: 600;
  color: var(--ih-text-strong);
}

.ih-correspondence > .ih-muted {
  margin: 0 0 var(--ih-space-5);
  font-size: var(--ih-fs-sm);
  max-width: 36rem;
}

.ih-contact-dl {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  border: var(--ih-rule-strong);
  border-radius: var(--ih-radius-lg);
  overflow: hidden;
  background: var(--ih-surface);
}

.ih-contact-dl > div {
  display: grid;
  grid-template-columns: 8.5rem 1fr;
  gap: var(--ih-space-3);
  padding: var(--ih-space-4) var(--ih-space-5);
  border-bottom: var(--ih-rule);
  align-items: start;
}

.ih-contact-dl > div:last-child {
  border-bottom: none;
}

.ih-contact-dl dt {
  margin: 0;
  font-family: var(--ih-mono);
  font-size: var(--ih-fs-xs);
  letter-spacing: var(--ih-tracking-label);
  text-transform: uppercase;
  color: var(--ih-meta);
  padding-top: 0.15rem;
}

.ih-contact-dl dd {
  margin: 0;
  font-size: var(--ih-fs-sm);
  color: var(--ih-text);
  line-height: var(--ih-lh-body);
}

@media (max-width: 480px) {
  .ih-contact-dl > div {
    grid-template-columns: 1fr;
    gap: var(--ih-space-1);
  }
}

/* -------------------------------------------------------------------------- */
/* Footer                                                                      */
/* -------------------------------------------------------------------------- */

.ih-footer {
  border-top: var(--ih-rule-strong);
  background: var(--ih-bg-elevated);
  padding: var(--ih-space-6) 0 var(--ih-space-5);
}

.ih-footer-inner {
  display: grid;
  gap: var(--ih-space-5);
}

.ih-footer-brand {
  display: flex;
  align-items: center;
  gap: var(--ih-space-3);
  margin-bottom: var(--ih-space-2);
}

.ih-footer-brand strong {
  font-size: var(--ih-fs-sm);
  font-weight: 600;
  color: var(--ih-text-strong);
}

.ih-footer-meta {
  margin: 0;
  font-size: var(--ih-fs-xs);
  color: var(--ih-meta);
  line-height: var(--ih-lh-body);
}

.ih-footer-cols {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--ih-space-5);
}

@media (min-width: 560px) {
  .ih-footer-cols {
    grid-template-columns: 1fr 1fr;
  }
}

.ih-footer-cols > div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--ih-space-2);
}

.ih-footer-label {
  font-size: var(--ih-fs-xs);
  letter-spacing: var(--ih-tracking-label);
  text-transform: uppercase;
  color: var(--ih-meta);
  margin-bottom: var(--ih-space-1);
}

.ih-footer-cols a {
  font-size: var(--ih-fs-sm);
  color: var(--ih-muted);
  text-decoration: none;
}

.ih-footer-cols a:hover {
  color: var(--ih-accent);
}

.ih-legal-line {
  margin: var(--ih-space-2) 0 0;
  padding-top: var(--ih-space-4);
  border-top: var(--ih-rule);
  font-size: var(--ih-fs-xs);
  color: var(--ih-meta);
  line-height: var(--ih-lh-body);
  max-width: 52rem;
}

/* -------------------------------------------------------------------------- */
/* Print / reduced motion                                                      */
/* -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .ih-btn {
    transition: none;
  }
}

@media print {
  .ih-mock-banner,
  .ih-skip {
    display: none;
  }

  .ih-header {
    position: static;
    background: #fff;
  }

  .ih-body {
    background: #fff;
    color: #111;
  }
}

/* -------------------------------------------------------------------------- */
/* Production promote (Wave 1B) — no mock banner on live                      */
/* -------------------------------------------------------------------------- */

.ih-mock-banner {
  display: none !important;
}

/* Inner pages — page hero padding */
.ih-page-hero {
  padding: var(--ih-space-7) 0 var(--ih-space-5);
}

.ih-page-hero h1 {
  margin: 0 0 var(--ih-space-4);
  font-size: var(--ih-fs-2xl);
  font-weight: 600;
  line-height: var(--ih-lh-tight);
  color: var(--ih-text-strong);
}

.ih-prose {
  max-width: 40rem;
}

.ih-prose p {
  margin: 0 0 var(--ih-space-4);
  color: var(--ih-muted);
}

.ih-prose p:last-child {
  margin-bottom: 0;
}

.ih-list-clean {
  list-style: none;
  margin: 0 0 var(--ih-space-5);
  padding: 0;
  border-top: var(--ih-rule-strong);
}

.ih-list-clean li {
  padding: var(--ih-space-3) 0;
  border-bottom: var(--ih-rule);
  font-size: var(--ih-fs-sm);
  color: var(--ih-muted);
  line-height: var(--ih-lh-body);
}

.ih-list-clean strong {
  color: var(--ih-text-strong);
  font-weight: 600;
}

/* Contact form — institutional, not app chrome */
.ih-form {
  display: grid;
  gap: var(--ih-space-4);
  margin: var(--ih-space-5) 0;
  padding: var(--ih-space-5);
  border: var(--ih-rule-strong);
  border-radius: var(--ih-radius-lg);
  background: var(--ih-surface);
  max-width: 36rem;
}

.ih-form label {
  display: grid;
  gap: var(--ih-space-2);
  font-size: var(--ih-fs-sm);
  color: var(--ih-text);
}

.ih-form input,
.ih-form textarea {
  font-family: var(--ih-font);
  font-size: var(--ih-fs-sm);
  color: var(--ih-text);
  background: var(--ih-bg);
  border: 1px solid var(--ih-border);
  border-radius: var(--ih-radius-sm);
  padding: var(--ih-space-3);
}

.ih-form input:focus-visible,
.ih-form textarea:focus-visible {
  outline: none;
  box-shadow: var(--ih-focus-ring);
  border-color: var(--ih-accent-border);
}

.ih-form button[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  padding: var(--ih-btn-pad-y) var(--ih-btn-pad-x);
  font-family: var(--ih-font);
  font-size: var(--ih-fs-sm);
  font-weight: 500;
  color: #0a1018;
  background: var(--ih-accent);
  border: 1px solid var(--ih-accent);
  border-radius: var(--ih-radius);
  cursor: pointer;
}

.ih-form button[type="submit"]:hover {
  background: var(--ih-accent-hover);
  border-color: var(--ih-accent-hover);
}

.ih-form-note {
  margin: 0;
  font-size: var(--ih-fs-xs);
  color: var(--ih-meta);
  line-height: var(--ih-lh-body);
}