/* New reading surfaces stay within the original petrol / ice studio system. */
#approach { background: #071e28; border-top: 1px solid #abcbd421; scroll-margin-top: 90px; }
#contact { scroll-margin-top: 90px; }
#approach .process-shell { max-width: 1240px; }
#approach .process-heading { display: flex; justify-content: space-between; align-items: end; gap: 60px; margin-bottom: 58px; }
#approach .process-heading h2 { margin: 0; max-width: 710px; font: 550 clamp(39px, 4.5vw, 64px)/1.1 Manrope, Arial, sans-serif; letter-spacing: -.04em; }
#approach h2 em, #approach .process-questions h3 em { color: #a9cbd3; font-style: normal; }
#approach .process-heading > p { max-width: 345px; margin: 0 0 5px; color: #b3cbd2; font-size: 15px; line-height: 1.75; }
#approach .process-steps { gap: 26px; }
#approach .process-steps li { min-height: 234px; padding-top: 23px; }
#approach .process-steps h3 { margin: 0 0 12px; font-size: 21px; font-weight: 550; letter-spacing: -.025em; }
#approach .process-steps p { max-width: 245px; font-size: 13px; }
#approach .process-steps small { color: #b0d1d9; font-size: 11px; }
#approach .process-questions { display: grid; grid-template-columns: .95fr 1.2fr; gap: 95px; margin-top: 75px; padding-top: 73px; border-top: 1px solid #abcbd434; }
#approach .process-questions h3 { margin: 0; font: 550 clamp(32px, 3.4vw, 48px)/1.14 Manrope, Arial, sans-serif; letter-spacing: -.035em; }
#approach .process-questions > div:first-child > p { max-width: 310px; margin: 21px 0 15px; color: #b3cbd2; font-size: 15px; line-height: 1.75; }
#approach .question-list { border-top: 1px solid #abcbd434; }
#approach .question-list details { border-bottom: 1px solid #abcbd434; }
#approach .question-list summary { display: flex; align-items: center; justify-content: space-between; gap: 28px; min-height: 82px; padding: 17px 0; color: #e8f3f5; font-size: clamp(16px, 1.35vw, 19px); font-weight: 550; line-height: 1.45; cursor: pointer; list-style: none; }
#approach .question-list summary::-webkit-details-marker { display: none; }
#approach .question-list summary > span { position: relative; flex: 0 0 22px; height: 22px; border: 1px solid #9fc9d3; border-radius: 50%; }
#approach .question-list summary > span::before, #approach .question-list summary > span::after { content: ''; position: absolute; top: 50%; left: 50%; width: 8px; height: 1px; background: #bce9ee; transform: translate(-50%, -50%); }
#approach .question-list summary > span::after { transform: translate(-50%, -50%) rotate(90deg); transition: transform .2s ease; }
#approach .question-list details[open] summary > span::after { transform: translate(-50%, -50%); }
#approach .question-list details > p { max-width: 570px; margin: -4px 42px 24px 0; color: #b3cbd2; font-size: 14px; line-height: 1.75; }
#approach .question-list summary:focus-visible { outline: 2px solid #b8edf2; outline-offset: 4px; border-radius: 4px; }
#contact .form-trap { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
#contact .form-recovery { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; }
#contact .form-copy { display: inline-flex; align-items: center; min-height: 32px; padding: 0; border: 0; background: transparent; color: #d8f4f6; font: inherit; font-size: 13px; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
#contact .form-copy[hidden] { display: none; }
#contact .form-copy:focus-visible { outline: 2px solid #b8edf2; outline-offset: 4px; }
#contact .form-status[data-state="error"] { color: #ffd0c8; }
#contact .form-status[data-state="success"] { color: #c9f6e5; }
#contact .button-ice:disabled { opacity: .6; cursor: wait; }
#contact .form-hint { font-size: 12px; line-height: 1.6; }
.site-footer a:not(.wordmark) { display: inline-flex; align-items: center; min-height: 32px; }
@media (max-width: 1050px) {
  #approach .process-questions { gap: 45px; }
}
@media (max-width: 760px) {
  #approach { padding: 72px 0 76px; }
  #approach .process-heading { display: block; margin-bottom: 38px; }
  #approach .process-heading h2 { font-size: clamp(32px, 8vw, 45px); }
  #approach .process-heading > p { max-width: 540px; margin-top: 20px; font-size: 14px; }
  #approach .process-steps { gap: 24px; }
  #approach .process-steps li { min-height: 0; padding-top: 18px; }
  #approach .process-steps li::before { margin-top: 9px; }
  #approach .process-steps h3 { font-size: 19px; }
  #approach .process-steps p { max-width: 520px; }
  #approach .process-steps small { padding-top: 0; }
  #approach .process-questions { grid-template-columns: 1fr; gap: 30px; margin-top: 50px; padding-top: 52px; }
  #approach .process-questions h3 { font-size: clamp(30px, 7.8vw, 42px); }
  #approach .process-questions > div:first-child > p { margin-top: 15px; }
  #approach .question-list summary { min-height: 72px; font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  #approach .question-list summary > span::after { transition: none; }
}