/* ========== TABLET (768px+) ========== */
@media (min-width: 768px) {
  .nav__cta {
    display: inline-flex;
  }
}

/* ========== BELOW DESKTOP ========== */
@media (max-width: 1023px) {
  :root {
    --section-py: 80px;
  }

  .nav__links {
    display: none;
  }

  .nav__hamburger {
    display: flex;
  }

  .nav__mobile {
    display: flex;
  }

  .nav__cta {
    display: none;
  }

  .nav__island {
    padding: 10px 16px;
  }

  /* Hero */
  .hero__content {
    grid-template-columns: 1fr;
    gap: 24px;
    padding-top: 120px;
    padding-bottom: 60px;
  }

  .hero__left {
    text-align: center;
  }

  .hero__subtitle {
    margin-left: auto;
    margin-right: auto;
  }

  .hero__actions {
    justify-content: center;
  }

  .hero__right {
    height: 320px;
    margin: 0 auto;
    max-width: 400px;
    width: 100%;
  }

  .hero__mockup--1 {
    width: 220px;
    height: 160px;
  }

  .hero__mockup--2 {
    width: 170px;
    height: 130px;
  }

  .hero__mockup--3 {
    width: 110px;
    height: 170px;
  }

  .hero__title {
    font-size: clamp(2rem, 5vw, 3rem);
  }

  .hero__subtitle {
    font-size: var(--fs-base);
  }

  /* Trust */
  .trust__stats {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap-md);
  }

  .trust__stat-number {
    font-size: var(--fs-4xl);
  }

  .trust__marquee-track {
    gap: var(--gap-2xl);
  }

  /* Benefits */
  .benefits__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Pricing */
  .pricing__grid {
    grid-template-columns: 1fr;
    max-width: 460px;
    margin-left: auto;
    margin-right: auto;
  }

  .pricing__card--popular {
    transform: none;
  }

  .pricing__card--popular:hover {
    transform: translateY(-4px);
  }

  /* Process */
  .process__timeline {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Contact */
  .contact__grid {
    grid-template-columns: 1fr;
    gap: var(--gap-2xl);
  }

  /* Footer */
  .footer__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap-xl);
  }

  /* Blog */
  .blog-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ========== MOBILE (below 768px) ========== */
@media (max-width: 767px) {
  :root {
    --section-py: 64px;
    --container-px: 20px;
  }

  h2 { font-size: var(--fs-3xl); }
  h3 { font-size: var(--fs-2xl); }

  /* Service pages */
  .service-hero {
    padding-top: 7rem;
    padding-bottom: 3rem;
  }

  .service-hero .section__title {
    font-size: clamp(1.75rem, 6vw, var(--fs-3xl));
  }

  .service-hero .hero__actions {
    flex-direction: column;
    align-items: center;
  }

  .service-hero .hero__actions .btn {
    width: 100%;
    max-width: 320px;
  }

  .service-features {
    grid-template-columns: 1fr;
  }

  .service-checklist {
    grid-template-columns: 1fr;
  }

  .section__header {
    margin-bottom: var(--gap-2xl);
  }

  /* Hero */
  .hero__content {
    padding-top: 100px;
    padding-bottom: 40px;
  }

  .hero__title {
    font-size: clamp(1.75rem, 7vw, 2.5rem);
  }

  .hero__actions {
    flex-direction: column;
    gap: var(--gap-sm);
  }

  .hero__actions .btn {
    width: 100%;
    max-width: 320px;
  }

  .hero__scroll-label {
    display: none;
  }

  .hero__right {
    height: 250px;
  }

  .hero__mockup--1 {
    width: 180px;
    height: 130px;
  }

  .hero__mockup--2 {
    width: 140px;
    height: 110px;
  }

  .hero__blob {
    width: 220px;
    height: 220px;
  }

  .hero__cursor-glow {
    display: none;
  }

  /* Urgency Banner */
  .urgency-banner__pill {
    margin: 0 12px;
    padding: 8px 14px;
    gap: var(--gap-sm);
  }

  .urgency-banner__text {
    font-size: var(--fs-xs);
  }

  /* Mobile menu full width on small screens */
  .nav__mobile {
    width: 100%;
  }

  /* Ticker */
  .ticker__item {
    min-width: 260px;
    max-width: 300px;
    padding: 18px 20px;
  }

  /* Trust */
  .trust__stats {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap-sm);
  }

  .trust__stat {
    padding: var(--gap-md) var(--gap-sm);
  }

  .trust__stat-number {
    font-size: var(--fs-3xl);
  }

  .trust__stat-icon {
    width: 40px;
    height: 40px;
  }

  .trust__stat-icon svg {
    width: 20px;
    height: 20px;
  }

  .trust__marquee-track {
    gap: var(--gap-xl);
    animation-duration: 20s;
  }

  .trust__logo img {
    height: 38px;
    max-width: 120px;
  }

  .trust__floating {
    display: none;
  }

  /* Benefits */
  .benefits__grid {
    grid-template-columns: 1fr;
  }

  /* Pricing */
  .pricing__toggle-wrapper {
    flex-direction: column;
    gap: var(--gap-sm);
  }

  .pricing__amount {
    font-size: var(--fs-4xl);
  }

  /* Process */
  .process__timeline {
    grid-template-columns: 1fr;
    gap: var(--gap-md);
  }

  /* Contact */
  .contact__title {
    font-size: var(--fs-3xl);
  }

  .contact__form-wrapper {
    padding: var(--gap-xl);
  }

  /* Blog */
  .blog-grid {
    grid-template-columns: 1fr;
  }

  .blog-hero__title {
    font-size: clamp(1.75rem, 6vw, 2.5rem);
  }

  .blog-post__title {
    font-size: clamp(1.5rem, 5vw, 2rem);
  }

  .blog-post__content p {
    font-size: var(--fs-sm);
  }

  /* Footer */
  .footer__grid {
    grid-template-columns: 1fr;
    gap: var(--gap-xl);
  }

  .footer__bottom {
    flex-direction: column;
    gap: var(--gap-sm);
    text-align: center;
  }

  /* Floating elements */
  .whatsapp-float {
    display: none;
  }

  .floating-cta {
    display: none;
  }

  .chatbot {
    bottom: 20px;
    right: 20px;
  }

  .chatbot__trigger {
    width: 54px;
    height: 54px;
  }

  .chatbot__window {
    width: calc(100vw - 32px);
    height: calc(100vh - 120px);
    bottom: 66px;
    right: -4px;
    border-radius: var(--radius-lg);
  }
}

/* ========== SMALL MOBILE (below 480px) ========== */
@media (max-width: 479px) {
  .hero__mockup--3 {
    display: none;
  }

  .hero__right {
    height: 200px;
  }

  .urgency-banner__text strong {
    display: none;
  }

  .chatbot__window {
    width: 100vw;
    height: calc(100vh - 80px);
    bottom: 66px;
    right: -20px;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  }
}