*{box-sizing:border-box}
:root{
  --cadnet-navy:#1a3a67;
  --cadnet-blue:#b1cad7;
  --cadnet-blue-deep:#8eafbf;
  --title-gray:#000000;
  --ink:#666666;
  --white:#ffffff;
  --surface-gradient:linear-gradient(108deg,#ffffff 42%,rgba(177,202,215,.17) 60%,rgba(177,202,215,.24) 90%);
}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--white);
  color:var(--ink);
  font-family:Helvetica,Arial,sans-serif;
  font-size:16px;
  line-height:1.5
}
a{
  color:var(--cadnet-navy);
  transition:color .18s ease,background-color .18s ease,border-color .18s ease,transform .18s ease
}
a:hover{color:var(--cadnet-blue)}
::selection{background:var(--cadnet-blue);color:var(--cadnet-navy)}

.dev-banner{
  border-bottom:1px solid var(--cadnet-navy);
  background:var(--surface-gradient);
  color:var(--cadnet-navy);
  padding:9px 24px;
  text-align:center;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em
}

.site-header{
  min-height:72px;
  border-bottom:1px solid var(--cadnet-navy);
  padding:0 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  position:sticky;
  top:0;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(8px);
  z-index:10
}
.brand{
  text-decoration:none;
  display:flex;
  align-items:center;
  gap:11px;
  flex:0 0 auto
}
.brand-bear{display:block;width:40px;height:34px;object-fit:contain}
.brand-wordmark{display:block;width:132px;height:auto}

nav{display:flex;gap:24px;flex-wrap:wrap}
nav a,.footer-links a{
  color:var(--cadnet-navy);
  text-decoration:none;
  font-weight:400
}
nav a:hover,.footer-links a:hover{
  color:var(--cadnet-blue);
  text-decoration:none
}

main,.site-footer{width:min(1180px,calc(100% - 64px));margin:0 auto}
main{position:relative;isolation:isolate}


.hero{
  min-height:auto;
  padding:72px 0 60px;
  display:block
}
.hero-copy{
  min-width:0
}
.hero-copy>p,.hero-copy>h1,.hero-copy>.actions{max-width:790px}
.hero-bill{
  display:none
}

.eyebrow,.label{
  display:block;
  margin:0 0 12px;
  color:var(--cadnet-navy);
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase
}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{color:#000000}
strong,dt,.step{color:var(--cadnet-navy)}
h1{
  margin-bottom:30px;
  font-size:clamp(52px,8vw,104px);
  line-height:.94;
  letter-spacing:-.055em;
  font-weight:700
}
h2{
  margin-bottom:24px;
  font-size:clamp(34px,5vw,64px);
  line-height:1;
  letter-spacing:-.045em;
  font-weight:700
}
h3{margin-bottom:8px;font-size:20px;line-height:1.15}
.lead{
  max-width:720px!important;
  color:#666666;
  font-size:17px;
  line-height:1.35
}

.actions{display:flex;gap:12px;margin-top:36px;flex-wrap:wrap}
.button{
  display:inline-block;
  border:1px solid var(--cadnet-navy);
  padding:12px 18px;
  text-decoration:none;
  font-weight:700;
  color:var(--cadnet-navy);
  background:var(--white)
}
.button.primary{
  background:var(--cadnet-navy);
  border-color:var(--cadnet-navy);
  color:var(--white)
}
.button:hover,
.button.primary:hover{
  background:var(--cadnet-blue);
  border-color:transparent;
  color:var(--white);
  text-decoration:none
}

.facts,.data-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--cadnet-navy);
  border-left:1px solid var(--cadnet-navy);
  background-image:url("../img/row-texture.png"),var(--surface-gradient);
  background-position:bottom right,center;
  background-size:contain,auto;
  background-repeat:no-repeat,no-repeat;
}
.fact,.data-grid>div{
  padding:22px 20px;
  border-right:1px solid var(--cadnet-navy);
  border-bottom:1px solid var(--cadnet-navy);
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:22px;
  background:transparent
}
.fact strong,.data-grid strong{
  color:var(--cadnet-navy);
  font-size:22px;
  line-height:1.1
}
.data-grid strong{font-variant-numeric:tabular-nums}
.meta{
  display:block;
  margin-top:10px;
  color:#555;
  font-size:12.5px;
  line-height:1.3
}

.section{
  padding:96px 0;
  border-bottom:0;
  position:relative
}
.section::after{
  content:"";
  position:absolute;
  left:calc((100vw - 100%) / -2);
  right:calc((100vw - 100%) / -2);
  bottom:0;
  height:1px;
  background:var(--cadnet-navy);
  pointer-events:none
}
.section>p{max-width:820px;color:#666666;font-size:17px}
.section-heading{max-width:900px}
.data-grid{
  margin-top:48px
}
.note{margin-top:24px;color:#444!important;font-size:14px!important}

.process{
  padding:0;
  margin:48px 0 0;
  list-style:none;
  border-top:1px solid var(--cadnet-navy)
}
.process li{
  display:grid;
  grid-template-columns:100px 1fr;
  gap:24px;
  padding:28px 0;
  border-bottom:1px solid var(--cadnet-navy)
}
.step{font-weight:700}
.process p{margin:0;max-width:760px;color:#666666;font-size:17px}

.technical{margin:40px 0 0;border-top:1px solid var(--cadnet-navy)}
.technical>div{
  display:grid;
  grid-template-columns:220px 1fr;
  gap:20px;
  padding:20px 0;
  border-bottom:1px solid var(--cadnet-navy)
}
.technical dt{color:var(--cadnet-navy);font-weight:700}
.technical dd{margin:0;color:#666666;overflow-wrap:anywhere}
code{font-family:"Courier New",Courier,monospace;font-size:.92em;color:var(--ink)}

.site-footer{
  padding:56px 0 80px;
  display:grid;
  grid-template-columns:1.2fr 1fr 1.6fr;
  gap:48px
}
.site-footer p{margin-bottom:8px;color:#666666}
.footer-cadnet-logo{display:block;width:138px;height:auto;margin-bottom:14px}
.footer-links{display:flex;flex-direction:column;gap:8px}
.legal{font-size:13px}
.standard-software-logo{
  display:block;
  width:54px;
  height:54px;
  object-fit:contain;
  margin-bottom:16px
}
.data-error{font-size:17px!important}

@media (min-width:1101px){
  .hero{
    min-height:560px;
    padding:100px 0 80px;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    column-gap:32px;
    align-items:stretch;
  }

  .hero-copy{
    grid-column:1 / span 3;
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-width:0;
  }

  .hero-bill{
    display:block;
    grid-column:4 / span 1;
    min-height:100%;
    background-image:url("../img/CADNET-bill.png");
    background-position:center center;
    background-size:contain;
    background-repeat:no-repeat;
  }
}

.fact .label,.data-grid .label{margin-bottom:8px}
.fact strong,.data-grid strong{margin-top:auto}

main > .section:nth-of-type(even){
  background:transparent
}

main > .section:nth-of-type(even)::before{
  content:"";
  position:absolute;
  inset:0 calc((100vw - 100%) / -2);
  z-index:-1;
  background-image:url("../img/row-texture.png"),var(--surface-gradient);
  background-position:bottom right,center;
  background-size:contain,auto;
  background-repeat:no-repeat,no-repeat;
  pointer-events:none;
}

@media (max-width:1100px){
  .hero{
    min-height:auto;
    padding:72px 0 60px;
    display:block;
  }

  .hero-copy{
    display:block;
    grid-column:auto;
  }

  .hero-bill{
    display:none!important;
  }

  .facts,.data-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .process li,.technical>div,.site-footer{
    grid-template-columns:1fr;
  }

  .process li{
    gap:8px;
  }

  .section{
    padding:72px 0;
  }
}

@media (max-width:800px){
  .site-header{
    padding:16px 20px;
    align-items:flex-start;
    flex-direction:column;
    gap:14px;
    position:static;
  }

  nav{
    gap:12px 18px;
  }

  main,.site-footer{
    width:min(100% - 40px,1180px);
  }

  .fact,.data-grid>div{
    gap:16px;
    padding:18px;
  }
}

@media (max-width:480px){
  .facts,.data-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  h1{
    font-size:49px;
  }

  .brand-wordmark{
    width:120px;
  }
}
