.contact-page [hidden]{display:none!important}

.contact-page .c-page-hero[data-hero-form="product-visual"]{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,31rem);
  gap:var(--space-4);
  align-items:start;
  padding-block:var(--hero-pad);
  background:#FFFFFF;
  color:#202426
}

.contact-page .hero-copy{
  min-width:0;
  padding:var(--space-5);
  border-radius:var(--radius-lg);
  background:#F3EEDD;
  color:#25251F
}

.contact-page .hero-copy h1{
  max-width:17ch;
  overflow-wrap:anywhere
}

.contact-hero-lead{
  max-width:44rem;
  margin-top:var(--space-3);
  color:#4F5048
}

.contact-page .hero-copy .c-actions{
  justify-content:flex-start;
  margin-top:var(--space-3)
}

.contact-channel-summary{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-2);
  margin-top:var(--space-3);
  padding-top:var(--space-3);
  border-top:1px solid color-mix(in srgb,#25251F 14%,transparent)
}

.contact-channel-summary div{
  display:grid;
  min-width:0;
  gap:.5rem
}

.contact-channel-summary strong{
  font-family:var(--font-heading);
  font-size:var(--text-sm)
}

.contact-channel-summary span{
  color:#5B5B52;
  font-size:var(--text-sm);
  overflow-wrap:anywhere
}

.contact-page .hero-stage{
  min-width:0;
  height:auto;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:#DDE9F2;
  color:#1D2D38
}

.contact-page .hero-stage-head{
  display:flex;
  min-width:0;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-2);
  padding:var(--space-2) var(--space-3);
  background:#202426;
  color:#F7F7F4;
  font-family:var(--font-mono);
  font-size:var(--text-xs)
}

.contact-page .hero-stage-head>span:first-child{
  min-width:0;
  overflow-wrap:anywhere
}

.contact-page .hero-art{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  width:100%;
  min-width:0;
  height:auto;
  padding:var(--space-3)
}

.contact-desk{
  min-width:0;
  overflow:hidden;
  border-radius:var(--radius-md);
  background:#FFFFFF;
  color:#202426;
  box-shadow:var(--shadow)
}

.contact-desk-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-2);
  padding:var(--space-3);
  background:#FFFFFF;
  color:#202426
}

.contact-desk-heading span{
  color:#666C69;
  font-size:var(--text-xs)
}

.contact-desk-row{
  display:grid;
  grid-template-columns:2.75rem minmax(0,1fr) auto;
  gap:var(--space-2);
  align-items:center;
  padding:var(--space-3);
  color:#202426
}

.contact-desk-row-sand{
  background:#F3EEDD;
  color:#25251F
}

.contact-desk-row-mint{
  background:#DDEBE8;
  color:#17312E
}

.contact-desk-row-lavender{
  background:#E3E2F2;
  color:#29263B
}

.contact-desk-code{
  display:inline-flex;
  width:2.75rem;
  height:2.75rem;
  align-items:center;
  justify-content:center;
  border-radius:var(--radius-sm);
  background:#FFFFFF;
  color:#873515;
  font-family:var(--font-mono);
  font-size:var(--text-xs);
  font-weight:700
}

.contact-desk-row>div{
  display:grid;
  min-width:0;
  gap:.35rem
}

.contact-desk-row strong,
.contact-desk-row small{
  overflow-wrap:anywhere
}

.contact-desk-row small{
  color:inherit;
  opacity:.78
}

.contact-desk-footer{
  display:grid;
  gap:.5rem;
  padding:var(--space-3);
  background:#873515;
  color:#FFFFFF
}

.contact-desk-footer span{
  color:#F4DED3;
  font-size:var(--text-xs)
}

.contact-desk-footer strong{
  font-family:var(--font-heading);
  font-size:var(--text-sm);
  overflow-wrap:anywhere
}

.contact-route-grid{
  align-items:stretch
}

.contact-route-card{
  min-width:0;
  height:100%;
  padding:var(--space-3)
}

.contact-route-mark{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-2);
  margin-bottom:var(--space-2)
}

.contact-route-card h3{
  font-size:var(--text-lg)
}

.contact-route-card p{
  margin-top:var(--space-2);
  color:inherit;
  opacity:.82
}

.contact-route-card .c-text-link{
  margin-top:auto;
  padding-top:var(--space-3)
}

.contact-form-section{
  padding-block:var(--section-pad)
}

.contact-form-section-sand{
  background:#FCFBF8;
  color:#202426
}

.contact-form-section-mint{
  background:#EDF5F3;
  color:#17312E
}

.contact-form-section-lavender{
  background:#F3F2FA;
  color:#29263B
}

.contact-form-layout{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:var(--space-5);
  align-items:start
}

.contact-form-layout-reverse .contact-form-copy{
  grid-column:2
}

.contact-form-layout-reverse .contact-mail-form{
  grid-column:1;
  grid-row:1
}

.contact-form-copy{
  display:grid;
  min-width:0;
  gap:var(--space-3)
}

.contact-form-copy .c-kicker{
  margin-bottom:0
}

.contact-form-copy h2{
  overflow-wrap:anywhere
}

.contact-form-copy>p{
  color:inherit;
  opacity:.8
}

.contact-copy-facts{
  display:grid;
  min-width:0;
  gap:0;
  border-top:1px solid color-mix(in srgb,currentColor 14%,transparent)
}

.contact-copy-facts div{
  display:grid;
  grid-template-columns:minmax(7.5rem,10rem) minmax(0,1fr);
  gap:var(--space-2);
  min-width:0;
  padding-block:var(--space-2);
  border-bottom:1px solid color-mix(in srgb,currentColor 14%,transparent)
}

.contact-copy-facts strong,
.contact-copy-facts span{
  min-width:0;
  overflow-wrap:anywhere
}

.contact-copy-facts strong{
  font-family:var(--font-heading)
}

.contact-copy-facts span{
  opacity:.78
}

.contact-mail-form{
  display:grid;
  min-width:0;
  gap:var(--space-3);
  padding:var(--space-4);
  border-radius:var(--radius-lg);
  background:#FFFFFF;
  color:#202426;
  box-shadow:var(--shadow)
}

.contact-form-head{
  display:flex;
  min-width:0;
  align-items:start;
  justify-content:space-between;
  gap:var(--space-2);
  padding-bottom:var(--space-3);
  border-bottom:1px solid color-mix(in srgb,#202426 13%,transparent)
}

.contact-form-head>div{
  display:grid;
  min-width:0;
  gap:.5rem
}

.contact-form-head .u-mono{
  color:#6A706D;
  font-size:var(--text-xs)
}

.contact-form-head h3{
  font-size:var(--text-lg);
  overflow-wrap:anywhere
}

.contact-field-pair{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-2)
}

.contact-fieldset{
  min-width:0;
  margin:0;
  padding:0;
  border:0
}

.contact-fieldset legend{
  margin-bottom:.5rem;
  padding:0;
  font-family:var(--font-body);
  font-size:var(--text-sm);
  font-weight:700
}

.contact-page .c-choice-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr))
}

.contact-page .c-choice span{
  min-height:0;
  padding:var(--space-3)
}

.contact-page .c-choice small{
  margin-top:.5rem;
  color:inherit;
  opacity:.72
}

.contact-region-compact .c-choice span{
  min-height:0
}

.contact-period-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--space-2)
}

.contact-period{
  position:relative;
  display:flex;
  min-width:0
}

.contact-period input{
  position:absolute;
  opacity:0;
  pointer-events:none
}

.contact-period span{
  display:inline-flex;
  width:100%;
  min-height:3rem;
  align-items:center;
  justify-content:center;
  padding:.65rem .9rem;
  border:1px solid color-mix(in srgb,#202426 24%,transparent);
  border-radius:var(--radius-sm);
  background:#FFFFFF;
  color:#202426;
  font-family:var(--font-heading);
  font-size:var(--text-sm);
  font-weight:700;
  text-align:center
}

.contact-period input:checked+span{
  border-color:#873515;
  background:#873515;
  color:#FFFFFF
}

.contact-period input:focus-visible+span{
  outline:3px solid color-mix(in srgb,#C76D2A 55%,transparent);
  outline-offset:3px
}

.contact-option-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-2)
}

.contact-check{
  position:relative;
  display:flex;
  min-width:0
}

.contact-check input{
  position:absolute;
  opacity:0;
  pointer-events:none
}

.contact-check span{
  display:flex;
  width:100%;
  min-height:4.25rem;
  align-items:center;
  padding:var(--space-2) var(--space-3);
  border:1px solid color-mix(in srgb,#202426 24%,transparent);
  border-radius:var(--radius-md);
  background:#F3EEDD;
  color:#25251F;
  font-weight:700;
  overflow-wrap:anywhere
}

.contact-check input:checked+span{
  border-color:#873515;
  background:#873515;
  color:#FFFFFF
}

.contact-check input:focus-visible+span{
  outline:3px solid color-mix(in srgb,#C76D2A 55%,transparent);
  outline-offset:3px
}

.contact-page .c-field small{
  color:#666C69;
  overflow-wrap:anywhere
}

.contact-form-note{
  padding:var(--space-2);
  border-radius:var(--radius-sm);
  background:#F3EEDD;
  color:#25251F;
  font-size:var(--text-sm)
}

.contact-mail-form .c-actions{
  justify-content:flex-start;
  margin-top:0
}

.contact-status{
  min-height:1.55rem;
  color:#6F2A10;
  font-size:var(--text-sm);
  font-weight:700
}

.contact-status.is-success{
  padding:var(--space-2);
  border-radius:var(--radius-sm);
  background:#DDEBE8;
  color:#17312E
}

.contact-status.is-error{
  padding:var(--space-2);
  border-radius:var(--radius-sm);
  background:#F1E2E5;
  color:#38242A
}

.contact-payment-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-3);
  align-items:stretch
}

.contact-payment-card{
  display:flex;
  min-width:0;
  height:100%;
  flex-direction:column;
  padding:var(--space-4);
  border-radius:var(--radius-lg)
}

.contact-payment-card-dark{
  background:#202426;
  color:#F7F7F4
}

.contact-payment-card-blue{
  background:#DDE9F2;
  color:#1D2D38
}

.contact-payment-card>.u-mono{
  font-size:var(--text-xs);
  opacity:.72
}

.contact-payment-card h3{
  margin-top:var(--space-2);
  font-size:var(--text-lg);
  overflow-wrap:anywhere
}

.contact-payment-card p{
  margin-top:var(--space-2);
  color:inherit;
  opacity:.8
}

.contact-payment-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-2);
  margin-top:auto;
  padding-top:var(--space-4);
  font-size:var(--text-sm)
}

.contact-payment-foot span,
.contact-payment-foot strong{
  min-width:0;
  overflow-wrap:anywhere
}

.contact-payment-foot strong{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  text-align:right
}

.contact-payment-notice{
  margin-top:var(--space-3);
  padding:var(--space-3)
}

.contact-payment-notice p{
  margin-top:.5rem
}

.contact-payment-notice .c-actions{
  margin-top:var(--space-3)
}

.contact-confirmation{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:var(--space-5);
  align-items:start;
  padding:var(--space-4);
  border-radius:var(--radius-lg);
  background:#F1E2E5;
  color:#38242A
}

.contact-confirmation-copy{
  display:grid;
  min-width:0;
  gap:var(--space-3)
}

.contact-confirmation-copy .c-kicker{
  margin-bottom:0
}

.contact-confirmation-copy p{
  color:#60434A
}

.contact-checklist{
  display:grid;
  min-width:0;
  gap:0;
  margin:0;
  padding:0;
  list-style:none
}

.contact-check-row{
  display:grid;
  grid-template-columns:2.5rem minmax(7.5rem,11rem) minmax(0,1fr);
  gap:var(--space-3);
  align-items:start;
  min-width:0;
  padding:var(--space-2) 0;
  border-bottom:1px solid color-mix(in srgb,#38242A 14%,transparent)
}

.contact-check-row:first-child{
  border-top:1px solid color-mix(in srgb,#38242A 14%,transparent)
}

.contact-check-row>*{
  min-width:0;
  overflow-wrap:anywhere
}

.contact-check-number{
  display:inline-flex;
  width:2.5rem;
  height:2.5rem;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#873515;
  color:#FFFFFF;
  font-family:var(--font-mono);
  font-size:var(--text-xs);
  line-height:1
}

.contact-check-row strong{
  font-family:var(--font-heading)
}

.contact-check-row>span:last-child{
  color:#60434A
}

.contact-closing-actions{
  display:flex;
  flex:0 0 auto;
  flex-direction:column;
  align-items:center;
  gap:var(--space-2)
}

.contact-closing-actions .c-btn{
  width:100%
}

.contact-page .c-cta-band .c-btn-ghost{
  border-color:rgba(255,255,255,.45);
  background:transparent;
  color:#FFFFFF
}

.contact-page .c-cta-band .c-btn-ghost:hover{
  background:rgba(255,255,255,.1);
  color:#FFFFFF
}

@media (max-width:64rem){
  .contact-page .c-page-hero[data-hero-form="product-visual"]{
    grid-template-columns:minmax(0,1fr);
    align-items:start
  }

  .contact-page .hero-stage{
    width:min(calc(100% - var(--gutter)*2),100%);
    height:auto;
    margin-inline:auto;
    overflow:visible;
    transform:none
  }

  .contact-page .hero-art{
    grid-template-columns:minmax(0,1fr);
    width:min(calc(100% - var(--gutter)*2),100%);
    height:auto;
    margin-inline:auto;
    overflow:visible;
    transform:none
  }

  .contact-page .hero-art>*{
    grid-column:1;
    width:auto
  }

  .contact-form-layout,
  .contact-confirmation{
    grid-template-columns:minmax(0,1fr)
  }

  .contact-form-layout-reverse .contact-form-copy,
  .contact-form-layout-reverse .contact-mail-form{
    grid-column:auto;
    grid-row:auto
  }

  .contact-form-layout-reverse .contact-form-copy{
    order:0
  }

  .contact-form-layout-reverse .contact-mail-form{
    order:1
  }
}

@media (max-width:42rem){
  .contact-page .hero-copy{
    padding:var(--space-3)
  }

  .contact-page .hero-copy h1{
    max-width:none
  }

  .contact-channel-summary,
  .contact-field-pair,
  .contact-payment-grid,
  .contact-option-grid{
    grid-template-columns:minmax(0,1fr)
  }

  .contact-desk-row{
    grid-template-columns:2.5rem minmax(0,1fr)
  }

  .contact-desk-row>.c-badge{
    grid-column:2
  }

  .contact-mail-form,
  .contact-payment-card,
  .contact-confirmation{
    padding:var(--space-3)
  }

  .contact-form-head{
    align-items:flex-start;
    flex-direction:column
  }

  .contact-period-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .contact-copy-facts div{
    grid-template-columns:minmax(0,1fr)
  }

  .contact-check-row{
    grid-template-columns:2.25rem minmax(0,1fr);
    gap:var(--space-2)
  }

  .contact-check-row>:nth-child(3){
    grid-column:2
  }

  .contact-payment-foot{
    align-items:flex-start;
    flex-direction:column
  }

  .contact-payment-foot strong{
    text-align:left
  }

  .contact-closing-actions{
    width:100%;
    align-items:stretch
  }
}
