/* IndustU — the public site.
   Blueprint palette from ../brand/README.md. No build step, no framework:
   four static pages that have to be readable and load on a phone in a truck. */

:root{
  --navy:#0C1A2B;
  --navy-2:#122539;
  --steel:#2E8BF0;
  --sky:#7FD1F5;

  --ground:#F5F7FA;
  --panel:#FFFFFF;
  --ink:#16202D;
  --muted:#586573;
  --rule:#DDE4EC;
  --link:#1A6BC4;
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#0A0F16;
    --panel:#121A25;
    --ink:#E6ECF3;
    --muted:#96A3B2;
    --rule:#212C3A;
    --link:#7CB8F5;
  }
}
:root[data-theme="dark"]{
  --ground:#0A0F16;
  --panel:#121A25;
  --ink:#E6ECF3;
  --muted:#96A3B2;
  --rule:#212C3A;
  --link:#7CB8F5;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{-webkit-text-size-adjust:100%;}
body{
  background:var(--ground);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:17px;
  line-height:1.65;
}
img{max-width:100%;}

a{color:var(--link);}
a:focus-visible, button:focus-visible{outline:3px solid var(--steel); outline-offset:2px;}

/* ---- header ---- */
header.site{
  background:var(--navy);
  border-bottom:3px solid var(--steel);
  padding:0 20px;
}
header.site .inner{
  max-width:940px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; flex-wrap:wrap; padding:14px 0;
}
header.site a.brand{display:flex; align-items:center; gap:11px; text-decoration:none;}
header.site img{width:40px; height:40px; display:block; border-radius:9px;}
header.site .name{color:#fff; font-weight:800; font-size:1.12rem; letter-spacing:.2px;}
header.site .dba{display:block; color:var(--sky); font-size:.68rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase;}
header.site nav{display:flex; gap:18px; flex-wrap:wrap;}
header.site nav a{color:#CFE0F2; text-decoration:none; font-size:.92rem; font-weight:600;}
header.site nav a:hover, header.site nav a[aria-current="page"]{color:#fff; text-decoration:underline;}

/* ---- layout ---- */
main{max-width:760px; margin:0 auto; padding:0 20px 72px;}
main.wide{max-width:940px;}

.hero{
  background:var(--navy-2);
  color:#EAF2FB;
  padding:52px 20px 56px;
  border-bottom:1px solid var(--rule);
}
.hero .inner{max-width:760px; margin:0 auto;}
.hero h1{font-size:clamp(1.85rem,5.2vw,2.6rem); line-height:1.12; font-weight:800;
  letter-spacing:-.02em; text-wrap:balance;}
.hero p{margin-top:14px; font-size:1.08rem; color:#B9CDE2; max-width:56ch;}
.hero .entity{margin-top:22px; font-size:.86rem; color:#8FA8C2;}

h2{font-size:1.35rem; font-weight:800; letter-spacing:-.01em; margin:40px 0 10px; text-wrap:balance;}
h3{font-size:1.06rem; font-weight:700; margin:26px 0 6px;}
p{margin:12px 0;}
ul, ol{margin:12px 0 12px 22px;}
li{margin:6px 0;}
strong{font-weight:700;}

.lead{font-size:1.06rem; color:var(--muted);}
.muted{color:var(--muted);}
.small{font-size:.9rem;}

.updated{
  margin-top:26px; padding:10px 14px;
  background:var(--panel); border:1px solid var(--rule); border-radius:10px;
  font-size:.87rem; color:var(--muted);
}

.card{
  background:var(--panel); border:1px solid var(--rule); border-radius:14px;
  padding:18px 20px; margin:18px 0;
}
.card h3{margin-top:0;}

.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; margin:20px 0;}

table{width:100%; border-collapse:collapse; margin:16px 0; font-size:.94rem;}
th, td{text-align:left; padding:10px 12px; border-bottom:1px solid var(--rule); vertical-align:top;}
th{font-weight:700; color:var(--muted); font-size:.82rem; text-transform:uppercase; letter-spacing:.06em;}
.tablewrap{overflow-x:auto;}

.btn{
  display:inline-block; background:var(--steel); color:#fff; text-decoration:none;
  font-weight:700; padding:13px 22px; border-radius:11px; margin-top:8px;
}
.btn:hover{background:#1F79DC;}

/* ---- footer ---- */
footer.site{
  background:var(--navy); color:#9FB6CD;
  padding:30px 20px 40px; font-size:.9rem;
}
footer.site .inner{max-width:940px; margin:0 auto;
  display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap;}
footer.site a{color:#CFE0F2;}
footer.site nav{display:flex; gap:18px; flex-wrap:wrap;}
footer.site .legal{max-width:44ch; line-height:1.55;}

/* a skip link, because legal pages get read by screen readers more than most */
.skip{position:absolute; left:-9999px;}
.skip:focus{left:12px; top:12px; position:fixed; background:#fff; color:#000;
  padding:10px 14px; border-radius:8px; z-index:99;}
