/* Project builder — Phase 6
   Focused, large type, quiet motion. */

html:has(.start){
  scroll-behavior:smooth;
  overflow-x:clip;
}

.start{ overflow-x:clip; }

.start-wrap{
  width:min(var(--container), 100%);
  margin-inline:auto;
  padding-left:max(var(--page-gutter, 1.25rem), env(safe-area-inset-left, 0px));
  padding-right:max(var(--page-gutter, 1.25rem), env(safe-area-inset-right, 0px));
}

.start .muted{ color:var(--muted); }

.start .text-link{
  display:inline-flex;
  align-items:center;
  background:none;
  border:0;
  padding:0;
  color:var(--paper);
  font:inherit;
  font-size:.88rem;
  text-decoration:none;
  border-bottom:1px solid var(--border-strong);
  cursor:pointer;
}

.start .text-link:hover{ border-color:var(--accent); }

.start-hero{
  padding:clamp(3.25rem, 7vw, 6rem) 0 clamp(1.5rem, 3vw, 2.5rem);
}

.start-hero h1{
  margin:.4rem 0 .85rem;
  font-size:clamp(2.4rem, 7.5vw, 6.4rem);
  line-height:.9;
  letter-spacing:-.045em;
  max-width:12ch;
  text-wrap:pretty;
}

.start-lead{
  max-width:34rem;
  margin:0;
  color:var(--muted);
  font-size:1.08rem;
}

.start-layout{
  display:grid;
  grid-template-columns:minmax(0, 1.4fr) minmax(16rem, .7fr);
  gap:2.5rem 3.5rem;
  align-items:start;
  padding-bottom:6rem;
}

.start-form{ gap:2rem; }

.enquiry-success{
  padding:.35rem 0 2.2rem;
}

.enquiry-success[hidden],
form[hidden]{
  display:none !important;
}

.enquiry-success h2{
  margin:.35rem 0 .8rem;
  font-size:clamp(2.4rem, 7vw, 4.6rem);
  line-height:.95;
  letter-spacing:-.04em;
}

.enquiry-success .muted{
  max-width:34rem;
  margin:0 0 1.5rem;
}

.start-progress{
  list-style:none;
  display:none;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:.4rem;
  margin:0;
  padding:0;
}

.js .start-progress{ display:grid; }

.start-progress button{
  width:100%;
  min-height:var(--tap, 44px);
  padding:.45rem .2rem;
  border:0;
  border-bottom:1px solid var(--line);
  background:transparent;
  color:var(--muted);
  font:inherit;
  font-size:clamp(.62rem, 1.6vw, .7rem);
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  cursor:pointer;
  touch-action:manipulation;
}

.start-progress [aria-current="step"]{
  color:var(--paper);
  border-bottom-color:var(--accent);
}

.start-step{ margin:0; padding:0; border:0; }

.start-step legend{
  font-family:var(--display);
  font-size:clamp(1.9rem, 3.6vw, 2.8rem);
  font-weight:400;
  letter-spacing:-.03em;
  color:var(--paper);
}

.start-hint{ margin:.55rem 0 1.4rem; max-width:40rem; }

.js .start-step:not(.is-active){ display:none; }
.js .starter-hint--noscript{ display:none; }
html:not(.js) [data-review]{ display:none; }

.start-products{ display:grid; gap:.7rem; }

.start-product{
  display:grid;
  margin:0;
  padding:1.15rem 1.2rem;
  border:1px solid var(--line);
  cursor:pointer;
  color:var(--paper);
}

.start-product input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.start-product span{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:.25rem 1.25rem;
}

.start-product strong{
  font-family:var(--display);
  font-size:1.7rem;
  font-weight:400;
  letter-spacing:-.03em;
}

.start-product b{
  font-weight:600;
  font-size:1rem;
  justify-self:end;
}

.start-product em{
  grid-column:1 / -1;
  font-style:normal;
  color:var(--muted);
  font-size:.95rem;
}

.start-product:has(input:checked){
  border-color:rgba(255,122,0,.55);
  background:rgba(255,122,0,.07);
}

.start-product:focus-within{
  outline:2px solid var(--accent);
  outline-offset:2px;
}

.start-questions__intro{
  margin:0 0 1.4rem;
  color:var(--muted);
  max-width:40rem;
}

.start-q{
  margin:0 0 1.15rem;
  padding:0;
  border:0;
}

.start-q legend{
  font-family:var(--sans);
  font-size:.95rem;
  font-weight:600;
  letter-spacing:-.01em;
  margin-bottom:.55rem;
}

.start-q__opts{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}

.start-opt{
  display:flex;
  align-items:center;
  gap:.5rem;
  min-height:44px;
  margin:0;
  padding:.45rem .8rem;
  border:1px solid var(--line);
  cursor:pointer;
  font-weight:500;
}

.start-opt input{
  width:16px;
  height:16px;
  accent-color:var(--accent);
}

.start-opt:has(input:checked){
  border-color:rgba(255,122,0,.55);
  background:rgba(255,122,0,.07);
}

.start-opt:focus-within{
  outline:2px solid var(--accent);
  outline-offset:2px;
}

.start-step textarea{ min-height:110px; }

.start-review section{
  padding:1.15rem 0;
  border-top:1px solid var(--line);
}

.start-review__head{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:1rem;
  margin-bottom:.55rem;
}

.start-review h2{
  margin:0;
  font-size:1.15rem;
}

.start-review dl{ margin:0; }

.start-review dl > div,
.start-review [data-review-features] > div{
  display:grid;
  grid-template-columns:10rem minmax(0, 1fr);
  gap:.6rem;
  padding:.4rem 0;
}

.start-review dt{
  margin:0;
  color:var(--muted);
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.start-review dd{ margin:0; white-space:pre-wrap; }

.start-pay-note{
  margin:1.2rem 0;
  color:var(--muted);
  max-width:38rem;
}

.start-nav{
  display:none;
  justify-content:space-between;
  gap:.75rem;
}

.js .start-nav:not([hidden]){ display:flex; }

.start-nav .btn,
.start-nav .btn-ghost{ min-width:8.5rem; }

.start-alt{ margin-top:2rem; }

.start-aside{
  position:sticky;
  top:calc(var(--header-h) + 1.25rem);
}

.start-summary{
  border-top:1px solid var(--line);
  padding-top:1rem;
}

.start-summary summary{
  cursor:pointer;
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
  list-style:none;
}

.start-summary summary::-webkit-details-marker{ display:none; }

.start-summary__body{ padding-top:1rem; }

.start-summary__price{
  margin:.35rem 0 0;
  font-size:1.35rem;
  font-weight:600;
}

.hp{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}

@media(prefers-reduced-motion:no-preference){
  .start-product,
  .start-opt{
    transition:border-color .3s var(--ease), background .3s var(--ease);
  }
}

@media(prefers-reduced-motion:reduce){
  html:has(.start){ scroll-behavior:auto; }
}

@media(max-width:1024px){
  .start-layout{
    grid-template-columns:1fr;
    gap:2rem;
  }
  .start-aside{ position:static; }
  .start-summary{ padding:.35rem 0 0; }
  .start-summary:not([open]) .start-summary__body{ display:none; }
}

@media(max-width:768px){
  .start-product span{ grid-template-columns:1fr; }
  .start-product b{ justify-self:start; }
  .start-review dl > div,
  .start-review [data-review-features] > div{ grid-template-columns:1fr; gap:.15rem; }
}

@media(max-width:639px){
  .form-grid{ grid-template-columns:1fr; }
  .start-nav{ flex-direction:column-reverse; }
  .start-nav .btn,
  .start-nav .btn-ghost{ width:100%; }
  .start{ overflow-x:clip; }
}
