/* ---------------------------------------------------------------
   Base reset — replaces the Tailwind preflight the original build
   relied on. The page used no Tailwind utility classes, only this
   normalisation, so it is reproduced here directly.
   --------------------------------------------------------------- */
*, ::before, ::after { box-sizing: border-box; margin: 0; padding: 0; border: 0 solid; }
html { line-height: 1.5; -webkit-text-size-adjust: 100%; tab-size: 4; }
body { line-height: inherit; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
b, strong { font-weight: bolder; }
ul, ol, menu { list-style: none; }
summary { display: list-item; }
img, svg { display: block; vertical-align: middle; }
img { max-width: 100%; height: auto; }

/* ---------------------------------------------------------------
   Design tokens — ArchiVeris Design System.

   Colour, elevation, motion, spacing and font values below are the
   design system's verbatim. Type SIZES are deliberately kept as the
   literals this page already used: the design system rounds several
   of them together (its display-1 token is clamp(43px,5.4vw,82px)
   where this page uses both 42px and 43px minimums), and adopting
   them would shift rendering. Weights and families do come from the
   system — that is the change you can actually see, since Archivo
   renders the fractional weights (520/550/560/650/680) that Arial
   silently collapsed to normal or bold.

   The webfont is loaded via <link> in index.html rather than the
   system's @import, to avoid a render-blocking CSS waterfall.
   --------------------------------------------------------------- */
:root {
  /* Base palette */
  --navy: #071d45;
  --blue: #0e326c;
  --steel: #718096;
  --pale: #edf1f5;
  --ink: #09172e;
  --paper: #f7f8fa;

  /* Extended neutrals */
  --white: #ffffff;
  --navy-2: #0b244f;        /* services band */
  --ink-70: #4e5d72;        /* hero intro copy */
  --ink-60: #526178;        /* about body copy */
  --ink-55: #617087;        /* section body copy */
  --ink-50: #657389;        /* card body copy */
  --ink-45: #58677d;        /* eyebrow */
  --slate-45: #7c889a;      /* footer meta */
  --slate-40: #8290a4;      /* mono tags */
  --slate-35: #8995a7;      /* dropdown kicker */
  --line: #dce1e8;          /* header / dropdown borders */
  --line-soft: #eef1f4;     /* dropdown row divider */
  --line-2: #cdd4dd;        /* principles rules */
  --line-3: #ccd4df;        /* offering + about rules */
  --line-4: #e2e6eb;        /* in-card rule */
  --line-5: #d5dbe3;        /* footer rule */
  --hover-fill: #f4f6f8;    /* dropdown row hover */

  /* On-dark neutrals */
  --on-navy: #ffffff;
  --on-navy-70: #abb7c8;
  --on-navy-65: #aeb9c9;
  --on-navy-60: #9eabbd;
  --on-navy-55: #8f9caf;
  --on-navy-45: #8796aa;
  --on-navy-outline: #8f9cad;
  --rule-on-navy: rgba(255,255,255,.23);
  --rule-on-navy-strong: rgba(255,255,255,.25);
  --grid-on-navy: rgba(255,255,255,.28);
  --hover-on-navy: rgba(255,255,255,.035);

  /* Typography */
  --font-sans: "Archivo", Arial, Helvetica, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-display: 520;      /* services h2 */
  --weight-display-2: 560;    /* section + about h2 */
  --weight-display-3: 650;    /* partner name */
  --weight-display-4: 680;    /* hero h1 */
  --weight-bold: 700;
  --weight-black: 800;
  --tracking-hero: -.075em;
  --tracking-display: -.06em;
  --tracking-display-2: -.045em;
  --tracking-h3: -.04em;
  --tracking-tight: -.02em;
  --tracking-mono: .14em;
  --tracking-wide: .18em;
  --tracking-eyebrow: .2em;
  --leading-hero: .88;
  --leading-display: 1;
  --leading-display-loose: 1.16;
  --leading-body: 1.65;
  --leading-body-loose: 1.7;

  /* Spacing + measures */
  --gutter: clamp(25px, 7vw, 110px);
  --gutter-header: clamp(24px, 5vw, 80px);
  --gutter-hero: clamp(28px, 6vw, 100px);
  --section-y: clamp(90px, 10vw, 150px);
  --section-y-lg: clamp(90px, 11vw, 170px);
  --section-y-sm: clamp(85px, 9vw, 140px);
  --column-gap: 10vw;
  --header-height: 88px;
  --header-height-sm: 74px;
  --measure-body: 580px;
  --measure-lede: 610px;
  --measure-display: 1300px;

  /* Borders — the brand is square: no radius anywhere */
  --radius: 0;
  --border-accent-width: 4px;
  --blueprint-size: 48px;
  --blueprint-opacity: .14;

  /* Elevation — used exactly twice */
  --shadow-dropdown: 0 20px 50px rgba(7,29,69,.16);
  --shadow-signal: 0 32px 80px rgba(0,0,0,.3);
  --blur-header: blur(12px);
  --header-veil: rgba(247,248,250,.94);

  /* Motion */
  --duration: 200ms;
  --transition: all 200ms ease;
  --lift: translateY(-2px);
  --nudge: 18px;
}

/* ---------------------------------------------------------------
   Site styles
   --------------------------------------------------------------- */
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--font-sans); }
a { color: inherit; text-decoration: none; }

.site-header {
  height: var(--header-height); padding: 0 var(--gutter-header); display: flex; align-items: center;
  justify-content: space-between; background: var(--header-veil); border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 20; backdrop-filter: var(--blur-header);
}
/* Header logo: crops the full artwork down to the AV + ArchiVeris lockup,
   leaving out the surrounding padding and the tagline (too small to read
   at this size, and already set as text in the footer).
   Crop box within the 1817x866 source: x 140..1711, y 248..538. */
.wordmark { position: relative; display: block; overflow: hidden; height: 40px; aspect-ratio: 1571 / 290; }
.wordmark img { position: absolute; max-width: none; width: 115.66%; left: -8.91%; top: -85.52%; }
.mark { display: inline-flex; align-items: center; gap: 1px; color: var(--navy); font-size: 25px; font-weight: var(--weight-black); letter-spacing: -.22em; }
.mark span { color: var(--steel); transform: translateX(4px); }
nav { display: flex; align-items: center; gap: clamp(16px, 1.8vw, 30px); font-size: 12px; font-weight: var(--weight-bold); }
nav a:not(.nav-cta):hover { color: var(--steel); }
.nav-menu { position: relative; height: var(--header-height); display: flex; align-items: center; }
.nav-menu summary { list-style: none; cursor: pointer; white-space: nowrap; height: 100%; display: flex; align-items: center; gap: 6px; }
.nav-menu summary::-webkit-details-marker { display: none; }
.nav-menu summary span { color: var(--steel); font-size: 13px; transition: transform var(--duration); }
.nav-menu[open] summary span { transform: rotate(180deg); }
.nav-menu[open] summary, .nav-menu summary:hover { color: var(--steel); }
.dropdown { position: absolute; top: 76px; left: -22px; width: 360px; padding: 18px; background: var(--white); border: 1px solid var(--line); box-shadow: var(--shadow-dropdown); display: grid; z-index: 30; }
.dropdown > p { margin: 4px 10px 10px; color: var(--slate-35); font-size: 9px; text-transform: uppercase; letter-spacing: var(--tracking-wide); }
.dropdown a { position: relative; display: grid; gap: 5px; padding: 13px 10px; border-top: 1px solid var(--line-soft); color: var(--ink) !important; }
.dropdown a:hover { background: var(--hover-fill); }
.dropdown a strong { font-size: 13px; letter-spacing: -.01em; }
.dropdown a span { color: var(--steel); font-size: 11px; line-height: 1.45; font-weight: var(--weight-regular); }
.dropdown-feature { margin-top: 8px; background: var(--navy); color: var(--white) !important; grid-template-columns: 1fr auto; }
.dropdown-feature strong, .dropdown-feature span { grid-column: 1; color: inherit; }
.dropdown-feature > span:last-child { grid-column: 2; grid-row: 1 / 3; align-self: center; color: var(--white); font-size: 18px; }
.dropdown-feature:hover { background: var(--blue) !important; }
.compact-menu { width: 330px; }
.resources-menu .dropdown { left: auto; right: -30px; }
.login-link { white-space: nowrap; }
.login-link span { margin-left: 3px; }
.nav-cta { padding: 13px 18px; border: 1px solid var(--navy); border-radius: var(--radius); transition: var(--transition); }
.nav-cta:hover { color: var(--white); background: var(--navy); }

.hero { min-height: calc(100vh - var(--header-height)); display: grid; grid-template-columns: 48% 52%; overflow: hidden; }
.hero-copy { padding: clamp(70px, 9vw, 140px) var(--gutter-hero); display: flex; flex-direction: column; justify-content: center; }
.eyebrow, .section-label { text-transform: uppercase; letter-spacing: var(--tracking-eyebrow); font-size: 11px; font-weight: var(--weight-black); }
.eyebrow { display: flex; align-items: center; gap: 10px; color: var(--ink-45); }
.eyebrow span { width: 30px; height: 2px; background: var(--blue); }
h1 { margin: 30px 0; font-size: clamp(62px, 7.2vw, 116px); line-height: var(--leading-hero); letter-spacing: var(--tracking-hero); font-weight: var(--weight-display-4); }
h1 em { color: var(--steel); font-style: normal; font-weight: var(--weight-regular); }
.hero-intro { max-width: var(--measure-lede); margin: 0; color: var(--ink-70); font-size: clamp(17px, 1.35vw, 21px); line-height: var(--leading-body); }
.hero-actions { margin-top: 44px; display: flex; align-items: center; gap: 28px; }
.primary-button { padding: 17px 22px; background: var(--navy); color: var(--white); font-size: 13px; font-weight: var(--weight-bold); border-radius: var(--radius); transition: var(--transition); }
.primary-button span { margin-left: 20px; }
.primary-button:hover { background: var(--blue); transform: var(--lift); }
.text-link { font-size: 13px; font-weight: var(--weight-bold); border-bottom: 1px solid #8792a2; padding-bottom: 6px; }
.text-link span { margin-left: 8px; }

.hero-visual { min-height: 680px; position: relative; background: var(--navy); overflow: hidden; display: grid; place-items: center; }
.blueprint-grid { position: absolute; inset: 0; opacity: var(--blueprint-opacity); background-image: linear-gradient(var(--grid-on-navy) 1px, transparent 1px), linear-gradient(90deg, var(--grid-on-navy) 1px, transparent 1px); background-size: var(--blueprint-size) var(--blueprint-size); }
.signal-card { position: relative; z-index: 2; width: min(79%, 720px); background: var(--white); box-shadow: var(--shadow-signal); border: 1px solid rgba(255,255,255,.7); }
.logo-crop { aspect-ratio: 2.65 / 1; overflow: hidden; position: relative; }
.logo-crop img { position: absolute; width: 100%; height: auto; left: 0; top: 50%; transform: translateY(-50%); }
.axis { position: absolute; z-index: 1; color: rgba(255,255,255,.42); font-size: 9px; letter-spacing: var(--tracking-eyebrow); display: flex; align-items: center; gap: 12px; }
.axis i { display: block; background: rgba(255,255,255,.35); }
.axis-x { left: 5%; right: 5%; bottom: 9%; }
.axis-x i { height: 1px; flex: 1; }
.axis-y { left: 6%; top: 8%; bottom: 22%; flex-direction: column; }
.axis-y span { writing-mode: vertical-rl; }
.axis-y i { width: 1px; flex: 1; }
.coordinate { position: absolute; right: 6%; top: 8%; color: var(--white); opacity: .6; font: 10px var(--font-mono); letter-spacing: var(--tracking-wide); }

.manifesto { padding: var(--section-y-lg) var(--gutter); }
.section-label { color: var(--steel); }
.manifesto-line { font-size: clamp(30px, 4.4vw, 70px); line-height: var(--leading-display-loose); letter-spacing: var(--tracking-display-2); max-width: var(--measure-display); margin: 36px 0 90px; }
.manifesto-line strong { color: var(--blue); font-weight: var(--weight-medium); }
.principles { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line-2); }
.principles article { padding: 32px 38px 10px 0; border-right: 1px solid var(--line-2); }
.principles article + article { padding-left: 38px; }
.principles article:last-child { border: 0; }
.number { font: 11px var(--font-mono); color: var(--steel); }
.principles h2 { margin: 42px 0 18px; font-size: clamp(24px, 2.2vw, 36px); letter-spacing: var(--tracking-h3); }
.principles p { color: var(--ink-55); line-height: var(--leading-body); max-width: 390px; }

.offerings { padding: var(--section-y) var(--gutter); background: var(--white); }
.section-heading { display: grid; grid-template-columns: 1.1fr .7fr; gap: var(--column-gap); align-items: end; margin-bottom: 70px; }
.section-heading h2 { margin: 28px 0 0; font-size: clamp(42px, 5.4vw, 82px); line-height: .98; letter-spacing: var(--tracking-display); font-weight: var(--weight-display-2); }
.section-heading > p { color: var(--ink-55); line-height: var(--leading-body-loose); font-size: 17px; margin: 0 0 8px; }
.offering-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line-3); }
.offering-grid article { padding: 42px 42px 44px 0; border-right: 1px solid var(--line-3); }
.offering-grid article + article { padding-left: 42px; }
.offering-grid article:last-child { border-right: 0; }
.offering-tag { color: var(--slate-40); font: 10px var(--font-mono); letter-spacing: var(--tracking-mono); }
.offering-grid h3 { margin: 44px 0 20px; font-size: clamp(25px, 2.2vw, 34px); letter-spacing: var(--tracking-h3); }
.offering-grid p { color: var(--ink-50); line-height: var(--leading-body); min-height: 82px; }
.offering-grid ul { list-style: none; padding: 18px 0 0; margin: 24px 0 0; border-top: 1px solid var(--line-4); }
.offering-grid li { padding: 8px 0; font-size: 12px; font-weight: var(--weight-bold); }
.offering-grid li::before { content: "—"; margin-right: 10px; color: var(--steel); }
.platform-ribbon { margin-top: 54px; padding: 28px 30px; display: grid; grid-template-columns: .55fr 1.5fr auto; align-items: center; gap: 30px; background: var(--pale); border-left: var(--border-accent-width) solid var(--blue); }
.platform-kicker { font: 9px var(--font-mono); letter-spacing: var(--tracking-wide); color: var(--steel); }
.platform-ribbon strong { font-size: 16px; line-height: 1.5; }
.platform-action { font-size: 12px; font-weight: var(--weight-black); white-space: nowrap; }
.platform-action span { margin-left: 9px; }

.services { padding: var(--section-y) var(--gutter); background: var(--navy-2); color: var(--white); display: grid; grid-template-columns: .9fr 1.1fr; gap: var(--column-gap); }
.services-title h2 { margin: 30px 0; font-size: clamp(43px, 5.3vw, 78px); line-height: var(--leading-display); letter-spacing: var(--tracking-display); font-weight: var(--weight-display); }
.services-title > p:not(.section-label) { color: var(--on-navy-70); font-size: 17px; line-height: var(--leading-body-loose); max-width: 480px; }
.outline-button { display: inline-flex; margin-top: 30px; padding: 15px 18px; border: 1px solid var(--on-navy-outline); border-radius: var(--radius); font-size: 12px; font-weight: var(--weight-black); transition: var(--transition); }
.outline-button span { margin-left: 22px; }
.outline-button:hover { background: var(--white); color: var(--navy); }
.service-list { border-top: 1px solid var(--rule-on-navy); }
.service-list article { display: grid; grid-template-columns: 50px 1fr; gap: 10px; padding: 30px 0; border-bottom: 1px solid var(--rule-on-navy); }
.service-list article > span { color: var(--on-navy-45); font: 10px var(--font-mono); padding-top: 5px; }
.service-list h3 { margin: 0 0 12px; font-size: 23px; letter-spacing: -.03em; }
.service-list p { margin: 0; color: var(--on-navy-65); line-height: 1.6; max-width: var(--measure-body); font-size: 14px; }

.ecosystem { background: var(--navy); color: var(--white); padding: var(--section-y-sm) var(--gutter); display: grid; grid-template-columns: .85fr 1.4fr; gap: 8vw; }
.section-label.light { color: var(--on-navy-60); }
.ecosystem-intro h2 { font-size: clamp(42px, 5vw, 76px); line-height: 1.02; letter-spacing: -.055em; margin: 35px 0 30px; font-weight: 550; }
.ecosystem-intro > p:last-child { color: #abb6c6; line-height: var(--leading-body-loose); max-width: 450px; font-size: 17px; }
.partner-links { border-top: 1px solid var(--rule-on-navy-strong); }
.partner-links a { min-height: 170px; display: grid; grid-template-columns: 45px 1fr auto; align-items: center; gap: 18px; border-bottom: 1px solid var(--rule-on-navy-strong); transition: var(--transition); }
.partner-links a:hover { padding-left: var(--nudge); background: var(--hover-on-navy); }
.partner-index { font: 10px var(--font-mono); color: #8492a6; }
.partner-name { font-size: clamp(27px, 2.8vw, 46px); letter-spacing: var(--tracking-display-2); font-weight: var(--weight-display-3); }
.partner-name span { color: var(--on-navy-55); font-weight: var(--weight-regular); }
.partner-copy { color: var(--on-navy-60); font-size: 13px; max-width: 190px; line-height: 1.5; }
.partner-links a > span:last-of-type + span, .partner-links a > span[aria-hidden] { font-size: 25px; }

.about { padding: var(--section-y) var(--gutter); display: grid; grid-template-columns: 1.15fr .85fr; gap: var(--column-gap); background: var(--white); }
.about-statement h2 { margin: 34px 0 0; font-size: clamp(42px, 5.5vw, 82px); line-height: var(--leading-display); letter-spacing: var(--tracking-display); font-weight: var(--weight-display-2); }
.about-statement h2 span { color: var(--steel); font-weight: var(--weight-regular); }
.about-copy > p { color: var(--ink-60); font-size: 18px; line-height: var(--leading-body-loose); margin: 0 0 26px; }
.about-copy > p:first-child { color: var(--ink); font-size: 24px; letter-spacing: var(--tracking-tight); line-height: 1.5; }
.belief { margin-top: 52px; border-top: 1px solid var(--line-3); padding-top: 25px; display: grid; grid-template-columns: 100px 1fr; gap: 24px; }
.belief span { color: var(--steel); font: 9px var(--font-mono); letter-spacing: var(--tracking-mono); padding-top: 4px; }
.belief strong { line-height: 1.6; font-size: 14px; }

footer { padding: 70px var(--gutter); display: flex; justify-content: space-between; align-items: flex-end; border-top: 1px solid var(--line-5); }
.footer-brand { display: flex; gap: 28px; align-items: flex-start; }
.footer-brand .mark { font-size: 44px; }
.footer-brand p { margin: 0; text-transform: uppercase; letter-spacing: var(--tracking-wide); color: var(--steel); font-size: 10px; line-height: 1.8; }
.footer-meta { text-align: right; color: var(--slate-45); font-size: 11px; }
.footer-meta a { display: inline-block; color: var(--navy); font-size: 14px; font-weight: var(--weight-bold); margin-bottom: 22px; }

@media (max-width: 900px) {
  .nav-menu, .login-link { display: none; }
  .hero { grid-template-columns: 1fr; }
  .hero-copy { min-height: 680px; }
  .hero-visual { min-height: 540px; }
  .manifesto-line { margin-bottom: 60px; }
  .principles { grid-template-columns: 1fr; }
  .principles article, .principles article + article { padding: 30px 0; border-right: 0; border-bottom: 1px solid var(--line-2); }
  .principles h2 { margin-top: 24px; }
  .ecosystem { grid-template-columns: 1fr; }
  .section-heading, .services, .about { grid-template-columns: 1fr; }
  .offering-grid { grid-template-columns: 1fr; }
  .offering-grid article, .offering-grid article + article { padding: 32px 0; border-right: 0; border-bottom: 1px solid var(--line-3); }
  .offering-grid p { min-height: auto; }
  .platform-ribbon { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .site-header { height: var(--header-height-sm); }
  .wordmark { height: 31px; }
  .nav-cta { padding: 10px 12px; font-size: 11px; }
  .hero-copy { padding-top: 75px; min-height: 620px; }
  h1 { font-size: 61px; }
  .hero-actions { align-items: flex-start; flex-direction: column; }
  .hero-visual { min-height: 400px; }
  .signal-card { width: 88%; }
  .partner-links a { grid-template-columns: 30px 1fr auto; min-height: 145px; }
  .partner-copy { display: none; }
  footer { align-items: flex-start; flex-direction: column; gap: 55px; }
  .footer-meta { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
}