/* ============================================================
   MEDIA LEADMON — RESPONSIVE
   Mobile-first: base → 480 → 768 → 1024 → 1280
   ============================================================ */

/* ---- BASE (mobile < 480px) ---- */
html,
body {
  width:100%;
  max-width:100%;
  overflow-x:clip; /* clip (not hidden): hidden creates a scroll context that breaks position:sticky */
}
.nav__links { display: none; }
.nav__phone  { display: none; }
.nav__toggle { display: flex; }
.site-header { padding: .875rem 1.25rem; }
.site-header.scrolled { padding: .875rem 1.25rem; }
.mobile-menu { padding-left: 1rem; padding-right: 1rem; }
.mobile-menu::before { inset: .65rem; border-radius: 24px; }
.mobile-menu__close { top: 1.15rem; right: 1.15rem; }
.mobile-menu__links { width: min(100%, 330px); }
.section-pad { padding: 3rem 0; }
.section-header { margin-bottom: 2rem; }

.hero {
  width:100%;
  max-width:100%;
  min-height:100svh;
  align-items:flex-start;
  overflow:hidden;
}
.hero__container {
  width:100%;
  max-width:100%;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  padding:6.7rem 1rem 5.75rem;
  overflow:hidden;
}
.hero__eyebrow {
  gap:.55rem;
  margin-bottom:1.45rem;
  max-width:100%;
}
.hero__top {
  max-width:100%;
  order:1;
}
.hero__eyebrow span:last-child {
  font-size:.58rem;
  letter-spacing:.14em;
  line-height:1.5;
  max-width:calc(100vw - 3.5rem);
}
.hero__headline {
  max-width:100%;
  margin-bottom:clamp(1.8rem, 4svh, 2.65rem);
  font-size:min(54px, 13.4vw);
  line-height:1;
  letter-spacing:0;
}
.hero__line--mobile-combo {
  white-space:nowrap;
  font-size:min(1em, 12.4vw);
}
.hero__line--mobile-combo span {
  display:inline;
}
.hero__bottom {
  position:relative;
  z-index:3;
  order:3;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(1.05rem, 2.2svh, 1.45rem);
  max-width:100%;
}
.hero-funnel {
  --hero-funnel-y:0px;
  position:relative;
  z-index:2;
  order:2;
  right:auto;
  top:auto;
  bottom:auto;
  display:block;
  width:min(50vw, 190px);
  transform:none;
  margin:0 auto clamp(1.9rem, 4.6svh, 3rem);
}
.hero__tagline {
  max-width:min(100%, 21rem);
  font-size:.98rem;
  line-height:1.35;
  margin-bottom:.15rem;
}
.hero__tagline span { white-space:nowrap; }
.hero__cta {
  flex-direction: column;
  align-items: stretch;
  gap:clamp(.85rem, 1.8svh, 1.15rem);
  width: 100%;
}
.hero__cta .btn-primary,
.hero__cta .btn-ghost { width: 100%; justify-content: center; }
.hero__cta .btn-primary,
.hero__cta .btn-ghost {
  min-height:3.25rem;
  padding:.75rem 1.1rem;
}
.hero__lemon { left:-250px; right:auto; top:9rem; width:390px; opacity:.1; }
.hero__scroll-hint { display:none; }

.services__grid { grid-template-columns: 1fr; }
.service-card__img-wrap { height: auto; aspect-ratio: 16 / 9; }
.service-card__body { padding: 1.35rem; }
.service-card__tags { gap: .5rem .42rem; margin-top: .45rem; }
.service-card__tags li {
  min-height:36px;
  padding:.42rem .82rem;
}
.metrics__grid  { grid-template-columns: 1fr 1fr; }
.metrics__grid { margin-bottom: 3rem; }
.metric-item { padding: 1.75rem 1.35rem; min-height: 210px; }
.metric-num { font-size: clamp(2.3rem, 11vw, 3rem); }
.metric-suffix { font-size: clamp(1.05rem, 5vw, 1.35rem); }
.metric-item__value { margin-bottom: .45rem; }
.metric-item__label { font-size: 1rem; line-height: 1.35; margin-bottom: .35rem; }
.metric-item__desc { font-size: .82rem; line-height: 1.55; }
.metric-item__hint { margin-top: .75rem; font-size: 9px; }
.cases__grid    { grid-template-columns: 1fr; }
.case-card--featured { grid-column: span 1; }
.case-card--video { grid-column: span 1; }
.case-card__media--video { height:auto; aspect-ratio:16 / 9; }
.process__lemon { right:-260px; top:7rem; width:420px; opacity:.08; }
.eureka-modal__panel {
  grid-template-columns:1fr; gap:1.25rem; max-height:calc(100dvh - 2.5rem); overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.eureka-modal__copy { padding-right:3.25rem; }
.eureka-modal__visual img { width:auto; height:auto; max-width:min(400px,100%); max-height:40vh; }
.team__carousel {
  width:100%;
  margin-right:0;
  gap:1rem;
  padding:0 0 1rem;
}
.team__controls { display:none; }
.team__carousel-wrap::before,
.team__carousel-wrap::after { display:none; }
.team-card { flex-basis:100%; min-width:100%; }
.team-card__meta { text-align:left; padding:.7rem .25rem 0; }
.team-card__name { font-size:1.45rem; }
.team__dots { justify-content:flex-start; }

.testimonials__slider {
  grid-template-columns: repeat(4, 100%);
}
.testimonials__nav { display:none; }
.testimonials__dots { display:flex; justify-content:flex-start; }

.contact__layout { grid-template-columns: 1fr; gap: 2.25rem; }
.contact .container { padding-left: 1rem; padding-right: 1rem; }
.contact__info { padding-left:.25rem; padding-right:.25rem; }
.contact__form-wrap { padding:1.45rem; }
.contact-form { gap:1rem; }
.form-input { padding:.82rem .95rem; }
.form-textarea { min-height:112px; }
.footer__top { flex-direction: column; align-items: flex-start; gap: 2rem; }
.footer__bottom { flex-direction: column; align-items: flex-start; gap: 1rem; }
.footer__nav { gap: 1.25rem; }
.clients-strip { text-align:left; margin-top:0; }
.clients-strip__label { font-size: .95rem; line-height:1.6; margin-bottom:2rem; text-align:left; }
.clients-strip__logos { justify-content:flex-start; gap:2.25rem; }
.client-logo-img { height:92px; max-width:min(300px, 86vw); }

.process-step { grid-template-columns: 1fr; gap: .75rem; }
.process-step__num { font-size: var(--fs-xl); }
.process-step__img-wrap { width: 100%; height: auto; aspect-ratio: 16 / 9; margin-top: .25rem; }
.process-step__img { border-radius: 10px; }

.whatsapp-float { width: 52px; height: 52px; border-radius: 26px; bottom: 1.5rem; right: 1.5rem; }
.scroll-top { bottom: 5.65rem; right: calc(1.5rem + 4px); }

@media (max-width: 767px) {
  .hero__video-link {
    align-self: center;
    justify-content: center;
    margin-top: .5rem;
    padding: .55rem 0;
    font-size: .8rem;
  }
  .hero__video-link:active {
    color: var(--clr-accent);
  }
}

/* ---- SM ≥ 480px ---- */
@media (min-width: 480px) {
  .hero__cta { flex-direction: row; flex-wrap: wrap; }
  .hero__cta .btn-primary,
  .hero__cta .btn-ghost { width: auto; }
}

@media (min-width: 480px) and (max-width: 767px) {
  .hero__container { padding-left:1.25rem; padding-right:1.25rem; }
  .hero-funnel {
    width:min(48vw, 230px);
  }
  .hero__cta {
    flex-direction:column;
    width:100%;
  }
  .hero__cta .btn-primary,
  .hero__cta .btn-ghost {
    width:100%;
  }
}

@media (max-width: 767px) and (min-height: 740px) {
  .hero__container {
    padding-bottom:clamp(5.9rem, 8.8svh, 6.7rem);
  }
  .hero__headline {
    margin-bottom:clamp(2.15rem, 4.8svh, 3.15rem);
  }
  .hero-funnel {
    width:min(56vw, 215px);
    margin-bottom:clamp(2.1rem, 4.6svh, 3rem);
  }
  .hero__bottom {
    margin-top:auto;
    gap:clamp(1.2rem, 2.8svh, 1.75rem);
  }
}

@media (max-width: 767px) and (min-height: 840px) {
  .hero__container {
    padding-bottom:clamp(6.4rem, 9svh, 7.1rem);
  }
  .hero__headline {
    margin-bottom:clamp(2.45rem, 5.2svh, 3.45rem);
  }
  .hero-funnel {
    width:min(58vw, 230px);
    margin-bottom:clamp(2.35rem, 5svh, 3.25rem);
  }
}

@media (max-width: 767px) and (max-height: 690px) {
  .hero__container {
    padding-top:6.25rem;
    padding-bottom:4.5rem;
  }
  .hero__eyebrow {
    margin-bottom:1.15rem;
  }
  .hero__headline {
    margin-bottom:1.45rem;
  }
  .hero-funnel {
    width:min(46vw, 175px);
    margin-bottom:1.35rem;
  }
  .hero__bottom {
    gap:.85rem;
  }
  .hero__cta {
    gap:.75rem;
  }
}

/* ---- MD ≥ 768px ---- */
@media (min-width: 768px) {
  .nav__phone { display: flex; }
  .site-header { padding: 1rem 2rem; }
  .site-header.scrolled { padding: 1rem 2rem; }
  .hero {
    min-height:100svh;
    align-items:center;
  }
  .hero__container {
    max-width:1280px;
    margin:0 auto;
    padding:8rem clamp(1.25rem, 4vw, 3rem) 4rem;
    overflow:visible;
  }

  .hero__bottom { flex-direction: column; align-items: flex-start; }
  .hero__headline { max-width:min(760px, 68vw); }
  .hero__line--mobile-combo { white-space:nowrap; }
  .hero__line--mobile-combo span { display:inline; }
  .hero__bottom { max-width:min(760px, 68vw); gap:1.5rem; }
  .hero-funnel {
    position:absolute;
    right:2rem; top:50%;
    width:min(330px, 28vw);
    --hero-funnel-y:-42%;
    transform:translateY(var(--hero-funnel-y));
    margin-bottom:0;
  }
  .hero__lemon { left:-260px; right:auto; top:9vh; width:520px; opacity:.14; }

  .services__grid { grid-template-columns: repeat(2, 1fr); }
  .service-card__img-wrap { height: 190px; aspect-ratio: auto; }
  .service-card__body { padding: 2rem; }
  .service-card__tags { gap: .48rem .45rem; margin-top: .55rem; }
  .service-card__tags li {
    min-height:30px;
    padding:.32rem .78rem;
  }
  .clients-strip { text-align:center; margin-top:-.75rem; }
  .clients-strip__label { text-align:center; }
  .clients-strip__logos { justify-content:center; }
  .metrics__grid { margin-bottom: 3.5rem; }
  .metric-item { padding: 2.75rem 2rem; min-height: 0; }
  .metric-num { font-size: clamp(2.8rem,5vw,4.5rem); }
  .metric-suffix { font-size: clamp(1.4rem,2.5vw,2.2rem); }
  .metric-item__value { margin-bottom: .6rem; }
  .metric-item__label { font-size: var(--fs-md); line-height: inherit; margin-bottom: .4rem; }
  .metric-item__desc { font-size: var(--fs-sm); line-height: 1.6; }
  .metric-item__hint { margin-top: 1rem; font-size: 10px; }
  .cases__grid    { grid-template-columns: repeat(2, 1fr); }
  .case-card--featured { grid-column: span 2; }
  .case-card--video { grid-column: span 2; }
  .case-card__media--video { height:320px; aspect-ratio:auto; }
  .process__lemon { right:-260px; width:520px; opacity:.1; }
  .team__carousel {
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    width:100%;
    margin-right:0;
    gap:1.25rem;
    padding:0;
    overflow:visible;
    scroll-snap-type:none;
  }
  .team__controls {
    display:none;
    margin:0;
  }
  .team__dots { display:none; }
  .team__carousel-wrap::before,
  .team__carousel-wrap::after { display:none; }
  .team-card { flex:initial; min-width:auto; }
  .team-card__meta { text-align:center; padding:.8rem .5rem 0; }

  .testimonials__slider {
    grid-template-columns: repeat(4, calc(50% - .75rem));
  }
  .testimonials__nav { display:flex; }
  .testimonials__dots { display:none; justify-content:center; }

  .contact__layout { grid-template-columns: 1fr 1fr; }
  .contact .container { padding-left: clamp(1.25rem, 4vw, 3rem); padding-right: clamp(1.25rem, 4vw, 3rem); }
  .contact__info { padding-left:0; padding-right:0; }
  .contact__form-wrap { padding:2.5rem; }
  .contact-form { gap:1.25rem; }
  .form-input { padding:.875rem 1rem; }
  .form-textarea { min-height:120px; }

  .process-step { grid-template-columns: 72px 1fr 260px; gap: 2rem; align-items: center; }
  .process-step__num { font-size: var(--fs-2xl); }
  .process-step__img-wrap { width: 260px; height: 170px; aspect-ratio: auto; margin-top: 0; }
  .process-step__img { border-radius: 10px; }

  .footer__top { flex-direction: row; align-items: center; }
  .footer__bottom { flex-direction: row; justify-content: space-between; }
}

/* ---- Tablet / wide mobile preview ---- */
@media (min-width: 768px) and (max-width: 1023px) {
  .team__carousel > .team-card:first-child {
    grid-column: 1 / -1;
    justify-self: center;
  }
  .hero {
    align-items:flex-start;
  }
  .hero__container {
    min-height:100svh;
    padding-top:7.25rem;
    padding-bottom:clamp(6.5rem, 10svh, 8rem);
  }
  .hero__eyebrow {
    margin-bottom:.75rem;
  }
  .hero__headline {
    max-width:100%;
    font-size:clamp(4.35rem, 8.9vw, 6.25rem);
    margin-bottom:clamp(2.15rem, 4svh, 3rem);
  }
  .hero__bottom {
    margin-top:auto;
    max-width:min(100%, 42rem);
    gap:clamp(1.1rem, 2svh, 1.5rem);
  }
  .hero-funnel {
    position:relative;
    right:auto;
    top:auto;
    bottom:auto;
    width:clamp(390px, 50vw, 520px);
    --hero-funnel-y:0px;
    transform:none;
    margin:0 auto clamp(2.55rem, 4.8svh, 3.6rem);
  }
  .hero__tagline {
    font-size:clamp(1.08rem, 1.7vw, 1.28rem);
    max-width:min(100%, 42rem);
  }
  .hero__cta {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1rem;
    width:min(100%, 42rem);
  }
  .hero__cta .btn-primary,
  .hero__cta .btn-ghost {
    width:100%;
    min-height:3.45rem;
    justify-content:center;
    white-space:nowrap;
  }
  .hero__scroll-hint {
    display:none;
  }
}

/* ---- LG ≥ 1024px ---- */
@media (min-width: 1024px) {
  .nav__links  { display: flex; }
  .nav__toggle { display: none; }
  .hero__container {
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(380px, .78fr);
    grid-template-areas:
      "copy visual";
    column-gap:clamp(3rem, 5.5vw, 6rem);
    align-items:center;
    max-width:min(90vw, 1500px);
    margin:0 auto;
    padding-left:clamp(1.25rem, 4vw, 3rem);
    padding-right:clamp(1.25rem, 4vw, 3rem);
  }
  .hero__copy {
    display:flex;
    grid-area:copy;
    flex-direction:column;
    justify-content:center;
    max-width:100%;
    gap:clamp(2.75rem, 4vh, 3.6rem);
  }
  .hero__top { max-width:100%; }
  .hero__bottom { max-width:100%; }
  .hero__eyebrow span:last-child { font-size:clamp(.75rem, .65vw, 1rem); }
  .hero__eyebrow { margin-bottom:.75rem; }
  .hero__headline {
    max-width:100%;
    font-size:clamp(5.6rem, 6.5vw, 8rem);
    margin-bottom:0;
    overflow:visible;
  }
  .hero__headline .hero__line { overflow:visible; }
  .hero__line--mobile-combo { white-space:normal; }
  .hero__line--mobile-combo span { display:block; }
  .hero__bottom { gap:clamp(1.2rem, 1.4vw, 2rem); }
  .hero__tagline { font-size:clamp(1.1rem, 1vw, 1.65rem); }
  .hero__tagline span { white-space:nowrap; }
  .hero__cta .btn-primary,
  .hero__cta .btn-ghost { font-size:clamp(.875rem, .72vw, 1.05rem); padding:clamp(.875rem, .75vw, 1.1rem) clamp(1.75rem, 1.7vw, 2.5rem); }
  .hero-funnel {
    grid-area:visual;
    position:relative;
    right:auto;
    top:auto;
    justify-self:center;
    align-self:center;
    width:clamp(470px, 35vw, 640px);
    --hero-funnel-y:0px;
    transform:none;
    margin:0;
  }

  .services__grid { grid-template-columns: repeat(3, 1fr); }
  .metrics__grid  { grid-template-columns: repeat(4, 1fr); }
  .cases__grid    { grid-template-columns: repeat(6, 1fr); }
  .case-card--featured,
  .case-card--wide { grid-column: span 3; }
  .case-card--featured .case-card__media,
  .case-card--wide .case-card__media { height: 280px; }
  .cases__grid > .case-card:not(.case-card--featured):not(.case-card--wide) { grid-column: span 2; }
  .case-card__media--video { height: 220px; aspect-ratio: auto; }
  .team__carousel { grid-template-columns:repeat(3, 1fr); gap:1.35rem; }
  .team__carousel > .team-card:first-child {
    grid-column: 1 / -1;
    justify-self: center;
    width: clamp(310px, 28vw, 430px);
  }

  .process-step { grid-template-columns: 80px 1fr 320px; }
  .process-step__img-wrap { width: 320px; height: 200px; }
}

@media (min-width: 1024px) and (max-width: 1199px) {
  .hero__container {
    grid-template-columns:minmax(0, 1fr) minmax(330px, .72fr);
    column-gap:clamp(2rem, 4vw, 3rem);
  }
  .hero__copy {
    gap:2.45rem;
  }
  .hero__headline {
    font-size:clamp(4.8rem, 6vw, 5.9rem);
  }
  .hero-funnel {
    width:clamp(380px, 35vw, 450px);
  }
}

@media (min-width: 1024px) and (max-width: 1199px) and (min-height: 900px) {
  .hero__container {
    max-width:min(92vw, 1080px);
    grid-template-columns:minmax(0, 1fr) minmax(390px, .78fr);
    column-gap:clamp(2.5rem, 4vw, 4rem);
  }
  .hero__copy {
    gap:clamp(2.45rem, 3vh, 3rem);
  }
  .hero__headline {
    font-size:clamp(6rem, 7vw, 7.25rem);
  }
  .hero-funnel {
    width:clamp(520px, 47vw, 620px);
  }
  .hero__tagline {
    font-size:1.18rem;
  }
  .hero__cta {
    display:grid;
    grid-template-columns:1fr 1fr;
    width:min(100%, 38rem);
    gap:1.1rem;
  }
  .hero__cta .btn-primary,
  .hero__cta .btn-ghost {
    width:100%;
    min-height:3.45rem;
    justify-content:center;
    white-space:nowrap;
  }
}

/* ---- XXL ≥ 1600px ---- */
@media (min-width: 1600px) {
  .hero__container {
    max-width:min(88vw, 1600px);
    grid-template-columns:minmax(0, 1fr) minmax(520px, .82fr);
    column-gap:clamp(4rem, 5vw, 6.5rem);
    padding-left:clamp(1.25rem, 4vw, 3rem);
    padding-right:clamp(1.25rem, 4vw, 3rem);
  }
  .hero__headline {
    max-width:100%;
    font-size:clamp(7.2rem, 5.4vw, 9rem);
  }
  .hero__bottom {
    max-width:100%;
  }
  .hero__copy {
    gap:clamp(2.9rem, 3.6vh, 3.8rem);
  }
  .hero-funnel {
    width:clamp(600px, 28vw, 760px);
  }
}

/* ---- Laptop height tuning ---- */
@media (min-width: 1024px) and (max-height: 860px) {
  .hero {
    min-height:100svh;
  }
  .hero__container {
    max-width:min(90vw, 1440px);
    margin:0 auto;
    column-gap:clamp(2.25rem, 5vw, 5rem);
    padding:6.5rem clamp(1.25rem, 4vw, 3rem) 3rem;
  }
  .hero__copy { gap:clamp(2.25rem, 3vh, 2.75rem); }
  .hero__eyebrow { margin-bottom:.85rem; }
  .hero__headline {
    font-size:clamp(5rem, 6.7vw, 7.1rem);
    margin-bottom:0;
  }
  .hero-funnel { width:clamp(420px, 34vw, 540px); transform:none; }
  .hero__tagline { font-size:1.12rem; line-height:1.35; }
  .hero__scroll-hint { display:none; }
}

/* ---- XL ≥ 1280px ---- */
@media (min-width: 1280px) {
  .team__carousel { grid-template-columns:repeat(3, 1fr); gap:1.5rem; }
}

/* ---- Touch: remove hover-only effects ---- */
@media (hover: none) {
  .service-card__glow { display: none; }
  .service-card.is-mobile-active .service-card__glow {
    display:block; width:260px; height:260px;
    left:50%; top:0; transform:translate(-50%,-35%);
    opacity:.36;
  }
  .process-step::before { display: block; }
  .service-card:hover,
  .case-card:hover,
  .team-card:hover { transform: none; }
  .case-card.is-mobile-active { transform:none; }
  /* (gallery button is always visible globally — no override needed here) */
}

/* ---- GALLERY MODAL responsive ---- */
/* Mobile base (< 768px) */
.gallery-modal__panel    { height:min(92vh, 92dvh); }
.gallery-modal__img-wrap { padding:.5rem .75rem; }
.gallery-modal__footer   { padding:.75rem 1rem .9rem; }
.gallery-modal__desc     { display:none; }
.gallery-modal__nav      { display:none; }
.gallery-modal__counter  { display:none; }
.gallery-modal__dots-bar { display:flex; }

@media (min-width: 768px) {
  .gallery-modal__panel    { height:min(88vh, 88dvh); }
  .gallery-modal__img-wrap { padding:1.25rem 4rem; }
  .gallery-modal__footer   { padding:1.1rem 1.5rem 1.25rem; }
  .gallery-modal__desc     { display:block; }
  .gallery-modal__nav      { display:grid; width:44px; height:44px; }
  .gallery-modal__nav--prev { left:.75rem; }
  .gallery-modal__nav--next { right:.75rem; }
  .gallery-modal__counter  { display:block; }
  .gallery-modal__dots-bar { display:none; }
}

/* ---- Print ---- */
@media print {
  #loader, #cursor, .site-header, .marquee-section, .hero__scroll-hint,
  .whatsapp-float { display: none; }
  body { background: #fff; color: #000; }
}
