@font-face {
  font-family:"DM Sans";
  src:url("assets/dm-sans-regular.ttf") format("truetype");
  font-style:normal;
  font-weight:400;
  font-display:swap
}
@font-face {
  font-family:"DM Sans";
  src:url("assets/dm-sans-medium.ttf") format("truetype");
  font-style:normal;
  font-weight:500;
  font-display:swap
}
@font-face {
  font-family:"DM Sans";
  src:url("assets/dm-sans-bold.ttf") format("truetype");
  font-style:normal;
  font-weight:700;
  font-display:swap
}
:root {
  --cream:#fff8f1;
  --ink:#530039;
  --muted:#73455f;
  --image-note-surface:#530039d1;
  --line:#d7c5cc;
  --gutter:clamp(24px,4.8vw,86px);
  --space:clamp(52px,6.2vw,112px);
  --products-applications-gap:48px;
  --enquiry-entry-max:64px;
  --heading-content-max:48px;
  --ease:cubic-bezier(.16,1,.3,1);
  color-scheme:light;
  font-family:"DM Sans",sans-serif;
  color:var(--ink);
  background:var(--cream);
  scroll-behavior:smooth;
  scrollbar-color:#967386 var(--cream);
  scroll-padding-top:24px
}
* {
  box-sizing:border-box
}
body {
  margin:0
}
a {
  color:inherit;
  text-underline-offset:.2em;
  text-decoration-thickness:1px
}
button,input,textarea,select {
  font:inherit;
  color:inherit
}
button,a,input,summary,textarea,select {
  -webkit-tap-highlight-color:#d8bdcc
}
button,summary,input[type=radio],input[type=checkbox] {
  cursor:pointer
}
button {
  border:0
}
::selection {
  color:var(--cream);
  background:var(--ink)
}
input,textarea {
  caret-color:var(--ink)
}
:focus-visible {
  outline:2px solid var(--ink);
  outline-offset:5px
}
img {
  max-width:100%;
  display:block
}
figure,p,h1,h2,h3 {
  margin:0
}
h1,h2,h3 {
  font-weight:700;
  letter-spacing:-.035em;
  text-wrap:balance
}
p {
  line-height:1.45
}
h2 {
  font-size:clamp(29px,4vw,62px);
  line-height:1.1
}
h3 {
  font-size:clamp(25px,3.4vw,51px);
  line-height:1.12
}
a:hover {
  text-decoration-thickness:2px
}
.page-section {
  margin-inline:var(--gutter)
}
.skip-link {
  position:fixed;
  left:20px;
  top:-90px;
  z-index:10;
  padding:14px 20px;
  background:var(--ink);
  color:var(--cream)
}
.skip-link:focus {
  top:10px
}
.site-header {
  display:flex;
  align-items:center;
  gap:clamp(13px,2vw,32px);
  padding:clamp(12px,1.6vw,28px) var(--gutter);
  min-height:clamp(60px,6.7vw,108px)
}
.identity {
  text-decoration:none;
  flex:none
}
.wordmark {
  font-weight:700;
  font-size:clamp(23px,3vw,44px);
  letter-spacing:-.035em;
  white-space:nowrap;
  text-decoration:none
}
.wordmark sup {
  font-size:.25em;
  position:relative;
  top:-1.1em;
  margin-left:.28em;
  letter-spacing:0
}
.origin-signature {
  width:clamp(102px,13vw,185px);
  height:clamp(40px,4.2vw,62px);
  object-fit:contain
}
.site-header nav {
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:clamp(20px,3.2vw,54px);
  font-size:clamp(12px,1.6vw,23px);
  font-weight:500
}
.site-header nav a {
  display:inline-flex;
  align-items:center;
  min-width:44px;
  min-height:44px;
  text-decoration:none;
  white-space:nowrap
}
.site-header nav a:hover {
  text-decoration:underline
}
.hero {
  position:relative;
  aspect-ratio:1.7915;
  isolation:isolate;
  overflow:hidden
}
.hero-image {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:-1
}
.hero-copy {
  padding-top:9.5%;
  padding-left:var(--gutter);
  max-width:56%
}
.hero h1 {
  font-size:clamp(33px,4.15vw,66px);
  line-height:1.04;
  max-width:10em
}
.hero-copy>p {
  font-size:clamp(16px,2.05vw,29px);
  margin-top:.65em;
  font-weight:500;
  white-space:nowrap
}
.primary-action {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  border-radius:999px;
  padding:.72em 1.35em;
  background:var(--ink);
  color:var(--cream);
  text-decoration:none;
  font-weight:500;
  font-size:clamp(16px,1.9vw,26px);
  line-height:1.3;
  transition:background .2s ease
}
.primary-action:hover {
  background:#74064e;
  text-decoration:none
}
.hero .primary-action {
  margin-top:clamp(25px,4.7vw,66px)
}
.hero-note {
  position:absolute;
  right:var(--gutter);
  bottom:18px;
  font-size:clamp(12px,1vw,14px);
  color:var(--cream);
  background:var(--image-note-surface);
  padding:3px 6px
}
.products {
  padding-top:clamp(42px,5vw,80px)
}
.product-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(32px,5.2vw,88px);
  margin-top:clamp(34px,4.7vw,var(--heading-content-max))
}
.product {
  scroll-margin-top:40px;
  outline-offset:12px
}
.product>p {
  font-size:clamp(14px,1.8vw,25px);
  margin-top:.22em;
  min-height:2.9em
}
.product figure {
  margin-top:10px
}
.product figure img {
  width:100%;
  height:auto;
  aspect-ratio:1.6;
  object-fit:contain
}
.product figcaption {
  font-size:clamp(12px,1vw,14px);
  margin-top:10px
}
.applications {
  margin-top:var(--products-applications-gap)
}
.application-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(12px,1.5vw,24px);
  margin-top:clamp(32px,4vw,var(--heading-content-max))
}
.application-grid img {
  width:100%;
  height:auto;
  aspect-ratio:1.12;
  object-fit:cover
}
.application-grid figcaption {
  font-size:clamp(17px,2.2vw,32px);
  font-weight:700;
  letter-spacing:-.025em;
  line-height:1.16;
  margin-top:14px
}
.section-note {
  text-align:right;
  font-size:clamp(12px,1.1vw,15px);
  margin-top:32px
}
.material {
  margin-top:28px
}
.material details {
  border-block:1px solid var(--line)
}
.material summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  list-style:none;
  padding:20px 0;
  font-size:clamp(18px,2.2vw,30px)
}
summary::-webkit-details-marker {
  display:none
}
.material summary svg {
  flex:none;
  transition:transform .2s var(--ease)
}
.material details[open] summary svg {
  transform:rotate(45deg)
}
.material details>p {
  font-size:clamp(17px,1.5vw,22px);
  max-width:68ch;
  padding:0 0 28px
}
.project {
  overflow-anchor:none;
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:clamp(28px,5vw,90px);
  padding-top:clamp(58px,7.6vw,var(--enquiry-entry-max));
  padding-bottom:clamp(52px,5.3vw,85px);
  scroll-margin-top:36px
}
.project-intro h2 {
  font-size:clamp(30px,4.4vw,65px);
  line-height:1.02
}
.project-intro>p {
  font-size:clamp(17px,2.2vw,30px);
  line-height:1.18;
  max-width:18em;
  margin-top:20px
}
.enquiry {
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:340px
}
.progress {
  flex:none;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:8px 16px;
  margin-bottom:20px;
  font-size:clamp(13px,1.4vw,19px);
  font-weight:500
}
.progress label {
  white-space:nowrap;
  display:flex;
  align-items:center;
  min-height:32px
}
.progress progress {
  grid-column:1 / -1;
  grid-row:2;
  width:100%;
  height:7px;
  border:0;
  border-radius:10px;
  overflow:hidden;
  accent-color:var(--ink);
  background:#d8bbc9
}
.progress progress::-webkit-progress-bar {
  background:#d8bbc9
}
.progress progress::-webkit-progress-value {
  background:var(--ink);
  border-radius:10px;
  transition:width .35s var(--ease)
}
.progress progress::-moz-progress-bar {
  background:var(--ink);
  border-radius:10px
}
.enquiry h3 {
  font-size:clamp(26px,3.5vw,49px);
  margin-bottom:20px
}
.enquiry h3:focus {
  outline:none
}
.enquiry fieldset {
  border:0;
  padding:0;
  margin:0
}
.choice {
  display:flex;
  align-items:center;
  gap:15px;
  min-height:clamp(44px,4.8vw,68px);
  font-size:clamp(17px,2vw,28px);
  line-height:1.25;
  font-weight:500;
  padding:4px
}
.choice:hover {
  color:#850459
}
.choice input {
  flex:none;
  width:22px;
  height:22px;
  margin:0;
  accent-color:var(--ink)
}
.hint {
  font-size:clamp(14px,1.45vw,19px);
  margin-top:18px;
  color:var(--muted)
}
.form-actions {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-top:auto;
  padding-top:26px;
  flex-shrink:0
}
.form-actions[hidden] {
  display:none
}
.enquiry-trap {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap
}
.text-action {
  background:transparent;
  padding:8px 0;
  font-size:17px;
  text-decoration:underline;
  text-underline-offset:.25em
}
.text-action:hover {
  text-decoration-thickness:2px
}
.draft-reset {
  grid-column:2;
  grid-row:1;
  justify-self:end;
  font-size:14px;
  line-height:1.3;
  padding:6px 0;
  min-height:32px;
  color:var(--muted)
}
.enquiry-tools {
  flex:none;
  display:flex;
  justify-content:flex-end;
  margin-bottom:20px
}
.form-actions .primary-action {
  font-size:18px
}
.field {
  display:block;
  margin-top:22px;
  font-size:18px
}
.field>span {
  display:block;
  margin-bottom:8px
}
.field input,.field textarea,.field select {
  display:block;
  border:1px solid #a47f94;
  background:transparent;
  border-radius:4px;
  width:100%;
  padding:12px 14px;
  min-height:48px;
  font-size:18px
}
.field textarea {
  resize:vertical;
  min-height:90px
}
.field input:disabled {
  opacity:.4
}
.field input::placeholder,.field textarea::placeholder {
  color:#7b536b;
  opacity:1
}
.quantity-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) 100px;
  gap:14px;
  align-items:end
}
.quantity-row.single {
  grid-template-columns:1fr
}
.subtle-choice {
  font-size:17px;
  font-weight:400;
  margin-top:20px
}
.subtle-choice input {
  width:18px;
  height:18px
}
.error {
  color:#a12035;
  font-size:17px;
  margin-top:20px;
  font-weight:500
}
.error:empty {
  display:none
}
.review {
  margin:0
}
.review-row {
  display:grid;
  grid-template-columns:1fr auto;
  gap:16px;
  border-bottom:1px solid var(--line);
  padding:16px 0
}
.review dt {
  font-size:14px;
  color:var(--muted)
}
.review dd {
  margin:5px 0 0;
  font-size:20px;
  overflow-wrap:anywhere;
  white-space:pre-line
}
.review .text-action {
  align-self:center
}
.preview-note {
  font-size:14px;
  line-height:1.45;
  color:var(--muted);
  margin-top:24px;
  max-width:60ch
}
.success-copy {
  font-size:20px;
  max-width:42ch;
  line-height:1.5
}
.success-reference {
  font-size:13px;
  color:var(--muted);
  margin-top:18px;
  overflow-wrap:anywhere
}
.step-content {
  display:flex;
  flex-direction:column;
  flex:1;
  min-height:0;
  animation:question-in .24s var(--ease)
}
.step-content>h3,.step-content>fieldset {
  flex-shrink:0
}
@keyframes question-in {
  from {
    opacity:.65
  }
  to {
    opacity:1
  }
}
button:disabled {
  cursor:wait;
  opacity:.6
}
.site-footer {
  overflow-anchor:none;
  border-top:1px solid var(--line);
  padding-block:18px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px
}
.site-footer a {
  display:inline-flex;
  align-items:center;
  min-height:44px
}
.copyright {
  font-size:clamp(14px,1.2vw,16px);
  line-height:1.5
}
.copyright a {
  font-weight:500;
  text-decoration:none
}
.copyright sup {
  align-self:center;
  font-size:.6em;
  transform:translateY(-.4em);
  margin-left:.15em
}
.copyright .rights {
  white-space:nowrap
}
.site-footer nav {
  display:flex;
  gap:clamp(22px,4vw,60px);
  font-size:clamp(14px,1.6vw,22px)
}
.parking-main {
  max-width:880px;
  padding-block:70px 100px;
  min-height:65vh
}
.parking-main h1 {
  font-size:clamp(36px,5vw,72px);
  line-height:1.04
}
.parking-main p {
  font-size:22px;
  max-width:60ch;
  margin-top:28px
}
.parking-main .primary-action {
  margin-top:40px
}
@media(min-width:1800px) {
  body {
    max-width:1800px;
    margin-inline:auto
  }
}
@media(max-width:1050px) and (min-width:701px) {
  .site-header {
    gap:12px
  }
  .site-header nav {
    gap:20px
  }
  .origin-signature {
    width:112px
  }
  .product>p {
    min-height:3em
  }
}
@media(max-width:700px) {
  :root {
    scroll-padding-top:18px
  }
  .site-header {
    flex-wrap:wrap;
    padding-block:14px 12px;
    gap:8px 20px
  }
  .wordmark {
    font-size:29px
  }
  .origin-signature {
    width:124px;
    height:42px;
    margin-left:auto
  }
  .site-header nav {
    width:100%;
    margin:8px 0 0;
    justify-content:space-between;
    gap:clamp(8px,3vw,12px);
    font-size:13px
  }
  .site-header nav a {
    padding-block:8px
  }
  .hero {
    aspect-ratio:auto;
    min-height:620px
  }
  .hero-image {
    object-position:62% center
  }
  .hero::after {
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:linear-gradient(180deg,rgba(255,248,241,.88),rgba(255,248,241,.7) 40%,transparent 69%)
  }
  .hero-copy {
    padding-top:44px;
    max-width:100%;
    padding-right:var(--gutter)
  }
  .hero h1 {
    font-size:clamp(39px,8.8vw,58px);
    line-height:1.03
  }
  .hero-copy>p {
    white-space:normal;
    font-size:18px;
    max-width:22ch;
    margin-top:16px
  }
  .hero .primary-action {
    margin-top:28px;
    font-size:17px
  }
  .hero-note {
    font-size:12px;
    bottom:14px
  }
  .products {
    padding-top:48px
  }
  .product-grid {
    grid-template-columns:1fr;
    gap:45px;
    margin-top:32px
  }
  .product h3 {
    font-size:29px
  }
  .product>p {
    font-size:17px;
    min-height:0;
    max-width:34ch;
    margin-top:8px
  }
  .product figure {
    margin-top:18px
  }
  .product figcaption {
    font-size:12px
  }
  .applications {
    margin-top:72px
  }
  .application-grid {
    grid-template-columns:1fr;
    gap:32px;
    margin-top:30px
  }
  .application-grid img {
    aspect-ratio:1.12
  }
  .application-grid figcaption {
    font-size:23px;
    max-width:25ch;
    margin-top:12px
  }
  .section-note {
    font-size:12px;
    margin-top:26px
  }
  .material {
    margin-top:26px
  }
  .material summary {
    font-size:18px;
    padding-block:18px;
    gap:20px
  }
  .material details>p {
    font-size:17px
  }
  .project {
    grid-template-columns:1fr;
    gap:34px;
    padding-top:48px;
    padding-bottom:48px
  }
  .project-intro h2 {
    font-size:36px
  }
  .project-intro h2 br {
    display:none
  }
  .project-intro>p {
    font-size:19px;
    max-width:26ch;
    margin-top:15px
  }
  .enquiry h3 {
    font-size:28px
  }
  .enquiry {
    min-height:330px
  }
  .choice {
    font-size:18px;
    min-height:50px
  }
  .progress {
    font-size:13px;
    gap:8px 16px
  }
  .hint {
    font-size:14px
  }
  .site-footer {
    flex-wrap:wrap;
    padding-block:16px 20px;
    gap:12px 24px
  }
  .site-footer nav {
    font-size:15px
  }
  .field {
    font-size:16px
  }
  .review dd {
    font-size:18px
  }
  .review-row .text-action {
    font-size:14px
  }
  .parking-main {
    padding-block:45px 75px
  }
  .parking-main p {
    font-size:19px
  }
}
@media(prefers-reduced-motion:reduce) {
  :root {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important
  }
}
@media(min-width:701px) {
  .hero::after {
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:linear-gradient(90deg,rgba(255,248,241,.94),rgba(255,248,241,.82) 28%,rgba(255,248,241,.18) 48%,transparent 62%);
    mask-image:linear-gradient(#000 55%,transparent 90%);
    pointer-events:none
  }
}
@media(max-width:380px) {
  .site-header {
    column-gap:12px
  }
  .wordmark {
    font-size:26px
  }
  .origin-signature {
    width:104px
  }
  .site-header nav {
    font-size:12px;
    gap:8px
  }
}
.enquiry {
  scroll-margin-top: 32px;
}
