@media (max-width: 1199.98px) {
  .section-space {
    padding: 84px 0;
  }

  .hero-section {
    min-height: 100svh;
    padding: 116px 0 24px;
  }

  .hero-section .row {
    min-height: calc(100svh - 140px);
  }

  .page-hero {
    padding: 146px 0 68px;
  }

  .page-hero::after {
    background-size: 180px 180px, 150px 150px;
    background-position: right -24px top 22px, left -14px bottom 18px;
  }

  .page-hero .container::before {
    width: 96px;
    height: 96px;
    right: 4%;
  }

  .service-overview-media img {
    min-height: 360px;
  }

  .section-shell,
  .cta-banner,
  .newsletter-panel,
  .footer-panel {
    padding: 28px;
  }

  .hero-panel,
  .hero-shorts-stage,
  .service-card,
  .portfolio-card,
  .creator-card,
  .blog-card,
  .case-card,
  .video-card .video-content,
  .team-card,
  .contact-card,
  .faq-card,
  .contact-form-wrap,
  .sidebar-card,
  .author-card,
  .comment-card,
  .quote-card,
  .takeaway-card,
  .legal-card {
    padding: 24px;
  }

  .card-media {
    margin: -24px -24px 22px;
  }
}

@media (max-width: 991.98px) {
  .mobile-nav-actions .header-icon-btn {
    width: 48px;
    height: 48px;
  }

  .header-actions .header-icon-btn {
    display: none;
  }

  .navbar .navbar-collapse {
    margin-top: 14px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 24px;
    background: rgba(10, 6, 18, 0.92);
    backdrop-filter: blur(16px);
  }

  .site-header.is-scrolled .navbar .navbar-collapse {
    border-color: rgba(255, 255, 255, 0.1);
    background: rgba(11, 15, 26, 0.96);
  }

  .hero-copy,
  .section-copy {
    max-width: 100%;
  }

  .hero-shorts-stage {
    max-width: 100%;
  }

  .hero-actions,
  .hero-bullets,
  .portfolio-meta,
  .blog-meta,
  .creator-meta,
  .team-meta {
    gap: 10px;
  }

  .timeline-wrap::before {
    left: 16px;
  }

  .timeline-card {
    margin-left: 44px;
  }

  .timeline-card::before {
    left: -39px;
  }

  .sticky-panel {
    position: static;
  }

  .map-embed iframe {
    min-height: 360px;
  }

  .testimonial-shell {
    padding-right: 0;
  }
}

@media (max-width: 767.98px) {

  .cart-drawer .offcanvas-header,
  .cart-drawer .offcanvas-body {
    padding-inline: 18px;
  }

  html {
    scroll-padding-top: 80px;
  }

  .section-space {
    padding: 68px 0;
  }

  .section-space-sm {
    padding: 56px 0;
  }

  .hero-section {
    min-height: 100svh;
    padding: 108px 0 18px;
  }

  .hero-section .row {
    min-height: calc(100svh - 126px);
  }

  .page-hero {
    padding: 128px 0 54px;
  }

  .page-hero::after {
    background-size: 140px 140px, 110px 110px;
    background-position: right -28px top 36px, left -16px bottom 14px;
    opacity: 0.72;
  }

  .page-hero .container::before {
    top: 10px;
    right: 10px;
    width: 72px;
    height: 72px;
  }

  .page-hero .container::after {
    left: -8px;
    bottom: -6px;
    width: 68px;
    height: 68px;
  }

  .service-detail-section-head {
    margin-bottom: 28px;
  }

  .service-overview-media img {
    min-height: 280px;
  }

  .section-heading {
    font-size: clamp(1.9rem, 8vw, 2.75rem);
  }

  .hero-panel,
  .hero-shorts-stage,
  .section-shell,
  .cta-banner,
  .newsletter-panel,
  .footer-panel,
  .service-card,
  .portfolio-card,
  .creator-card,
  .blog-card,
  .case-card,
  .video-card .video-content,
  .team-card,
  .contact-card,
  .faq-card,
  .contact-form-wrap,
  .sidebar-card,
  .author-card,
  .comment-card,
  .quote-card,
  .takeaway-card,
  .legal-card {
    padding: 22px;
  }

  .card-media {
    margin: -22px -22px 20px;
  }

  .hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .hero-title-desktop {
    display: none;
  }

  .hero-title-mobile {
    display: block;
  }

  .error-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .error-actions .btn {
    width: 100%;
  }

  .error-shell,
  .error-panel {
    padding: 22px;
  }

  .glitch {
    font-size: clamp(5.5rem, 28vw, 7.5rem);
  }

  .hero-actions .btn {
    width: 100%;
  }

  .work-tabs {
    gap: 10px;
  }

  .work-tab-btn {
    width: 100%;
    justify-content: center;
  }

  .hero-shorts-stage {
    padding-top: 14px;
  }

  .hero-shorts-head {
    padding: 0 22px 14px;
  }

  .hero-shorts-head h2 {
    font-size: 1.1rem;
  }

  .hero-short-slide {
    width: clamp(154px, 56vw, 220px);
  }

  .hero-short-slide.swiper-slide-prev {
    transform: translateX(-8px) scale(0.84);
  }

  .hero-short-slide.swiper-slide-next {
    transform: translateX(8px) scale(0.84);
  }

  .hero-short-card {
    border-radius: 24px;
  }

  .cart-drawer-summary {
    grid-template-columns: 1fr;
  }

  .cart-drawer-item {
    grid-template-columns: 72px minmax(0, 1fr);
  }

  .cart-drawer-thumb img {
    width: 72px;
    height: 72px;
  }

  .cart-item-price {
    grid-column: 2;
    justify-self: start;
  }

  .checkout-item {
    grid-template-columns: 72px minmax(0, 1fr);
  }

  .checkout-item img {
    width: 72px;
    height: 72px;
  }

  .checkout-item-end {
    grid-column: 2;
    align-items: flex-start;
  }

  .checkout-item-price {
    justify-self: start;
  }

  .panel-kpi-grid {
    grid-template-columns: 1fr;
  }

  .brand-pill {
    padding-inline: 18px;
    font-size: 0.78rem;
  }

  .creator-stats {
    flex-direction: column;
  }

  .swiper-controls {
    justify-content: flex-end;
  }

  .swiper {
    padding-top: 72px;
  }

  .hero-shorts-slider {
    padding-top: 5px !important;
  }

  .swiper-button-next,
  .swiper-button-prev {
    width: 48px;
    height: 48px;
  }

  .swiper-button-next::after,
  .swiper-button-prev::after {
    font-size: 1.75rem;
  }

  .timeline-card {
    margin-left: 38px;
  }

  .timeline-card::before {
    left: -33px;
  }

  .footer-bottom {
    text-align: center;
  }

  .support-fab-stack {
    left: 16px;
    bottom: 16px;
    gap: 10px;
  }

  .support-fab {
    width: 52px;
    height: 52px;
  }

  .back-to-top {
    right: 18px;
    bottom: 18px;
    width: 48px;
    height: 48px;
  }

  .case-study-record {
    padding: 22px;
  }

  .case-study-aside {
    position: static;
  }

  .case-study-hero-stats {
    gap: 12px;
  }

  .case-study-stat {
    width: 100%;
    min-width: 0;
  }

  .hero-shorts-empty {
    min-height: 420px;
    padding: 24px;
    border-radius: 28px;
  }

  .hero-shorts-empty h2 {
    font-size: 1.9rem;
  }

  .video-card .card-media iframe {
    min-height: 420px;
  }
}
