/* Apartments page. Everything is built from the site's own tokens: Reckless for display, the plum ink, the pink on
   green, and the picture frame with three rounded corners. The one bold element is the turn: the architect's own
   furnished renders of each layout, turned corner to corner by dragging, in every chapter. */

/* overview: the five kinds of home side by side, on the green band */
.apt_index_grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1.25rem; }
.apt_index_item { display: flex; flex-direction: column; gap: .3rem; text-decoration: none; color: var(--base-color-neutral--light-pink); }
.apt_index_img {
  display: block; aspect-ratio: 4 / 3; margin-bottom: .8rem; overflow: hidden;
  background: var(--base-color-neutral--light-pink);
  border-radius: var(--border-radius--main-small) 0 var(--border-radius--main-small) var(--border-radius--main-small);
}
.apt_index_img img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); transition: transform .6s ease; }
.apt_index_item:hover .apt_index_img img { transform: scale(1.1); }
.apt_index_name { font-family: var(--fonts--reckless-font); font-size: 1.6rem; line-height: 1.1; }
.apt_index_size, .apt_index_price { font-size: .95rem; }
.apt_index_price { font-family: var(--fonts--reckless-font); font-size: 1.15rem; }
.apt_index_left { font-size: .85rem; opacity: .7; }
.apt_note { color: var(--base-color-neutral--light-pink); opacity: .75; font-size: .85rem; margin: 2.5rem 0 0; max-width: 60em; }

/* a chapter per kind of home */
.apt_chapter { position: relative; scroll-margin-top: 5rem; }
.apt_chapter_head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 2rem 4rem; }
.apt_chapter_name {
  font-family: var(--fonts--reckless-font); font-weight: 300; margin: 0;
  font-size: clamp(3rem, 7vw, 7.25rem); line-height: .95; letter-spacing: -.025em; max-width: 9em;
}
.apt_chapter_facts { display: flex; gap: 2.5rem; margin: 0 0 .6rem; }
.apt_chapter_facts div { display: flex; flex-direction: column; gap: .25rem; }
.apt_chapter_facts dt { font-size: .85rem; opacity: .6; }
.apt_chapter_facts dd { margin: 0; font-family: var(--fonts--reckless-font); font-size: 1.75rem; line-height: 1.1; white-space: nowrap; }
.apt_suits { font-family: var(--fonts--reckless-font); font-style: italic; font-size: 1.5rem; margin: 1.2rem 0 0; opacity: .85; }

/* the turn: the architect's furnished renders, corner to corner, in the site's picture frame */
.apt_turn { margin-top: 2.5rem; }
.apt_turn_frame {
  position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #e6e5e3; cursor: grab; touch-action: pan-y;
  border-radius: var(--border-radius--main-small) 0 var(--border-radius--main-small) var(--border-radius--main-small);
  user-select: none; -webkit-user-select: none;
}
.apt_turn_frame:active { cursor: grabbing; }
.apt_turn_frame:focus-visible { outline: 2px solid var(--base-color-neutral--dark); outline-offset: 3px; }
.apt_turn_img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transition: opacity .7s ease, transform .5s ease; pointer-events: none;
}
.apt_turn_img.is-on { opacity: 1; }
.apt_turn.is-frames .apt_turn_img { transition: transform .5s ease; }
.apt_turn.is-plan .apt_turn_img { object-fit: contain; }
.apt_turn.is-zoom .apt_turn_frame { cursor: zoom-out; }
.apt_turn.is-zoom .apt_turn_img { transform: scale(2.2); }
.apt_turn_arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 3rem; height: 3rem; border-radius: 50%; border: 0; cursor: pointer;
  background: rgba(255, 255, 255, .88); color: var(--base-color-neutral--dark); font-size: 1.6rem; line-height: 1;
  box-shadow: 0 .4rem 1.2rem rgba(32, 3, 20, .12); transition: background .2s ease;
}
.apt_turn_arrow:hover { background: #fff; }
.apt_turn_arrow:focus-visible { outline: 2px solid var(--base-color-neutral--dark); outline-offset: 2px; }
.apt_turn_arrow.is-prev { left: 1.25rem; }
.apt_turn_arrow.is-next { right: 1.25rem; }
.apt_turn.is-plan .apt_turn_arrow, .apt_turn.is-plan .apt_turn_dots { display: none; }
.apt_turn_dots { position: absolute; left: 50%; bottom: 1.1rem; transform: translateX(-50%); display: flex; gap: .45rem; z-index: 2; }
.apt_turn_dots i { width: .5rem; height: .5rem; border-radius: 50%; background: rgba(32, 3, 20, .25); transition: background .3s ease, transform .3s ease; }
.apt_turn_dots i.is-on { background: var(--base-color-neutral--dark); transform: scale(1.25); }
.apt_turn_hint { position: absolute; left: 1.25rem; bottom: 1rem; margin: 0; font-size: .8rem; opacity: .55; pointer-events: none; }
.apt_turn_bar { display: flex; align-items: center; justify-content: space-between; gap: .75rem 2rem; flex-wrap: wrap; margin-top: 1rem; }
.apt_turn_name { margin: 0; font-family: var(--fonts--reckless-font); font-size: 1.2rem; }
.apt_pills { display: flex; flex-wrap: wrap; gap: .4rem; }
.apt_pills button {
  font: inherit; font-size: .9rem; color: var(--base-color-neutral--dark); background: transparent;
  border: 1px solid rgba(32, 3, 20, .3); border-radius: 2rem; padding: .45rem .95rem; cursor: pointer;
}
.apt_pills button[aria-pressed="true"] { background: var(--base-color-neutral--dark); border-color: var(--base-color-neutral--dark); color: #fff; }
.apt_pills button:focus-visible { outline: 2px solid var(--base-color-neutral--dark); outline-offset: 2px; }
.apt_turn_credit { margin: .8rem 0 0; font-size: .8rem; opacity: .6; }

/* the words under the stage */
.apt_chapter_body { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, .9fr); gap: 2rem 3.5rem; margin-top: 3rem; align-items: start; }
.apt_lead { margin: 0; font-size: 1.15rem; line-height: 1.5; }
.apt_list { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(32, 3, 20, .15); }
.apt_list li { padding: .6rem 0; border-bottom: 1px solid rgba(32, 3, 20, .15); }
.apt_actions { display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; }
.apt_link { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.apt_plans_links { margin: 0; font-size: .85rem; opacity: .75; line-height: 1.6; }
.apt_plans_links a { color: inherit; }
.apt_photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; margin: 3rem 0 0; }
.apt_photos.is-three { grid-template-columns: 1.4fr 1fr 1fr; }
.apt_photos figure { margin: 0; }
.apt_photos img { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

/* finishes, buying steps and questions */
.apt_specs { display: grid; gap: 2rem; }
.apt_specs h3, .apt_steps h3 { font-family: var(--fonts--reckless-font); font-weight: 400; font-size: 1.6rem; margin: 0 0 .6rem; }
.apt_specs dl { margin: 0; display: grid; grid-template-columns: minmax(8rem, auto) 1fr; border-top: 1px solid rgba(32, 3, 20, .15); }
.apt_specs dt, .apt_specs dd { margin: 0; padding: .55rem 0; border-bottom: 1px solid rgba(32, 3, 20, .15); }
.apt_specs dt { opacity: .65; padding-right: 1rem; }
.apt_steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.apt_steps li { background: var(--base-color-neutral--light-yellow); border-radius: var(--border-radius--main-small); padding: 1.5rem; }
.apt_steps p { margin: 0; }
.apt_faq { border-top: 1px solid rgba(32, 3, 20, .15); }
.apt_faq details { border-bottom: 1px solid rgba(32, 3, 20, .15); }
.apt_faq summary {
  cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1rem;
  padding: 1.1rem 0; font-family: var(--fonts--reckless-font); font-size: 1.45rem; line-height: 1.2;
}
.apt_faq summary::-webkit-details-marker { display: none; }
.apt_faq summary::after { content: "+"; font-family: var(--fonts--main-font); }
.apt_faq details[open] summary::after { content: "−"; }
.apt_faq details p { margin: 0; padding: 0 0 1.2rem; max-width: 40em; }

@media (prefers-reduced-motion: reduce) {
  .apt_index_img img, .apt_turn_img, .apt_turn_dots i { transition: none; }
}
@media (max-width: 991px) {
  .apt_index_grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .apt_chapter_head { grid-template-columns: 1fr; }
  .apt_chapter_facts { gap: 1.5rem; flex-wrap: wrap; }
  .apt_chapter_body { grid-template-columns: 1fr 1fr; }
  .apt_actions { grid-column: 1 / -1; }
  .apt_turn_frame { aspect-ratio: 4 / 3; }
  .apt_turn_arrow { width: 2.5rem; height: 2.5rem; font-size: 1.3rem; }
  .apt_turn_arrow.is-prev { left: .6rem; }
  .apt_turn_arrow.is-next { right: .6rem; }
  .apt_turn_hint { display: none; }
  .apt_steps { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .apt_index_grid { grid-template-columns: 1fr 1fr; gap: 1.5rem 1rem; }
  .apt_index_name { font-size: 1.3rem; }
  .apt_chapter_name { font-size: 3rem; }
  .apt_chapter_facts dd { font-size: 1.35rem; }
  .apt_suits { font-size: 1.25rem; }
  .apt_chapter_body { grid-template-columns: 1fr; }
  .apt_photos, .apt_photos.is-three { grid-template-columns: 1fr; }
}
