/* ventus-labs.com. Reference lock: Studio Thomas (one statement colour as a full-bleed field,
   oversized light grotesk, 0px radius, no shadows, warm neutral secondary blocks) + Studio Few
   (products shown as large "specimen" rows with thin rules). Statement colour = Ventus blue. */
@font-face{font-family:Inter;src:url(fonts/inter-latin.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--blue:#0a3d91;--ink:#000;--paper:#fff;--petal:#ebe9e3;--grey:#767676;--rule:#d9d6cd}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.55 Inter,Arial,sans-serif;letter-spacing:-.004em;-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.pad{padding-left:clamp(20px,4vw,48px);padding-right:clamp(20px,4vw,48px)}
.top{display:flex;justify-content:space-between;align-items:center;padding-top:22px;padding-bottom:22px;position:relative;z-index:2}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:500;letter-spacing:-.01em}
.logo{font-size:19px;letter-spacing:-.03em}.logo .mark{width:30px;height:30px;fill:var(--blue)}.field .logo .mark{fill:#fff}
.top nav a{margin-left:28px;text-decoration:none;font-size:15px}
.top nav a:hover{text-decoration:underline;text-underline-offset:4px}
/* statement field */
.field{background:var(--blue);color:#fff;min-height:92vh;display:flex;flex-direction:column}
.field .top a{color:#fff}
.statement{margin-top:auto;padding-top:8vh;padding-bottom:7vh}
.statement h1{font-weight:300;font-size:clamp(54px,10.4vw,168px);line-height:.96;letter-spacing:-.045em;margin:0;max-width:11ch}
.statement .row{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;margin-top:6vh;border-top:1px solid rgba(255,255,255,.35);padding-top:22px}
.statement p{font-size:clamp(18px,1.7vw,24px);line-height:1.35;max-width:34ch;margin:0;font-weight:300}
.statement .go{font-size:15px;text-decoration:none;border-bottom:1px solid #fff;padding-bottom:2px}
/* specimens */
.label{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--grey);margin:0}
.products{padding-top:96px;padding-bottom:40px}
.spec{display:grid;grid-template-columns:1fr auto;gap:24px 40px;align-items:end;border-top:1px solid var(--ink);padding:34px 0 46px;text-decoration:none}
.spec:last-child{border-bottom:1px solid var(--ink)}
.spec .name{font-weight:300;font-size:clamp(56px,9vw,140px);line-height:.95;letter-spacing:-.05em;margin:0;transition:color .15s}
.spec:hover .name{color:var(--blue)}
.spec .what{max-width:44ch;font-size:19px;margin:16px 0 0;color:#222}
.spec .side{text-align:right;font-size:15px;display:grid;gap:6px;justify-items:end}
.spec .price{font-size:28px;font-weight:300;letter-spacing:-.02em}
.spec .open{border-bottom:1px solid var(--ink);padding-bottom:2px}
.spec.soon .name{color:#c9c6bd}.spec.soon:hover .name{color:#c9c6bd}
/* principles */
.petal{background:var(--petal);padding-top:96px;padding-bottom:96px}
.petal h2{font-weight:300;font-size:clamp(36px,5vw,72px);line-height:1;letter-spacing:-.04em;margin:14px 0 56px;max-width:16ch}
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.cols div{border-top:1px solid var(--ink);padding-top:18px}
.cols h3{font-weight:400;font-size:24px;letter-spacing:-.02em;margin:0 0 10px}
.cols p{margin:0;color:#333}
/* company */
.company{padding-top:80px;padding-bottom:40px;display:grid;grid-template-columns:1fr 1fr;gap:40px}
.company p{margin:10px 0 0;color:#333;max-width:46ch}
.company a{text-decoration:none;border-bottom:1px solid var(--ink)}
footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:28px;padding-bottom:40px;font-size:14px;color:var(--grey);border-top:1px solid var(--rule);margin-top:40px}
footer a{text-decoration:none;margin-left:20px}footer a:hover{color:var(--ink)}
/* legal pages */
.legal{max-width:760px;padding-top:40px;padding-bottom:40px}
.legal h1{font-weight:300;font-size:clamp(44px,6vw,80px);letter-spacing:-.045em;line-height:1;margin:20px 0 32px}
.legal h2{font-weight:400;font-size:22px;letter-spacing:-.01em;margin:36px 0 8px}
.legal p{color:#222}
.bar{border-bottom:1px solid var(--rule)}
@media (max-width:820px){.cols,.company{grid-template-columns:1fr}.spec{grid-template-columns:1fr}.spec .side{justify-items:start;text-align:left}.top nav a:not(:last-child){display:none}.field{min-height:84vh}}
