:root {
  color-scheme: light;
  --paper: #fafafa;
  --white: #fff;
  --ink: #111318;
  --muted: #676971;
  --line: #dedfe3;
  --gutter: clamp(1.375rem, 5vw, 4rem);
  font: 400 16px / 1.5 'Instrument Sans', sans-serif;
  font-synthesis: none;
  font-optical-sizing: auto;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 1.5rem; }
body { margin: 0; color: var(--ink); background: var(--paper); -webkit-font-smoothing: antialiased; }
::selection { background: #dce1eb; color: var(--ink); }
h1,h2,h3,p { margin: 0; }
a { color: inherit; text-underline-offset: .22em; text-decoration-thickness: 1px; }
img { display: block; max-width: 100%; height: auto; }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
.shell { width: calc(100% - var(--gutter) * 2); max-width: 1120px; margin-inline: auto; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; z-index:10; top:1rem; left:1rem; background:var(--ink); color:white; padding:.7rem 1rem; transform:translateY(-180%); }
.skip-link:focus { transform:none; }
.site-header { height:94px; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid var(--line); }
.home-link { display:block; width:105px; margin-left:-6px; }
.site-header nav { display:flex; align-items:center; gap:1.875rem; }
.nav-link { padding-block:.75rem; text-decoration:none; font-size:.875rem; line-height:1.5; transition:color 160ms ease; }
.nav-link:hover { color:var(--muted); }
.intro { display:grid; grid-template-columns:1.3fr 1fr; align-items:center; gap:4.5rem; padding-block:54px 48px; }
.intro h1 { font-size:clamp(2rem,3.1vw,2.6875rem); line-height:1.17; letter-spacing:-.042em; font-weight:500; }
.company-intro { max-width:365px; margin-left:auto; color:var(--muted); font-size:1rem; line-height:1.7; letter-spacing:-.012em; }
.products { padding-bottom:48px; }
.section-heading { display:flex; align-items:center; margin-bottom:18px; }
.section-heading h2, .contact h2 { font-size:1.0625rem; line-height:1.5; font-weight:500; letter-spacing:-.018em; }
.product-grid { display:grid; grid-template-columns:1.15fr 1fr; gap:20px; }
.product {
  --card-bg:var(--white);
  --card-ink:var(--ink);
  --card-muted:var(--muted);
  --card-line:var(--line);
  --card-status:var(--muted);
  --card-status-line:var(--line);
  --card-transition:240ms cubic-bezier(.2,.65,.25,1);
  min-width:0; display:flex; flex-direction:column; border-radius:18px; padding:26px 28px 22px;
  background:var(--card-bg); color:var(--card-ink); box-shadow:inset 0 0 0 1px var(--card-line);
  transition:background-color var(--card-transition), color var(--card-transition), box-shadow var(--card-transition);
}
.product:focus-within {
  --card-bg:var(--ink); --card-ink:var(--white); --card-muted:#c8cad1;
  --card-line:#41434c; --card-status:#eef0f5; --card-status-line:#51545c;
}
@media (hover:hover) and (pointer:fine) {
  .product:hover {
    --card-bg:var(--ink); --card-ink:var(--white); --card-muted:#c8cad1;
    --card-line:#41434c; --card-status:#eef0f5; --card-status-line:#51545c;
  }
}
.product-topline { display:flex; justify-content:space-between; align-items:center; gap:16px; font-size:.875rem; line-height:1.5; color:var(--card-muted); }
.availability { flex-shrink:0; color:var(--card-status); border:1px solid var(--card-status-line); padding:.18rem .65rem; border-radius:20px; font-size:.8125rem; line-height:1.5; }
.product-copy { padding-block:28px 26px; }
.product h3 { font-size:2.1875rem; line-height:1.1; letter-spacing:-.055em; font-weight:500; }
.product-copy p { margin-top:13px; font-size:1rem; line-height:1.55; letter-spacing:-.012em; color:var(--card-muted); }
.product-link { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:auto; padding-top:16px; border-top:1px solid var(--card-line); font-size:.875rem; line-height:1.5; text-decoration:none; }
.product-link > span { text-decoration:underline; text-decoration-color:transparent; text-underline-offset:.2em; transition:text-decoration-color 160ms ease; }
.product-link:hover > span { text-decoration-color:currentColor; }
.external-icon { flex-shrink:0; transition:transform 160ms ease; }
.product-link:hover .external-icon { transform:translate(1px,-1px); }
.product-release { display:flex; justify-content:space-between; gap:20px; border-top:1px solid var(--card-line); padding-top:16px; margin-top:auto; color:var(--card-muted); font-size:.875rem; line-height:1.5; }
.product-topline, .availability, .product-copy p, .product-link, .product-release {
  transition:color var(--card-transition), border-color var(--card-transition);
}
.contact { display:grid; grid-template-columns:1.15fr 1fr; gap:20px; border-top:1px solid var(--line); padding-block:32px 38px; }
.contact-start > p { margin-top:5px; color:var(--muted); font-size:.9375rem; line-height:1.5; }
.email-link { display:inline-block; margin-top:14px; font-size:1.375rem; line-height:1.4; font-weight:500; letter-spacing:-.025em; text-decoration-color:#a5a7ad; transition:text-decoration-color 160ms ease; }
.email-link:hover { text-decoration-color:var(--ink); }
.company-details { padding-left:28px; align-self:center; }
.legal-name { font-size:.9375rem; font-weight:500; line-height:1.5; }
.company-details address { margin-top:7px; font-size:.9375rem; font-style:normal; line-height:1.65; color:var(--muted); }
.site-footer { display:flex; justify-content:space-between; align-items:center; gap:24px; min-height:66px; padding-block:16px; border-top:1px solid var(--line); color:var(--muted); font-size:.8125rem; line-height:1.5; }
@media (max-width:900px) {
  .intro { grid-template-columns:1.15fr 1fr; gap:2rem; padding-block:40px; }
  .intro h1 { font-size:2.125rem; }
  .product { padding:22px; }
  .product-topline { align-items:flex-start; gap:10px; }
  .product-topline > span:first-child { max-width:170px; }
  .company-details { padding-left:22px; }
}
@media (max-width:640px) {
  .site-header { height:78px; }
  .home-link { width:91px; margin-left:-5px; }
  .site-header nav { gap:1.25rem; }
  .intro { grid-template-columns:1fr; padding-block:34px 30px; gap:18px; }
  .intro h1 { font-size:clamp(1.875rem,7.6vw,2.25rem); line-height:1.2; }
  .company-intro { max-width:30rem; margin-left:0; font-size:1rem; line-height:1.65; }
  .section-heading { margin-bottom:13px; }
  .product-grid { grid-template-columns:1fr; gap:14px; }
  .product { padding:22px; border-radius:15px; }
  .product-topline { align-items:center; }
  .product-topline > span:first-child { max-width:none; }
  .product-copy { padding-block:23px 22px; }
  .product h3 { font-size:2rem; }
  .product-copy p { margin-top:10px; }
  .products { padding-bottom:30px; }
  .contact { grid-template-columns:1fr; gap:28px; padding-block:27px 30px; }
  .company-details { padding-left:0; }
  .site-footer { min-height:60px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation:none !important; transition:none !important; }
}
