@font-face{
    font-family:'Gill Sans';
    src:url(../fonts/gillsans-regular.ttf) format('truetype');
    font-weight:400; font-style:normal; font-display:swap;
  }

@font-face{
    font-family:'Gill Sans';
    src:url(../fonts/gillsans-bold.ttf) format('truetype');
    font-weight:700; font-style:normal; font-display:swap;
  }

@font-face{
    font-family:'Gill Sans';
    src:url(../fonts/gillsans-italic.ttf) format('truetype');
    font-weight:400; font-style:italic; font-display:swap;
  }

@font-face{
    font-family:'Gill Sans';
    src:url(../fonts/gillsans-bolditalic.ttf) format('truetype');
    font-weight:700; font-style:italic; font-display:swap;
  }

@font-face{
    font-family:'Gill Sans Condensed';
    src:url(../fonts/gillsans-condensed-regular.ttf) format('truetype');
    font-weight:400; font-style:normal; font-display:swap;
  }

@font-face{
    font-family:'Gill Sans Condensed';
    src:url(../fonts/gillsans-condensed-bold.ttf) format('truetype');
    font-weight:700; font-style:normal; font-display:swap;
  }

:root{
    --paper:#f5f1e6;
    --surface:rgb(250,250,246);
    --ink:#20281f;
    --ink-soft:#54604f;
    --line:#ddd3ba;
    --line-strong:#c7bb9c;
    --red:#ad3d2c;
    --red-soft:#f2ddd4;
    --green:#3a6a4c;
    --green-soft:#dbe8dd;
    --accent:#9c6a26;
    --focus:#2f6f8f;
    --tagline:#a19c8c;
    --bar-height:2.9rem;
    --bg-tile:url(../images/paper-tile.png);
    color-scheme: light;
  }

@media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --paper:#181d17;
      --surface:#20261e;
      --ink:#eae4d3;
      --ink-soft:#b3bcac;
      --line:#38402f;
      --line-strong:#4a5240;
      --red:#dd7a67;
      --red-soft:#3a2420;
      --green:#7fbb95;
      --green-soft:#20302a;
      --accent:#dba85a;
      --focus:#7ec7ea;
      --tagline:#818a7c;
      color-scheme: dark;
    }
  }

:root[data-theme="dark"]{
    --paper:#181d17;
    --surface:#20261e;
    --ink:#eae4d3;
    --ink-soft:#b3bcac;
    --line:#38402f;
    --line-strong:#4a5240;
    --red:#dd7a67;
    --red-soft:#3a2420;
    --green:#7fbb95;
    --green-soft:#20302a;
    --accent:#dba85a;
    --focus:#7ec7ea;
    --tagline:#818a7c;
    color-scheme: dark;
  }

*{box-sizing:border-box;}

a{color:inherit;}

h1,h2,h3{
    font-family:"Gill Sans", "Gill Sans MT", Calibri, sans-serif;
    font-weight:700;
    text-wrap:balance;
    margin:0;
  }

.wrap{
    max-width:60rem;
    margin-inline:auto;
    padding-inline:max(1.25rem, env(safe-area-inset-left, 0px));
  }

/* ---------- header ---------- */
  .site-header{
    position:sticky;
    top:env(safe-area-inset-top, 0px);
    z-index:20;
    width:100%;
  }

.masthead{
    background:#ffffff;
  }

.masthead__top{
    position:relative;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:1.5rem;
    padding-block:0.9rem 0.1rem;
    padding-right:6.75rem;
    flex-wrap:wrap;
  }

.wordmark{
    display:flex;
    align-items:baseline;
    gap:0.85rem;
    flex-wrap:wrap;
  }

.wordmark__name{
    font-family:"Gill Sans", "Gill Sans MT", Calibri, sans-serif;
    font-size:clamp(1.9rem, 5vw, 2.6rem);
    font-weight:400;
    line-height:1;
    letter-spacing:0.01em;
    text-wrap:balance;
    margin:0;
  }

.wordmark__tagline{
    font-family:"Gill Sans", "Gill Sans MT", Calibri, sans-serif;
    font-weight:400;
    font-size:1.1rem;
    line-height:1;
    color:var(--tagline);
  }

.logo{
    position:absolute;
    top:0.4rem;
    right:1rem;
    width:88px;
    height:auto;
    z-index:5;
  }

.masthead__contact{
    background:rgb(225,225,225);
    min-height:var(--bar-height);
  }

.masthead__contact .wrap{
    display:flex;
    align-items:flex-start;
    flex-wrap:wrap;
    gap:0.35rem 1rem;
    min-height:var(--bar-height);
    padding-top:calc(0.03rem + 4px);
    padding-right:6.75rem;
    padding-bottom:0.5rem;
    font-size:calc(0.92rem + 1pt);
    color:black;
  }

/* ---------- nav ---------- */
  nav.tabs{
    background:rgb(225,235,245);
    border-bottom:1px solid rgb(153,153,153);
    min-height:1.6rem;
  }

nav.tabs .wrap{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-end;
    padding-bottom:0.25rem;
    gap:0.35rem 0.4rem;
    min-height:1.6rem;
  }

nav.tabs a{
    flex:none;
    display:inline-block;
    padding:0.08rem 0.41rem;
    border-radius:0;
    font-size:calc(0.95rem - 1pt);
    font-weight:400;
    text-decoration:none;
    color:#222222;
    background:#cccccc;
    border-top:1px solid #ffffff;
    border-left:1px solid #ffffff;
    border-right:2px solid #666666;
    border-bottom:none;
  }

nav.tabs a:hover{
    background:rgb(0,0,128);
    color:#ffffff;
  }

nav.tabs a[data-nav="download"]:hover{
    background:rgb(0,0,128);
    color:#ffffff;
  }

nav.tabs a.is-active{
    background:#99cdff;
    font-weight:400;
    color:#111111;
    border-top-color:#ffffff;
    border-left-color:#ffffff;
    border-right-color:#5c85ad;
  }

nav.tabs a:focus-visible{
    outline:2px solid var(--focus);
    outline-offset:2px;
  }

.product__more{
    display:block;
    width:fit-content;
    margin:0.75rem auto 0;
    padding:0.08rem 0.41rem;
    border-radius:0;
    font-size:calc(0.95rem - 1pt);
    font-family:"Gill Sans", "Gill Sans MT", Calibri, ui-sans-serif, system-ui, sans-serif;
    font-weight:400;
    text-decoration:none;
    color:#111111;
    background:rgb(225,235,245);
    border-top:2px solid #ffffff;
    border-left:2px solid #ffffff;
    border-right:2px solid #5c85ad;
    border-bottom:none;
  }

.product__more:hover{
    font-weight:700;
  }

.product__more:focus-visible{
    outline:2px solid var(--focus);
    outline-offset:2px;
  }

/* ---------- hero ---------- */
  .hero{
    padding-block:3rem 2.5rem;
  }

/* ---------- products ---------- */
  .products{
    padding-block:1.75rem 3rem;
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:1.75rem;
  }

@media (max-width:44rem){
    .products{grid-template-columns:1fr;}
  }

.product{
    scroll-margin-top:11rem;
    background:var(--surface);
    border:1px dotted black;
    border-radius:0;
    padding:1.75rem;
    display:block;
    overflow:hidden;
  }

.product__head{
    display:flex;
    align-items:center;
    gap:0.85rem;
    margin-bottom:0.9rem;
  }

.badge-img{
    flex:none;
    width:1.95rem;
    height:1.95rem;
    display:block;
    border-radius:0;
  }

.product h1,
.product h2{font-size:1.4rem;}

.product p{
    color:#000000;
    line-height:1.3365;
    font-size:0.98rem;
    text-align:justify;
    margin:0;
  }

.product p + p{
    margin-top:0.75rem;
  }

.product__inset--bordered{
    border:1px solid rgb(225,225,225);
    margin-top:-0.9375rem;
  }

.product__inset + p{
    margin-top:0.75rem;
  }

footer{
    padding-block:1.75rem;
    color:var(--ink-soft);
    font-size:0.85rem;
    display:flex;
    flex-wrap:wrap;
    gap:0.5rem 1.5rem;
    justify-content:space-between;
  }

footer a{color:var(--accent);}

@media (prefers-reduced-motion: no-preference){
    html{scroll-behavior:smooth;}
  }

img.js-enlarge{
    cursor:zoom-in;
  }

.lightbox-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.4);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:3rem;
    z-index:1000;
    cursor:zoom-out;
  }

.lightbox-overlay .overlay-frame{
    cursor:default;
  }

.lightbox-overlay img{
    display:block;
    max-width:100%;
    max-height:100%;
    box-shadow:0 10px 40px rgba(0,0,0,0.5);
  }

.video-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.4);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:2rem;
    z-index:1000;
  }

.video-overlay video{
    display:block;
    width:73.33vw;
    height:73.33vh;
    max-width:100%;
    max-height:100%;
    object-fit:contain;
    box-shadow:0 10px 40px rgba(0,0,0,0.5);
    background:#000000;
  }

.overlay-frame{
    position:relative;
    display:inline-block;
    max-width:100%;
    max-height:100%;
    line-height:0;
  }

.overlay-close{
    position:absolute;
    top:-14px;
    right:-14px;
    width:2.25rem;
    height:2.25rem;
    border:none;
    border-radius:50%;
    background:rgba(255,255,255,0.9);
    color:#111111;
    font-size:1.3rem;
    line-height:1;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0;
    z-index:1;
  }

.overlay-close span{
    display:block;
    transform:translateY(-1px);
  }

.overlay-close:hover{
    background:#ffffff;
  }

.policy-wrap{
    position:relative;
    width:100%;
    max-width:46rem;
    max-height:100%;
  }

.policy-frame{
    max-height:80vh;
    overflow-y:auto;
    background:rgb(233,247,254);
    font-style:italic;
    box-shadow:0 10px 40px rgba(0,0,0,0.5);
  }

.policy-frame h2{
    font-style:normal;
    font-weight:400;
    font-size:calc(1.15rem - 4pt);
  }

.policy-frame p{
    font-size:calc(0.98rem - 4pt);
  }

.policy-frame ul{
    margin:0.75rem 0 0;
    padding-left:1.5rem;
    color:#000000;
    line-height:1.3365;
    font-size:calc(0.98rem - 4pt);
    text-align:justify;
  }

.policy-frame li + li{
    margin-top:0.5rem;
  }

.policy-frame ul + p{
    margin-top:0.75rem;
  }

.policy-frame p + h2{
    margin-top:1.5rem;
  }

.policy-frame h2 + p,
.policy-frame .section-head + p,
.policy-frame .section-head + ul{
    margin-top:0;
  }