/* ═══════════════════════════════════════════════════════
   KUPOLLA — Inner Pages CSS Part 3
   Responsive for Part 1–2 (inner hero, About, Technologies, catalog)
   kupolla-pages-3.css
════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════ */
@media (max-width: 1024px) {
  .kp-inner-hero--about,
  .kp-inner-hero--tech,
  .kp-inner-hero--gallery,
  .kp-inner-hero--blog,
  .kp-inner-hero--faq,
  .kp-inner-hero--contacts,
.kp-inner-hero--catalog {
    min-height: 0;
    padding: clamp(2rem, 4vw, 3rem) 0 clamp(2.75rem, 6vw, 4rem);
  }
  .kp-inner-hero--about.kp-about-hero {
    min-height: 0;
    padding: 0;
  }
  .kp-about-hero__layout {
    grid-template-columns: 1fr;
    min-height: 0;
    padding-top: clamp(2.75rem, 6vw, 4rem);
    padding-bottom: clamp(2.75rem, 6vw, 4rem);
    padding-left: calc(clamp(1.35rem, 4.5vw, 2.5rem) + var(--safe-l));
    padding-right: calc(clamp(1.35rem, 4.5vw, 2.5rem) + var(--safe-r));
    gap: 1.75rem;
  }
  .kp-about-hero__media { max-width: 420px; }
  .kp-about-prod-feature { grid-template-columns: 1fr; }
  .kp-inner-hero__layout {
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
  .kp-inner-hero--about .kp-inner-hero__content,
  .kp-inner-hero--tech .kp-inner-hero__content,
  .kp-inner-hero--gallery .kp-inner-hero__content,
  .kp-inner-hero--blog .kp-inner-hero__content,
  .kp-inner-hero--faq .kp-inner-hero__content,
  .kp-inner-hero--contacts .kp-inner-hero__content,
.kp-inner-hero--catalog .kp-inner-hero__content {
    flex: 0 1 auto;
  }
  .kp-inner-hero--about .kp-inner-hero__desc,
  .kp-inner-hero--tech .kp-inner-hero__desc,
  .kp-inner-hero--gallery .kp-inner-hero__desc,
  .kp-inner-hero--blog .kp-inner-hero__desc,
  .kp-inner-hero--faq .kp-inner-hero__desc,
  .kp-inner-hero--contacts .kp-inner-hero__desc,
.kp-inner-hero--catalog .kp-inner-hero__desc {
    margin-left: auto;
    margin-right: auto;
  }
  .kp-inner-hero--about > .kp-inner-hero__layout,
  .kp-inner-hero--tech > .kp-inner-hero__layout,
  .kp-inner-hero--gallery > .kp-inner-hero__layout,
  .kp-inner-hero--blog > .kp-inner-hero__layout,
  .kp-inner-hero--faq > .kp-inner-hero__layout,
  .kp-inner-hero--contacts > .kp-inner-hero__layout,
.kp-inner-hero--catalog > .kp-inner-hero__layout {
    position: relative;
    min-height: clamp(320px, 68vw, 400px);
    justify-content: flex-start;
    gap: 0;
    padding-bottom: 0.75rem;
  }
  .kp-inner-hero--about .kp-inner-hero__content,
  .kp-inner-hero--tech .kp-inner-hero__content,
  .kp-inner-hero--gallery .kp-inner-hero__content,
  .kp-inner-hero--blog .kp-inner-hero__content,
  .kp-inner-hero--faq .kp-inner-hero__content,
  .kp-inner-hero--contacts .kp-inner-hero__content,
.kp-inner-hero--catalog .kp-inner-hero__content {
    position: relative;
    z-index: 2;
    width: 100%;
  }
  .kp-inner-hero--about .kp-inner-hero__illustration,
  .kp-inner-hero--tech .kp-inner-hero__illustration,
  .kp-inner-hero--gallery .kp-inner-hero__illustration,
  .kp-inner-hero--blog .kp-inner-hero__illustration,
  .kp-inner-hero--faq .kp-inner-hero__illustration,
  .kp-inner-hero--contacts .kp-inner-hero__illustration,
.kp-inner-hero--catalog .kp-inner-hero__illustration {
    display: block;
    position: absolute;
    left: 50%;
    bottom: -6%;
    width: min(96vw, 360px);
    max-width: none;
    flex: none;
    margin: 0;
    z-index: 1;
    pointer-events: none;
    -webkit-transform: translateX(-50%) translateZ(0);
    transform: translateX(-50%) translateZ(0);
    -webkit-mask-image: linear-gradient(to top, #000 34%, rgba(0, 0, 0, 0.52) 62%, transparent 88%);
    mask-image: linear-gradient(to top, #000 34%, rgba(0, 0, 0, 0.52) 62%, transparent 88%);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
  }
  .kp-inner-hero--about .kp-inner-hero__illustration img,
  .kp-inner-hero--tech .kp-inner-hero__illustration img,
  .kp-inner-hero--gallery .kp-inner-hero__illustration img,
  .kp-inner-hero--blog .kp-inner-hero__illustration img,
  .kp-inner-hero--faq .kp-inner-hero__illustration img,
  .kp-inner-hero--contacts .kp-inner-hero__illustration img,
.kp-inner-hero--catalog .kp-inner-hero__illustration img {
    opacity: 0.58;
    filter: brightness(1.15) contrast(1.05);
    -webkit-filter: brightness(1.15) contrast(1.05);
  }
  .kp-inner-hero--tech .kp-inner-hero__illustration {
    width: min(98vw, 400px);
  }
  .kp-inner-hero--tech .kp-inner-hero__illustration img {
    opacity: 0.68;
    filter: brightness(1.22) contrast(1.08) drop-shadow(0 10px 28px rgba(202, 187, 172, 0.18));
    -webkit-filter: brightness(1.22) contrast(1.08) drop-shadow(0 10px 28px rgba(202, 187, 172, 0.18));
  }
  .kp-inner-hero--about::after,
  .kp-inner-hero--tech::after,
  .kp-inner-hero--gallery::after,
  .kp-inner-hero--blog::after,
  .kp-inner-hero--faq::after,
  .kp-inner-hero--contacts::after,
.kp-inner-hero--catalog::after {
    display: none;
  }
  .kp-about-story__inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .kp-about-vals { grid-template-columns: repeat(2, 1fr); }
  .kp-segs { grid-template-columns: repeat(2, 1fr); }
  .kp-stages { grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
  .kp-stages::before { display: none; }
  .kp-tech-mats { grid-template-columns: repeat(2, 1fr); }
  .kp-tech-mat--featured { grid-template-columns: 1fr; }
  .kp-tech-shell__layout { grid-template-columns: 1fr; }
  .kp-tech-energy__inner { grid-template-columns: 1fr; gap: 2.5rem; }
  .kp-catalog__grid { grid-template-columns: repeat(2, 1fr); }
  .kp-catalog__grid--home {
    grid-template-columns: minmax(0, .88fr) minmax(0, 1.24fr) minmax(0, .88fr);
    gap: .75rem;
    align-items: start;
  }
  .kp-catalog__grid--home .kp-mcard--feat {
    transform: none;
  }
  .kp-catalog__grid--home .kp-mcard:not(.kp-mcard--feat) .kp-mcard__img {
    height: clamp(176px, 20vw, 230px);
  }
  .kp-catalog__grid--home .kp-mcard--feat .kp-mcard__img {
    height: clamp(220px, 28vw, 320px);
  }
  .kp-video-review__grid {
    grid-template-columns: minmax(0, 220px) minmax(7.5rem, 1fr) minmax(0, 220px);
    gap: .875rem;
  }
  .kp-video-review__mid {
    max-width: 12rem;
    font-size: clamp(1rem, 2.2vw, 1.25rem);
  }
  .kp-team__card { flex: 0 1 calc(33.333% - 1rem); }
  .kp-production__grid { grid-template-columns: repeat(2, 1fr); }
  .kp-showroom__inner { grid-template-columns: 1fr; gap: 2rem; }
  .kp-showroom__media { max-width: 480px; margin: 0 auto; }
  .kp-showroom__title { font-size: clamp(2.25rem, 5vw, 3.25rem); }
  .kp-showroom__sub { font-size: 1.0625rem; }
}
@media (max-width: 768px) {
  .kp-tech-intro {
    padding-top: clamp(2.25rem, 7vw, 3.25rem);
    padding-bottom: clamp(2rem, 6vw, 3rem);
  }
  .kp-inner-hero--about,
  .kp-inner-hero--tech,
  .kp-inner-hero--gallery,
  .kp-inner-hero--blog,
  .kp-inner-hero--faq,
  .kp-inner-hero--contacts,
.kp-inner-hero--catalog {
    min-height: 0;
    padding: 1.75rem 0 clamp(2.25rem, 8vw, 3rem);
  }
  .kp-inner-hero--about.kp-about-hero {
    padding: 0;
  }
  .kp-about-hero__layout {
    padding-top: clamp(2rem, 7vw, 2.75rem);
    padding-bottom: calc(clamp(2.25rem, 8vw, 3rem) + var(--safe-b, 0px));
    padding-left: calc(1.25rem + var(--safe-l));
    padding-right: calc(1.25rem + var(--safe-r));
  }
  .kp-about-hero__title {
    font-size: clamp(1.4rem, 6.2vw, 1.85rem);
  }
  .kp-about-hero__text p {
    font-size: .9375rem;
  }
  .kp-about-hero__media { max-width: none; }
  .kp-showroom__map { aspect-ratio: 4/3; }
  .kp-showroom__title { font-size: clamp(2rem, 8.2vw, 2.6rem); }
  .kp-showroom__sub { font-size: 1rem; letter-spacing: .06em; }
  .kp-inner-hero__layout {
    gap: 1.25rem;
  }
  .kp-prod-steps {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-auto-flow: row;
    gap: 1rem;
  }
  .kp-about-vals { grid-template-columns: 1fr; }
  .kp-segs { grid-template-columns: 1fr; }
  .kp-team__card { flex: 0 1 calc(50% - .75rem); }
  .kp-production__grid { grid-template-columns: 1fr 1fr; gap: .875rem; }
  .kp-about-stages .kp-section__hd { margin-bottom: 2rem; }
  .kp-stages {
    grid-template-columns: 1fr;
    gap: 0.625rem;
    position: relative;
  }
  .kp-stages::before { display: none; }
  .kp-stage {
    display: grid;
    grid-template-columns: 44px 1fr;
    grid-template-rows: auto auto;
    gap: 0.2rem 0.875rem;
    align-items: start;
    text-align: left;
    padding: 0.875rem 1rem;
    background: var(--c-warm);
    border: 1px solid var(--c-border);
    border-radius: var(--r-lg);
  }
  .kp-stage__num {
    grid-row: 1 / -1;
    align-self: center;
    width: 44px;
    height: 44px;
    font-size: 1rem;
    border-width: 2px;
  }
  .kp-stage__title {
    font-size: 0.9375rem;
    line-height: 1.3;
  }
  .kp-stage__desc {
    font-size: 0.8125rem;
    line-height: 1.45;
    margin: 0;
  }
  .kp-tech-mats { grid-template-columns: 1fr; }
  .kp-tech-shell__viz { padding: .875rem .75rem 1rem; }
  .kp-tech-energy__metrics { grid-template-columns: 1fr 1fr; }
  .kp-catalog__grid { grid-template-columns: 1fr; }
  .kp-catalog__grid--home {
    grid-template-columns: minmax(0, 1fr);
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
    justify-items: stretch;
    align-items: stretch;
  }
  .kp-catalog__grid--home .kp-mcard--feat {
    order: -1;
    transform: none;
    width: 100%;
  }
  .kp-catalog__grid--home .kp-mcard:not(.kp-mcard--feat) {
    width: 100%;
  }
  .kp-catalog__grid--home .kp-mcard:not(.kp-mcard--feat) .kp-mcard__img {
    height: clamp(188px, 46vw, 240px);
  }
  .kp-catalog__grid--home .kp-mcard--feat .kp-mcard__img {
    height: clamp(228px, 56vw, 300px);
  }
  .kp-video-review__grid {
    grid-template-columns: minmax(0, 280px);
    justify-content: center;
    justify-items: center;
    gap: 1.25rem;
  }
  .kp-video-review__mid {
    max-width: 18rem;
  }
  .kp-about-story__nums { grid-template-columns: 1fr 1fr; }
  .kp-inner-hero::after { width: 50%; max-width: 240px; opacity: .35; }
  .kp-inner-hero__layout { gap: 1.25rem; }
  .kp-inner-hero--about > .kp-inner-hero__layout,
  .kp-inner-hero--tech > .kp-inner-hero__layout,
  .kp-inner-hero--gallery > .kp-inner-hero__layout,
  .kp-inner-hero--blog > .kp-inner-hero__layout,
  .kp-inner-hero--faq > .kp-inner-hero__layout,
  .kp-inner-hero--contacts > .kp-inner-hero__layout,
.kp-inner-hero--catalog > .kp-inner-hero__layout {
    min-height: clamp(300px, 76vw, 370px);
  }
  .kp-inner-hero--about .kp-inner-hero__illustration,
  .kp-inner-hero--tech .kp-inner-hero__illustration,
  .kp-inner-hero--gallery .kp-inner-hero__illustration,
  .kp-inner-hero--blog .kp-inner-hero__illustration,
  .kp-inner-hero--faq .kp-inner-hero__illustration,
  .kp-inner-hero--contacts .kp-inner-hero__illustration,
.kp-inner-hero--catalog .kp-inner-hero__illustration {
    width: min(98vw, 340px);
    bottom: -2%;
    -webkit-mask-image: linear-gradient(to top, #000 30%, rgba(0, 0, 0, 0.48) 58%, transparent 86%);
    mask-image: linear-gradient(to top, #000 30%, rgba(0, 0, 0, 0.48) 58%, transparent 86%);
  }
  .kp-inner-hero--about .kp-inner-hero__illustration img,
  .kp-inner-hero--tech .kp-inner-hero__illustration img,
  .kp-inner-hero--gallery .kp-inner-hero__illustration img,
  .kp-inner-hero--blog .kp-inner-hero__illustration img,
  .kp-inner-hero--faq .kp-inner-hero__illustration img,
  .kp-inner-hero--contacts .kp-inner-hero__illustration img,
.kp-inner-hero--catalog .kp-inner-hero__illustration img {
    opacity: 0.52;
  }
  .kp-inner-hero--tech .kp-inner-hero__illustration {
    width: min(100vw, 380px);
    -webkit-mask-image: linear-gradient(to top, #000 36%, rgba(0, 0, 0, 0.52) 64%, transparent 90%);
    mask-image: linear-gradient(to top, #000 36%, rgba(0, 0, 0, 0.52) 64%, transparent 90%);
  }
  .kp-inner-hero--tech .kp-inner-hero__illustration img {
    opacity: 0.62;
    filter: brightness(1.2) contrast(1.08) drop-shadow(0 8px 24px rgba(202, 187, 172, 0.16));
    -webkit-filter: brightness(1.2) contrast(1.08) drop-shadow(0 8px 24px rgba(202, 187, 172, 0.16));
  }
  .kp-inner-hero__title { font-size: clamp(1.875rem, 8vw, 2.75rem); }
  .kp-prose,
  .kp-about-hero__text p,
  .kp-inner-hero__desc { overflow-wrap: anywhere; word-break: break-word; }
  .kp-catalog-filters {
    flex-direction: column;
    align-items: stretch;
  }
  .kp-catalog-sort { margin-left: 0; width: 100%; }
  .kp-catalog-sort select { width: 100%; }
  .kp-catalog-filters,
  .kp-catalog__filters { margin-bottom: 2rem; gap: .875rem; }
  .kp-filter-group,
  .kp-filters__group { align-items: flex-start; gap: .5rem; }
  .kp-filters__label { min-width: auto; }
  .kp-filters__btns { gap: .5rem; }
  .kp-filter-btn { min-height: 40px; padding: .5rem 1rem; }
  .kp-catalog-card__actions { flex-direction: column; }
  .kp-catalog-card__actions .kp-btn { width: 100%; justify-content: center; }
}
@media (max-width: 480px) {
  .kp-tech-intro {
    padding-top: clamp(2rem, 8vw, 2.75rem);
    padding-bottom: clamp(1.75rem, 6vw, 2.5rem);
  }
  .kp-showroom__title { font-size: clamp(1.85rem, 8.6vw, 2.25rem); }
  .kp-showroom__sub { font-size: .9375rem; }
  .kp-team__card { flex: 0 1 100%; max-width: 220px; }
  .kp-team__photo { width: 104px; height: 104px; }
  .kp-production__grid { grid-template-columns: 1fr; }
  .kp-inner-hero--about > .kp-inner-hero__layout,
  .kp-inner-hero--tech > .kp-inner-hero__layout,
  .kp-inner-hero--gallery > .kp-inner-hero__layout,
  .kp-inner-hero--blog > .kp-inner-hero__layout,
  .kp-inner-hero--faq > .kp-inner-hero__layout,
  .kp-inner-hero--contacts > .kp-inner-hero__layout,
.kp-inner-hero--catalog > .kp-inner-hero__layout {
    min-height: clamp(290px, 82vw, 340px);
  }
  .kp-inner-hero--about .kp-inner-hero__illustration,
  .kp-inner-hero--tech .kp-inner-hero__illustration,
  .kp-inner-hero--gallery .kp-inner-hero__illustration,
  .kp-inner-hero--blog .kp-inner-hero__illustration,
  .kp-inner-hero--faq .kp-inner-hero__illustration,
  .kp-inner-hero--contacts .kp-inner-hero__illustration,
.kp-inner-hero--catalog .kp-inner-hero__illustration {
    width: min(100vw, 300px);
    bottom: 0;
    -webkit-mask-image: linear-gradient(to top, #000 28%, rgba(0, 0, 0, 0.42) 54%, transparent 84%);
    mask-image: linear-gradient(to top, #000 28%, rgba(0, 0, 0, 0.42) 54%, transparent 84%);
  }
  .kp-inner-hero--about .kp-inner-hero__illustration img,
  .kp-inner-hero--tech .kp-inner-hero__illustration img,
  .kp-inner-hero--gallery .kp-inner-hero__illustration img,
  .kp-inner-hero--blog .kp-inner-hero__illustration img,
  .kp-inner-hero--faq .kp-inner-hero__illustration img,
  .kp-inner-hero--contacts .kp-inner-hero__illustration img,
.kp-inner-hero--catalog .kp-inner-hero__illustration img {
    opacity: 0.48;
  }
  .kp-inner-hero--tech .kp-inner-hero__illustration {
    width: min(100vw, 340px);
    -webkit-mask-image: linear-gradient(to top, #000 32%, rgba(0, 0, 0, 0.48) 60%, transparent 88%);
    mask-image: linear-gradient(to top, #000 32%, rgba(0, 0, 0, 0.48) 60%, transparent 88%);
  }
  .kp-inner-hero--tech .kp-inner-hero__illustration img {
    opacity: 0.56;
    filter: brightness(1.18) contrast(1.06) drop-shadow(0 6px 20px rgba(202, 187, 172, 0.14));
    -webkit-filter: brightness(1.18) contrast(1.06) drop-shadow(0 6px 20px rgba(202, 187, 172, 0.14));
  }
  .kp-about-stages .kp-section__hd { margin-bottom: 1.5rem; }
  .kp-stages { gap: 0.5rem; }
  .kp-stage {
    grid-template-columns: 40px 1fr;
    gap: 0.15rem 0.75rem;
    padding: 0.75rem 0.875rem;
  }
  .kp-stage__num {
    width: 40px;
    height: 40px;
    font-size: 0.9375rem;
  }
  .kp-stage__title { font-size: 0.875rem; }
  .kp-stage__desc { font-size: 0.75rem; line-height: 1.4; }
  .kp-tech-energy__metrics { grid-template-columns: 1fr; }
  .kp-about-story__nums { grid-template-columns: 1fr; }
  .kp-section__ft { flex-direction: column; align-items: stretch; }
  .kp-section__ft .kp-btn { width: 100%; }
  .kp-catalog-filters,
  .kp-catalog__filters { margin-bottom: 1.75rem; padding-bottom: 1rem; }
  .kp-filter-group,
  .kp-filters__group { flex-direction: column; align-items: flex-start; }
  .kp-filters__btns { width: 100%; }
}