/* Final Atelier refinement: preserve content and section order, improve craft and usability. */
.atelier-page{
  --atelier-readable:68ch;
  text-rendering:optimizeLegibility;
}

.atelier-page ::selection{
  background:#9c4c55;
  color:#fffaf7;
}

.atelier-page :where(p,address){
  text-wrap:pretty;
}

.atelier-page :where(.atelier-link,.atelier-button,summary,button){
  -webkit-tap-highlight-color:rgba(156,76,85,.16);
}

.atelier-process{
  padding-block:clamp(76px,7.3vw,118px) clamp(82px,7.6vw,124px);
}

.atelier-process__heading{
  margin-bottom:clamp(38px,4vw,60px);
}

.atelier-process__heading h2{
  max-width:10ch;
  font-size:clamp(48px,5.2vw,82px);
  line-height:1.01;
}

.atelier-process__steps{
  scrollbar-width:none;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
}

.atelier-process__steps::-webkit-scrollbar{
  display:none;
}

.atelier-process__steps li{
  display:flex;
}

.atelier-process__steps button{
  height:100%;
  min-height:112px;
}

.atelier-process__steps button strong{
  font-size:clamp(21px,1.7vw,30px);
  line-height:1.08;
}

.atelier-process__panels{
  min-height:238px;
}

.atelier-process__panel h3{
  max-width:12ch;
  font-size:clamp(38px,3.5vw,60px);
  line-height:1.04;
}

.atelier-process__panel p{
  max-width:var(--atelier-readable);
  font-size:clamp(18px,1.14vw,21px);
}

.atelier-prices__heading h2{
  font-size:clamp(44px,4.3vw,62px);
}

.atelier-prices .atelier-price{
  column-gap:clamp(24px,4vw,64px);
}

.atelier-prices .atelier-price__amount{
  font-size:clamp(27px,2.2vw,34px);
}

.atelier-intro--prepared .atelier-intro__copy p:not(.atelier-kicker){
  max-width:48ch;
}

.atelier-second-story__copy p:not(.atelier-second-story__value),
.atelier-brides__copy p:not(.atelier-kicker),
.atelier-faq details p{
  max-width:var(--atelier-readable);
}

.atelier-faq summary{
  min-height:68px;
  padding-block:20px;
}

.atelier-faq details[open] summary{
  color:var(--atelier-accent);
}

.atelier-contact__details address{
  color:#fffaf7;
}

@media(hover:hover){
  .atelier-page :where(.atelier-link,.atelier-button,summary,button){
    transition-duration:.18s;
  }

  .atelier-intro__detail:hover img,
  .atelier-intro__portrait:hover img,
  .atelier-brides__portrait:hover img,
  .atelier-brides__couple:hover img{
    transform:none;
  }
}

@media(max-width:1180px){
  .atelier-process__steps{
    scroll-padding-inline:5vw;
  }

  .atelier-process__steps::before{
    left:5vw;
    right:5vw;
  }
}

@media(max-width:820px){
  .atelier-hero h1{
    font-size:clamp(44px,12vw,64px);
  }

  .atelier-hero__line{
    max-width:11ch;
    font-size:clamp(32px,9vw,46px);
    line-height:1.08;
  }

  .atelier-process{
    padding-block:58px 64px;
  }

  .atelier-process__heading h2{
    max-width:11ch;
    font-size:clamp(39px,10.8vw,54px);
    line-height:1.03;
  }

  .atelier-process__steps{
    scroll-padding-inline:6vw;
  }

  .atelier-process__steps::before{
    left:6vw;
    right:6vw;
  }

  .atelier-process__steps li{
    flex-basis:min(168px,44vw);
  }

  .atelier-process__steps button{
    min-height:100px;
  }

  .atelier-process__steps button strong{
    font-size:21px;
  }

  .atelier-process__panels{
    min-height:340px;
    margin-top:30px;
  }

  .atelier-process__panel h3{
    max-width:15ch;
    font-size:clamp(32px,8.8vw,42px);
    line-height:1.08;
  }

  .atelier-process__panel p{
    font-size:16px;
    line-height:1.72;
  }

  .atelier-prices__heading h2,
  .atelier-intro h2,
  .atelier-brides h2{
    font-size:clamp(37px,10vw,48px);
    line-height:1.08;
  }

  .atelier-second-story h2,
  .atelier-faq h2{
    font-size:clamp(36px,9.4vw,42px);
  }

  .atelier-prices .atelier-price h3{
    font-size:27px;
  }

  .atelier-intro__detail img,
  .atelier-brides__portrait img,
  .atelier-brides__couple img{
    transition:none;
  }
}

@media(max-width:480px){
  .atelier-hero__copy{
    padding-block:34px 38px;
  }

  .atelier-hero__intro{
    margin-block:20px 24px;
  }

  .atelier-button{
    width:100%;
    justify-content:center;
    text-align:center;
  }

  .atelier-process__panels{
    min-height:370px;
  }

  .atelier-process__steps{
    gap:20px;
  }

  .atelier-process__steps li{
    flex-basis:142px;
  }

  .atelier-process__steps button{
    min-height:116px;
  }

  .atelier-process__steps button strong{
    font-size:19px;
  }

  .atelier-second-story__copy{
    grid-template-columns:64px minmax(0,1fr);
  }

  .atelier-faq summary{
    gap:14px;
    font-size:15px;
  }
}

@media(prefers-reduced-motion:reduce){
  .atelier-page *,
  .atelier-page *::before,
  .atelier-page *::after{
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
  }
}