/* Wayland Holding Group: shared styles for every page.
   Brand Standards v1.0 (locked 2026-09-21). Navy and blue values are the
   approved gradient stops; cyan #6EE8FF is highlight only. */
:root{
  color-scheme:light;
  --navy-1:#172635; --navy-2:#0E1C29; --navy-3:#08131D; --navy-ink:#07131E;
  --blue-1:#4FA0C7; --blue-2:#187EB5; --blue-3:#0B4D7C; --blue-4:#07365C;
  --cyan:#6EE8FF;
  --paper:#F8FAFC; --paper-2:#EEF2F6; --white:#fff;
  --ink:#0E1C29; --ink-soft:#44525F;
  --on-dark:#F8FAFC; --on-dark-soft:#A9B8C6;
  --rule:rgba(14,28,41,.12);
  --blue-rule:linear-gradient(90deg,var(--blue-1),var(--blue-2) 30%,var(--blue-3) 70%,var(--blue-4));
  --navy-bg:linear-gradient(160deg,var(--navy-1) 0%,var(--navy-2) 55%,var(--navy-3) 100%);
  --wrap:72rem;
  --gutter:clamp(1rem,5vw,3rem);
  --radius:10px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font:400 1.0625rem/1.65 "Noto Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto}
a{color:var(--blue-3)}
a:hover{color:var(--blue-4)}
:focus-visible{outline:2px solid var(--blue-2);outline-offset:3px;border-radius:2px}
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.narrow{max-width:46rem}
.skip{position:absolute;left:-999px;top:0;background:var(--paper);color:var(--ink);padding:.6rem 1rem;z-index:10}
.skip:focus{left:1rem;top:1rem}

/* Labels: Noto Sans Medium, uppercase only when short, tracked. */
.label{
  font-weight:500;font-size:.8125rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--blue-3);margin:0 0 1rem;
}
.mono{font-family:"Noto Sans Mono",ui-monospace,Menlo,monospace;font-weight:400}

/* ---------- Dark bands: header, hero, motto, footer ---------- */
.dark{
  color:var(--on-dark);
  background:
    radial-gradient(60rem 30rem at 85% -10%,rgba(24,126,181,.28),transparent 60%),
    var(--navy-bg);
}
.dark a{color:var(--on-dark)}
.dark .label{color:var(--on-dark-soft)}

.site-header .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 1.5rem;padding-block:1.4rem}
.brand{display:block;flex:none}
.brand img{width:clamp(96px,14vw,128px)}
.nav{display:flex;gap:clamp(.9rem,2.4vw,1.9rem);margin:0;padding:0;list-style:none}
.nav a{
  text-decoration:none;font-weight:500;font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--on-dark-soft);white-space:nowrap;
}
.nav a:hover,.nav a[aria-current="page"]{color:var(--on-dark)}
@media (max-width:760px){
  .nav{width:100%;overflow-x:auto;padding-bottom:.25rem;scrollbar-width:none}
  .nav::-webkit-scrollbar{display:none}
}

.hero .wrap{padding-block:clamp(4rem,12vw,8.5rem) clamp(4.5rem,12vw,9rem)}
.hero.compact .wrap{padding-block:clamp(3rem,8vw,5.5rem) clamp(3.5rem,8vw,6rem)}
.hero .label{display:flex;flex-wrap:wrap;gap:.35em .9em}
.hero .label span+span::before{content:"|";margin-right:.9em;color:var(--blue-1)}
.hero h1{
  margin:0;max-width:17ch;
  font-weight:700;font-size:clamp(2.25rem,6.2vw,4.25rem);line-height:1.08;letter-spacing:-.015em;
}
.hero.compact h1{font-size:clamp(2rem,5vw,3.25rem);max-width:20ch}
.hero .lede{margin:1.6rem 0 0;max-width:40rem;font-size:clamp(1.0625rem,1.8vw,1.25rem);color:var(--on-dark-soft)}
.stroke{display:block;width:4.5rem;height:4px;border-radius:2px;background:var(--blue-rule);margin:0 0 2rem;position:relative;overflow:hidden}
.stroke::after{content:"";position:absolute;inset:0;background:radial-gradient(1.4rem 100% at 30% 50%,rgba(110,232,255,.75),transparent)}
.actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2.4rem}
.btn{
  display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1.35rem;border-radius:6px;border:0;cursor:pointer;
  font:600 .9375rem/1.2 "Noto Sans",sans-serif;text-decoration:none;transition:background .15s,border-color .15s;
}
.btn-primary{background:var(--blue-2);color:#fff !important}
.btn-primary:hover{background:var(--blue-3)}
.btn-ghost{background:transparent;border:1px solid rgba(248,250,252,.28);color:var(--on-dark) !important}
.btn-ghost:hover{border-color:rgba(248,250,252,.6)}
.btn-quiet{background:transparent;border:1px solid var(--rule);color:var(--ink) !important;padding:.45rem .8rem;font-size:.8125rem}
.btn-quiet:hover{border-color:var(--blue-2)}

/* ---------- Light sections ---------- */
section{padding-block:clamp(4rem,10vw,7rem)}
section.tint{background:var(--paper-2)}
h2{margin:0 0 1rem;font-weight:600;font-size:clamp(1.75rem,3.6vw,2.5rem);line-height:1.15;letter-spacing:-.01em;max-width:26ch}
h3{font-weight:600}
.intro{max-width:42rem;color:var(--ink-soft);margin:0}

/* Numbered steps (Approach) */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:clamp(1.5rem,3vw,2.5rem);margin:3rem 0 0;padding:0;list-style:none}
.steps li{border-top:1px solid var(--rule);padding-top:1.5rem}
.steps .mono{font-size:.8125rem;color:var(--blue-3)}
.steps h3{margin:.4rem 0 .6rem;font-size:1.25rem}
.steps p{margin:0;color:var(--ink-soft)}

/* Cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:1.25rem;margin-top:3rem}
.card{
  background:var(--white);border:1px solid var(--rule);border-radius:var(--radius);padding:clamp(1.5rem,3vw,2.25rem);
  display:flex;flex-direction:column;gap:.9rem;position:relative;overflow:hidden;
}
.card::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--blue-rule)}
.card .mono{font-size:.75rem;color:var(--ink-soft);letter-spacing:.04em}
.card h3{margin:0;font-weight:700;font-size:1.75rem;letter-spacing:-.01em}
.card p{margin:0;color:var(--ink-soft)}
.card .more{margin-top:auto;padding-top:.6rem;font-weight:600;text-decoration:none}
.card .more:hover{text-decoration:underline}
.card.quiet{background:transparent;border-style:dashed}
.card.quiet::before{display:none}
.card.quiet h3{font-size:1.25rem;font-weight:600}
.card.feature{grid-column:span 2}
@media (max-width:760px){.card.feature{grid-column:auto}}

.brand-row{display:flex;align-items:center;gap:1rem}
.brand-row img{width:56px;height:56px;flex:none}
.facts{display:flex;flex-wrap:wrap;gap:.6rem 2rem;margin:.4rem 0 0;padding:1rem 0 0;border-top:1px solid var(--rule)}
.facts div{display:flex;flex-direction:column}
.facts dt{font-size:.75rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.facts dd{margin:0;font-weight:600}
.status{display:inline-flex;align-items:center;gap:.45rem}
.status::before{content:"";width:.5rem;height:.5rem;border-radius:50%;background:#1E9E6A}

/* Founder */
.founder{display:grid;grid-template-columns:minmax(0,16rem) minmax(0,1fr);gap:clamp(2rem,5vw,4rem);align-items:start}
@media (max-width:720px){.founder{grid-template-columns:1fr}.portrait{max-width:11rem}}
.portrait{
  aspect-ratio:4/5;border-radius:var(--radius);overflow:hidden;position:relative;max-width:16rem;
  background:
    radial-gradient(20rem 14rem at 80% 0%,rgba(24,126,181,.35),transparent 60%),
    var(--navy-bg);
  display:grid;place-items:center;color:var(--on-dark);
}
.portrait img{width:100%;height:100%;object-fit:cover}
.portrait .initials{font-weight:600;font-size:3.5rem;letter-spacing:.06em}
.portrait::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--blue-rule)}
.founder h3{margin:0;font-size:1.75rem;font-weight:700}
.founder .role{margin:.2rem 0 1.2rem;color:var(--blue-3);font-weight:500}
.founder p{margin:0 0 1rem;color:var(--ink-soft);max-width:40rem}
.founder .links{display:flex;flex-wrap:wrap;gap:1.25rem;margin-top:1.4rem;font-weight:600}

/* Letters */
.letter-card{
  display:grid;grid-template-columns:auto 1fr auto;gap:1.5rem;align-items:center;margin-top:2.5rem;
  background:var(--white);border:1px solid var(--rule);border-radius:var(--radius);padding:clamp(1.25rem,3vw,2rem);
  text-decoration:none;color:inherit;transition:border-color .15s;
}
.letter-card:hover{border-color:var(--blue-2);color:inherit}
.letter-card .no{font-family:"Noto Sans Mono",monospace;font-size:.8125rem;color:var(--blue-3);white-space:nowrap}
.letter-card h3{margin:0;font-size:1.3rem}
.letter-card p{margin:.2rem 0 0;color:var(--ink-soft);font-size:.9375rem}
.letter-card .arrow{font-weight:600;color:var(--blue-3)}
@media (max-width:600px){.letter-card{grid-template-columns:1fr}.letter-card .arrow{display:none}}

/* Long-form reading (letters, legal) */
.prose{max-width:40rem}
.prose h2{font-size:1.5rem;margin:2.6rem 0 .8rem}
.prose h3{font-size:1.125rem;margin:2rem 0 .5rem}
.prose p,.prose li{color:#27333F}
.prose p{margin:0 0 1.15rem}
.prose ul{padding-left:1.2rem;margin:0 0 1.15rem}
.prose li{margin-bottom:.4rem}
.prose .sign{margin-top:2.5rem;font-weight:600;color:var(--ink)}
.prose .sign span{display:block;font-weight:400;color:var(--ink-soft)}
.meta{color:var(--on-dark-soft);font-size:.9375rem;margin-top:1rem}

/* Contact routes */
.routes{display:grid;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr));gap:1.25rem;margin-top:2.5rem}
.route{border:1px solid var(--rule);border-radius:var(--radius);padding:clamp(1.5rem,3vw,2rem);background:var(--white)}
.route h3{margin:0 0 .4rem;font-size:1.25rem}
.route p{margin:0 0 1.2rem;color:var(--ink-soft)}
.route a{font-weight:600;font-size:1.0625rem}
.fineprint{margin:2rem 0 0;font-size:.8125rem;color:var(--ink-soft);max-width:48rem}

.motto{padding-block:clamp(3.5rem,8vw,5.5rem);text-align:center}
.motto p{
  margin:0 auto;max-width:40rem;font-weight:600;font-size:clamp(1.125rem,2.6vw,1.625rem);
  letter-spacing:.1em;text-transform:uppercase;line-height:1.4;
}
.motto .stroke{margin:0 auto 1.6rem}

/* ---------- Footer ---------- */
.site-footer .wrap{
  display:grid;grid-template-columns:auto 1fr;gap:1.5rem 3rem;align-items:center;
  padding-block:2.75rem;font-size:.875rem;color:var(--on-dark-soft);
}
.site-footer img{width:96px}
.site-footer p{margin:0}
.footer-links{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.5rem 1.5rem;margin:0;padding:0;list-style:none}
.footer-links a{color:var(--on-dark-soft) !important;text-decoration:none}
.footer-links a:hover{color:var(--on-dark) !important}
.site-footer .legal{grid-column:1/-1;border-top:1px solid rgba(248,250,252,.1);padding-top:1.5rem}
@media (max-width:600px){.site-footer .wrap{grid-template-columns:1fr}.footer-links{justify-content:flex-start}}