/* Interior chapter: the section order and measured motion follow the MAKHNO
   Studio hub, while the typography, palette, copy and images belong to GAZDA. */
.pg-inside { background: #080808; color: var(--gz-statement); overflow: clip; }
.pg-inside [hidden] { display: none !important; }
.pg-inside .gz-micro { font-family: var(--gz-font-display); letter-spacing: .08em; }
.pg-inside__hero { position: relative; min-height: 90svh; }
.pg-inside__back { position: absolute; top: 11rem; left: 2rem; }
.pg-inside__hero-copy { position: absolute; top: 37.06vh; left: 50%; width: min(62rem, calc(100% - 4rem)); transform: translateX(-50%); display: grid; justify-items: center; gap: 1.5rem; text-align: center; }
.pg-inside__hero-title { font: 400 5rem/1.05 var(--gz-font-display); letter-spacing: .01em; text-transform: uppercase; }
.pg-inside__hero-description { max-width: 47rem; font-size: 1.3rem; line-height: 1.8; }
.pg-inside__scroll { position: absolute; top: 75.5vh; left: 50%; transform: translateX(-50%); }

/* Reference's 15% → 0 scroll-width reveal. The available imagery is a scene
   sequence, so its control pauses the sequence rather than claiming a video. */
.pg-inside__film { min-height: 100svh; }
.pg-inside__film-frame { position: relative; height: 100svh; overflow: hidden; clip-path: inset(0 var(--inside-clip, 0%) 0 var(--inside-clip, 0%)); }
.pg-inside__film-scene { position: absolute; inset: 0; opacity: 0; transform: scale(1.08); transition: opacity 1.2s var(--gz-ease-makhno), transform 6s linear; }
.pg-inside__film-scene.is-active { opacity: 1; transform: scale(1); }
.pg-inside__film-scene .gz-ph { width: 100%; height: 100%; object-fit: cover; }
.pg-inside__film-shade { position: absolute; inset: 0; background: linear-gradient(180deg, #08080840, transparent 40%, #08080875); pointer-events: none; }
.pg-inside__film-caption { position: absolute; left: 0; right: 0; bottom: 2.5rem; display: flex; justify-content: space-between; align-items: end; gap: 2rem; color: #fff4e3; text-shadow: 0 .1rem .5rem #080808; }
.pg-inside__film-control { position: absolute; left: 50%; top: 50%; width: 9rem; aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; transform: translate(-50%, -50%); color: #fff4e3; border: 1px solid #fff4e3aa; background: #08080858; font-size: 2.5rem; transition: background .45s var(--gz-ease-makhno), scale .45s var(--gz-ease-makhno); }
.pg-inside__film-control:hover { background: #080808aa; scale: 1.08; }

.pg-inside__section-title { font: 400 3rem/1.2 var(--gz-font-display); letter-spacing: .01em; text-transform: uppercase; text-wrap: balance; }
.pg-inside__introduction { display: grid; grid-template-columns: 38rem minmax(0, 1fr); gap: 0; min-height: 78.5rem; margin-top: 12rem; padding: 0; align-items: start; }
.pg-inside__introduction-copy { display: grid; align-content: start; justify-items: start; gap: 2rem; padding: 0 2rem; }
.pg-inside__introduction-copy .pg-inside__section-title { max-width: 12ch; }
.pg-inside__introduction-copy .pg-inside__section-title + p { margin-top: 6rem; }
.pg-inside__introduction-lead { max-width: 42rem; font: 400 clamp(2rem, 2.3vw, 3.2rem)/1.33 var(--gz-font-display); }
.pg-inside__introduction-detail { max-width: 43rem; font-size: 1.55rem; line-height: 1.65; }
.pg-inside__carousel { min-width: 0; }
.pg-inside__carousel-viewport { position: relative; height: 72rem; overflow: hidden; }
.pg-inside__carousel-slide { position: absolute; inset: 0; margin: 0; opacity: 0; visibility: hidden; transform: translateX(6%); transition: opacity 1.2s var(--gz-ease-makhno), transform 1.2s var(--gz-ease-makhno), visibility 1.2s; }
.pg-inside__carousel-slide.is-active { opacity: 1; visibility: visible; transform: none; z-index: 1; }
.pg-inside__carousel-image { position: absolute; inset: 0; overflow: hidden; }
.pg-inside__carousel-image .gz-ph { width: 100%; height: 100%; object-fit: cover; transform: scale(1.06); transition: transform 1.2s var(--gz-ease-makhno); }
.pg-inside__carousel-slide.is-active .gz-ph { transform: scale(1); }
.pg-inside__carousel-slide figcaption { position: absolute; z-index: 1; inset: auto 0 0; display: flex; justify-content: space-between; align-items: end; gap: 1rem; padding: 4rem 2rem 2rem; color: #fff4e3; background: linear-gradient(transparent, #080808a8); }
.pg-inside__carousel-slide figcaption > span { font: 400 clamp(2.6rem, 3vw, 4.2rem)/1 var(--gz-font-display); text-transform: uppercase; }
.pg-inside__carousel-zone { position: absolute; z-index: 2; top: 0; bottom: 9rem; width: 50%; }
.pg-inside__carousel-zone--prev { left: 0; cursor: w-resize; }
.pg-inside__carousel-zone--next { right: 0; cursor: e-resize; }
.pg-inside__carousel-controls { display: flex; align-items: center; justify-content: space-between; margin-top: 2rem; font-size: 1.3rem; letter-spacing: .1em; }
.pg-inside__carousel-controls button { min-width: 4.5rem; min-height: 4.5rem; font-size: 2.6rem; transition: transform .45s var(--gz-ease-makhno); }
.pg-inside__carousel-controls button:first-child:hover { transform: translateX(-.6rem); }
.pg-inside__carousel-controls button:last-child:hover { transform: translateX(.6rem); }

.pg-inside__routes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 4rem; min-height: 75.8rem; padding-block: 4rem 12rem; }
.pg-inside__routes-header { grid-column: 1; grid-row: 1; display: grid; align-content: start; gap: 2.2rem; margin-bottom: 0; }
.pg-inside__routes-header .pg-inside__section-title { max-width: 18ch; font-size: 3rem; line-height: 1.2; }
.pg-inside__routes-header .pg-inside__section-title span { font: 400 1.8rem/1 var(--gz-font-text); letter-spacing: .04em; vertical-align: top; }
.pg-inside__routes-grid { display: contents; }
.pg-inside__routes-preview { grid-column: 1; grid-row: 2; align-self: start; position: relative; width: 20rem; height: 26rem; margin-top: 3rem; overflow: hidden; }
.pg-inside__routes-preview-image { position: absolute; inset: 0; opacity: 0; clip-path: inset(100% 0 0); transition: opacity .7s var(--gz-ease-makhno), clip-path .7s var(--gz-ease-makhno); }
.pg-inside__routes-preview-image.is-active { opacity: 1; clip-path: inset(0); z-index: 1; }
.pg-inside__routes-preview-image .gz-ph { width: 100%; height: 100%; object-fit: cover; }
.pg-inside__routes-table { grid-column: 2; grid-row: 1 / span 2; align-self: start; }
.pg-inside__routes-table-head { display: grid; grid-template-columns: 4rem 24rem 1fr; gap: 0; padding-bottom: 2rem; font: 400 1.2rem/1.4 var(--gz-font-text); letter-spacing: .04em; text-transform: uppercase; }
.pg-inside__routes-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--gz-line); }
.pg-inside__route { position: relative; border-bottom: 1px solid var(--gz-line); }
.pg-inside__route::after { content: ''; position: absolute; bottom: -1px; left: 0; right: 0; border-bottom: 2px solid var(--gz-wordmark); transform: scaleX(0); transform-origin: left; transition: transform .7s var(--gz-ease-makhno); }
.pg-inside__route.is-active::after, .pg-inside__route:hover::after { transform: scaleX(1); }
.pg-inside__route > a { display: grid; grid-template-columns: 4rem minmax(0, 1fr) 3rem; gap: 1.4rem; align-items: center; min-height: 10.4rem; }
.pg-inside__route-number { align-self: start; padding-top: 3rem; font-size: 1.2rem; }
.pg-inside__route-text { display: grid; gap: .5rem; }
.pg-inside__route-text strong { font: 400 2.4rem/1.1 var(--gz-font-display); text-transform: uppercase; }
.pg-inside__route-text small { font-size: 1.3rem; color: var(--gz-caption); }
.pg-inside__route-arrow { opacity: 0; transform: translateX(-2rem); font-size: 2.4rem; transition: opacity .7s var(--gz-ease-makhno), transform .7s var(--gz-ease-makhno); }
.pg-inside__route.is-active .pg-inside__route-arrow, .pg-inside__route:hover .pg-inside__route-arrow { opacity: 1; transform: none; }

.pg-inside__cover { position: relative; height: 100svh; overflow: hidden; }
.pg-inside__cover-image { position: absolute; inset: -12% 0; overflow: hidden; }
.pg-inside__cover-image .gz-ph { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.pg-inside__cover::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, #08080845, transparent 48%, #08080872); }
.pg-inside__cover-caption { position: absolute; z-index: 1; inset: auto 0 3rem; display: flex; justify-content: space-between; color: #fff4e3; }

.pg-inside__portfolio { padding-block: 10rem 17rem; }
.pg-inside__portfolio-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4rem; padding-inline: 2rem; }
.pg-inside__portfolio-sticky { position: sticky; top: 0; height: calc(100svh - 2rem); padding: 6rem 0 3rem; display: flex; flex-direction: column; align-items: flex-start; overflow: hidden; }
.pg-inside__portfolio-sticky .pg-inside__section-title { max-width: 12ch; margin-top: 2.2rem; font-size: 3rem; line-height: 1.2; }
.pg-inside__portfolio-tabs { display: flex; gap: 2.5rem; margin: 3rem 0; }
.pg-inside__portfolio-tabs button { display: inline-flex; align-items: center; gap: .8rem; font-size: 1.25rem; text-transform: uppercase; letter-spacing: .06em; opacity: .55; transition: opacity .4s var(--gz-ease-makhno); }
.pg-inside__portfolio-tabs button::before { content: ''; display: block; width: 1.1rem; aspect-ratio: 1; border: 1px solid currentColor; border-radius: 50%; }
.pg-inside__portfolio-tabs button[aria-selected=true] { opacity: 1; }
.pg-inside__portfolio-tabs button[aria-selected=true]::before { background: currentColor; }
.pg-inside__portfolio-panel { width: min(100%, 46rem); }
.pg-inside__portfolio-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--gz-line); }
.pg-inside__portfolio-list li { border-bottom: 1px solid var(--gz-line); opacity: .3; transition: opacity .6s var(--gz-ease-makhno); }
.pg-inside__portfolio-list li.is-active, .pg-inside__portfolio-list li:hover { opacity: 1; }
.pg-inside__portfolio-list a { display: grid; grid-template-columns: 2.5rem 1fr 2rem; gap: 1rem; min-height: 5.44rem; align-items: center; }
.pg-inside__portfolio-list span { font: 400 1.1rem/1 var(--gz-font-text); }
.pg-inside__portfolio-list strong { font: 400 clamp(1.9rem, 2.4vw, 3.3rem)/1.04 var(--gz-font-display); text-transform: uppercase; }
.pg-inside__portfolio-list b { font-size: 1.9rem; font-weight: 400; transform: translateX(-1rem); opacity: 0; transition: transform .6s var(--gz-ease-makhno), opacity .6s var(--gz-ease-makhno); }
.pg-inside__portfolio-list li.is-active b, .pg-inside__portfolio-list li:hover b { transform: none; opacity: 1; }
.pg-inside__portfolio-bottom { width: 100%; margin-top: auto; display: flex; justify-content: space-between; align-items: end; gap: 2rem; }
.pg-inside__portfolio-bottom > span { font-size: 1.5rem; letter-spacing: .1em; }
.pg-inside__portfolio-gallery { min-width: 0; }
.pg-inside__portfolio-gallery-panel { display: grid; gap: 2rem; }
.pg-inside__portfolio-image { position: relative; display: block; height: calc(100svh - 4rem); overflow: hidden; }
.pg-inside__portfolio-image > div { position: absolute; inset: 0; overflow: hidden; }
.pg-inside__portfolio-image .gz-ph { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--gz-ease-makhno); }
.pg-inside__portfolio-image:hover .gz-ph { transform: scale(1.1); }
.pg-inside__portfolio-image::after { content: ''; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, #08080875); pointer-events: none; }
.pg-inside__portfolio-image > span, .pg-inside__portfolio-image > small { position: absolute; z-index: 1; bottom: 2rem; color: #fff4e3; text-shadow: 0 .1rem .3rem #080808; }
.pg-inside__portfolio-image > span { left: 2rem; font: 400 clamp(2rem, 3vw, 4rem)/1.1 var(--gz-font-display); text-transform: uppercase; }
.pg-inside__portfolio-image > small { right: 2rem; }

@media (max-width: 1023px) {
  .pg-inside__hero-title { font-size: 4rem; }
  .pg-inside__film-frame { clip-path: none; }
  .pg-inside__introduction { grid-template-columns: 35% 65%; }
  .pg-inside__carousel-viewport { height: 65rem; }
  .pg-inside__portfolio-sticky { align-self: start; height: auto; min-height: calc(100svh - 6rem); }
  .pg-inside__portfolio-sticky .pg-inside__section-title { font-size: 3rem; }
}
@media (max-width: 767px) {
  .pg-inside__hero { min-height: 85svh; }
  .pg-inside__back { top: 10rem; }
  .pg-inside__hero-copy { top: 37vh; gap: 1.5rem; }
  .pg-inside__hero-title { font-size: 3rem; }
  .pg-inside__scroll { top: 73vh; }
  .pg-inside__film, .pg-inside__film-frame { min-height: 62svh; height: 62svh; }
  .pg-inside__film-control { width: 6.5rem; font-size: 2rem; }
  .pg-inside__film-caption { bottom: 1.5rem; }
  .pg-inside__introduction { grid-template-columns: 1fr; min-height: 0; margin-top: 0; padding-block: 10rem 12rem; gap: 7rem; }
  .pg-inside__introduction-copy { gap: 2.4rem; }
  .pg-inside__carousel-viewport { height: auto; aspect-ratio: 4 / 5; }
  .pg-inside__routes { display: block; min-height: 0; padding-block: 9rem 12rem; }
  .pg-inside__routes-grid { display: grid; grid-template-columns: 1fr; gap: 3rem; }
  .pg-inside__routes-preview { grid-column: auto; grid-row: auto; width: 100%; height: 40rem; margin-top: 0; }
  .pg-inside__routes-table { grid-column: auto; grid-row: auto; }
  .pg-inside__route > a { min-height: 11rem; }
  .pg-inside__route-number { padding-top: 3rem; }
  .pg-inside__cover { height: 70svh; }
  .pg-inside__portfolio { padding-block: 9rem 10rem; }
  .pg-inside__portfolio-grid { grid-template-columns: 1fr; gap: 0; }
  .pg-inside__portfolio-sticky { position: relative; top: auto; height: auto; min-height: 0; padding: 0 0 5rem; }
  .pg-inside__portfolio-sticky .pg-inside__section-title { font-size: 3rem; }
  .pg-inside__portfolio-bottom { margin-top: 3rem; }
  .pg-inside__portfolio-gallery { padding: 0; }
  .pg-inside__portfolio-image { height: 72svh; }
}
@media (prefers-reduced-motion: reduce) {
  .pg-inside__film-frame { clip-path: none !important; }
  .pg-inside__film-scene, .pg-inside__carousel-slide, .pg-inside__routes-preview-image { transition: none; }
  .pg-inside__cover-image, .pg-inside__cover-image .gz-ph { transform: none !important; }
}
