/* ------------------------------------------------------------------
   responsive-fix.css
   1) Carries the top-tier (max-width:1920px) rules above 1920px so that
      viewports wider than Full HD keep the same layout instead of
      falling back to the untuned base values.
   2) Small guards against horizontal overflow.
   Load this AFTER theme.css / theme-colors.css / custom.css.
   ------------------------------------------------------------------ */

@media all and (min-width: 1921px) {
    #sk__hero-carousel-slider .carousel-control-next {
        top: 136px;
        right: 29px;
    }
    #sk__hero-carousel-slider .carousel-control-prev {
        top: 136px;
        right: 85px;
    }
    .sk__404 {
        font-size: 187px;
        letter-spacing: -15px;
    }
    .sk__featurebox h4 {
        font-size: 36px;
        letter-spacing: -2px;
    }
    .sk__featured-project-background {
        -webkit-transform: scale(0.85);
        -ms-transform: scale(0.85);
        transform: scale(0.85);
        top: 7.5%;
    }
    .sk__gallery-basic-thumbnails .carousel-control-next {
        top: 60px;
        right: 29px;
    }
    .sk__gallery-basic-thumbnails .carousel-control-prev {
        top: 60px;
        right: 85px;
    }
    .sk__iconbox h5 {
        font-size: 19px;
    }
    .sk__icons-presentation-icons span {
        font-size: 26px;
    }
    .sk__project-body {
        margin-bottom: 160px;
    }
    .sk__single-article .post-content p {
        font-size: 18px;
        line-height: 1.7;
        font-weight: 300;
    }
    .sk__strip-header {
        padding-top: 84px;
        padding-bottom: 75px;
    }
    a.sk__iconbox-icon-link {
        margin: 0 auto 15px;
        width: 112px;
        height: 112px;
    }
    a.sk__iconbox-icon-link > span.sk__iconbox-icon {
        width: 112px;
        height: 112px;
        border-radius: 114px;
    }
    a.sk__iconbox-icon-link > span.sk__iconbox-icon > span.sk__iconbox-trail {
        width: 108px;
        height: 108px;
        border-radius: 114px;
    }
    a.sk__iconbox-icon-link > span.sk__iconbox-icon:after {
        width: 112px;
        height: 112px;
        border-radius: 114px;
    }
    a.sk__iconbox-icon-link i,
    a.sk__iconbox-icon-link span[class^="icon-"] {
        font-size: 41px;
    }
    a.sk__iconbox-icon-link:hover > span.sk__iconbox-icon > span.sk__iconbox-trail {
        border-top-left-radius: 54px;
        border-top-right-radius: 54px;
    }
    a.sk__iconbox-icon-link:hover > span.sk__iconbox-icon:after {
        -webkit-transform: scale(0.925) translate(-1px, -1px);
        -ms-transform: scale(0.925) translate(-1px, -1px);
        transform: scale(0.925) translate(-1px, -1px);
    }
    h2.h2-super,
    span.h2-super.sk__gradient-fancy-text-back {
        font-size: 49px;
        letter-spacing: -2.5px;
    }
    p.p-super {
        font-size: 20px;
    }
}

/* ---------------------------------------------------------------------------
   Nothing else lives in this file on purpose.

   Three rules used to sit here and were removed because they broke the site:

     html, body { overflow-x: hidden; max-width: 100% }
         GSAP ScrollSmoother owns the scroll context via #smooth-wrapper.
         Setting overflow on html/body creates a second one, which is what
         made scrolling jump and stick.

     img, video, svg, canvas { max-width: 100% }
         The hero parallax images are deliberately larger than their frame so
         they have room to translate. Capping them killed the parallax.

     .sk__image-back-cover img.sk__parallax-background-element { ... object-fit }
         Same cause — pinned the element GSAP needs to move.

   Do not reintroduce them.
   --------------------------------------------------------------------------- */
