@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&family=IBM+Plex+Mono:wght@400;500&display=swap');

/* Archanda AG — a precise transaction escrow identity. */

:root{
  /* ---- Archanda AG palette ---- */
  --sky:           #87CEEB;
  --sea:           #006994;
  --deep:          #003B5C;
  --white:         #FFFFFF;
  --ink:           #003B5C;
  --ink-soft:      #064968;
  --paper:         #FFFFFF;
  --paper-alt:     #EFF8FC;
  --paper-white:   #FFFFFF;
  --seal:          #006994;
  --seal-dark:     #00577B;
  --rust:          #A7463A;
  --rust-dark:     #85372F;
  --brass:         #87CEEB;
  --line:          #B7D3E0;
  --line-soft:     rgba(0,59,92,0.18);
  --line-on-dark:  rgba(255,255,255,0.2);
  --muted:         #557284;
  --muted-on-dark: #B7D2DF;

  /* status */
  --status-pending:  #9A6A20;
  --status-secured:  #006994;
  --status-confirmed:#006994;
  --status-dispute:  #A7463A;
  --status-released: #006994;

  /* ---- Type ---- */
  --font-display: "Manrope", "Avenir Next", sans-serif;
  --font-body:    "DM Sans", "Avenir Next", sans-serif;
  --font-mono:    "IBM Plex Mono", "SF Mono", Menlo, monospace;

  --step--1: clamp(0.82rem, 0.8rem + 0.1vw, 0.9rem);
  --step-0:  clamp(1rem, 0.95rem + 0.2vw, 1.05rem);
  --step-1:  clamp(1.2rem, 1.1rem + 0.4vw, 1.35rem);
  --step-2:  clamp(1.5rem, 1.3rem + 0.8vw, 1.85rem);
  --step-3:  clamp(2rem, 1.6rem + 1.6vw, 2.75rem);
  --step-4:  clamp(2.6rem, 2rem + 2.8vw, 4rem);
  --step-5:  clamp(3.4rem, 2.4rem + 4.5vw, 5.6rem);

  /* ---- Spacing (8px base) ---- */
  --sp-1: 0.5rem;
  --sp-2: 0.75rem;
  --sp-3: 1rem;
  --sp-4: 1.5rem;
  --sp-5: 2rem;
  --sp-6: 3rem;
  --sp-7: 4.5rem;
  --sp-8: 6.5rem;

  --radius: 3px; /* flat: almost square, just enough to soften ink edges */
  --maxw: 1240px;
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  font-family: var(--font-body);
  background: var(--paper);
  color: var(--ink);
  font-size: var(--step-0);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
button{ font-family: inherit; cursor:pointer; }
h1,h2,h3,h4{ font-family: var(--font-display); margin:0; font-weight:600; letter-spacing:-0.01em; }
p{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }
input,select,textarea{ font-family: inherit; font-size: 1rem; }

.wrap{ max-width: var(--maxw); margin:0 auto; padding: 0 var(--sp-5); }
@media (max-width: 640px){ .wrap{ padding: 0 var(--sp-4); } }

:focus-visible{ outline: 2px solid var(--sea); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}

.mono{ font-family: var(--font-mono); letter-spacing: 0.01em; }
.eyebrow{
  font-family: var(--font-mono);
  font-size: var(--step--1);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--seal);
}
.visually-hidden{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
