/* Shared: all service subpages (campaign, film, content, shoot production) */

@import url("service-timeline.css");

.campaign-page,
.film-page,
.content-page,
.shoot-page,
.ecommerce-page,
.fashion-web-page,
.shopify-experts-page,
.brand-identity-page,
.brand-strategy-page,
.creative-direction-page {
  --sub-wrap: min(1580px, calc(100% - 2 * var(--section-inline)));
  --sub-media: min(1760px, 100%);
  --sub-body: clamp(0.9375rem, 1.05vw, 1rem);
  --sub-body-lg: clamp(1rem, 1.22vw, 1.125rem);
  --sub-heading-sm: clamp(0.875rem, 1.15vw, 1rem);
  --sub-title-hero: clamp(1.875rem, 3.9vw, 3rem);
  --sub-title-split: clamp(1.875rem, 3.85vw, 2.875rem);
  --sub-title-phase: clamp(1.25rem, 2.2vw, 1.5rem);
  --sub-pad-block: clamp(4rem, 11vh, 7rem);
  --sub-pad-hero-top: clamp(3.25rem, 9vh, 5.5rem);
  --sub-pad-hero-b: clamp(4rem, 10vh, 6.5rem);
  --sub-pad-media-b: clamp(4rem, 10vh, 6.5rem);
  --sub-gap-col: clamp(3.5rem, 8vw, 7.5rem);
  --sub-gap-row: clamp(2.5rem, 5.5vw, 5rem);
  --sub-gap-body: clamp(1.25rem, 2.2vh, 1.65rem);
  --sub-gap-blocks: clamp(2.25rem, 4.5vh, 3.5rem);
  --sub-grid-hero: minmax(0, 0.88fr) minmax(0, 1.12fr);
  --sub-grid-split: minmax(0, 0.88fr) minmax(0, 1.12fr);
  --sub-prose-max: min(40rem, 100%);
}

/* —— Layout wrappers —— */
.campaign-page .cp-wrap,
.film-page .ff-wrap,
.content-page .cc-wrap,
.shoot-page .fsp-wrap,
.ecommerce-page .ec-wrap,
.fashion-web-page .fwd-wrap,
.shopify-experts-page .se-wrap,
.brand-identity-page .bi-wrap,
.brand-strategy-page .bs-wrap,
.creative-direction-page .cd-wrap {
  width: var(--sub-wrap);
  margin-inline: auto;
}

.campaign-page .cp-collage__grid,
.campaign-page .cp-duo__grid,
.campaign-page .cp-feature__img,
.content-page .cc-feature__img {
  width: var(--sub-media);
}

/* —— Full-bleed videos (edge-to-edge, no side margins) —— */
.film-page .ff-video,
.content-page .cc-video,
.shoot-page .fsp-media-section,
.ecommerce-page .ec-media-section,
.fashion-web-page .fwd-media-section,
.shopify-experts-page .se-media-section ,
.brand-identity-page .bi-media-section,
.brand-strategy-page .bs-media-section,
.creative-direction-page .cd-media-section {
  width: 100%;
  max-width: none;
  padding-left: 0;
  padding-right: 0;

}

.film-page .ff-video__inner,
.content-page .cc-video__inner,
.shoot-page .fsp-media,
.ecommerce-page .ec-media,
.fashion-web-page .fwd-media,
.shopify-experts-page .se-media ,
.brand-identity-page .bi-media,
.brand-strategy-page .bs-media,
.creative-direction-page .cd-media {
  width: 100%;
  max-width: none;
  margin-inline: 0;

}

.film-page .ff-video__el,
.content-page .cc-video__el,
.shoot-page .fsp-video__el,
.ecommerce-page .ec-video__el,
.fashion-web-page .fwd-video__el,
.shopify-experts-page .se-video__el ,
.brand-identity-page .bi-video__el,
.brand-strategy-page .bs-video__el,
.creative-direction-page .cd-video__el {
  width: 100%;
  max-width: none;
  height: auto;
  display: block;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: #0a0a0a;

}

.content-page .cc-case__media {
  width: 100vw;
  max-width: 100vw;
  margin-inline: calc(50% - 50vw);
}

.content-page .cc-case__media .cc-video__el {
  aspect-ratio: 16 / 9;
  max-height: none;
}

/* —— Hero sections —— */
.campaign-page .cp-hero,
.film-page .ff-hero:not(.ff-hero--mid),
.content-page .cc-hero:not(.cc-hero--mid),
.shoot-page .fsp-hero,
.ecommerce-page .ec-hero,
.fashion-web-page .fwd-hero,
.shopify-experts-page .se-hero ,
.brand-identity-page .bi-hero,
.brand-strategy-page .bs-hero,
.creative-direction-page .cd-hero {
  padding: calc(var(--header-h) + var(--sub-pad-hero-top)) var(--section-inline) var(--sub-pad-hero-b);

}

.film-page .ff-hero--mid,
.content-page .cc-hero--mid {
  padding: var(--sub-pad-block) var(--section-inline);
}

.campaign-page .cp-hero__grid,
.film-page .ff-hero__grid,
.content-page .cc-hero__grid,
.shoot-page .fsp-hero__grid,
.ecommerce-page .ec-hero__grid,
.fashion-web-page .fwd-hero__grid,
.shopify-experts-page .se-hero__grid ,
.brand-identity-page .bi-hero__grid,
.brand-strategy-page .bs-hero__grid,
.creative-direction-page .cd-hero__grid {
  display: grid;
  grid-template-columns: var(--sub-grid-hero);
  gap: var(--sub-gap-col) var(--sub-gap-row);
  align-items: start;

}

.campaign-page .cp-hero__title,
.film-page .ff-hero__title,
.content-page .cc-hero__title,
.shoot-page .fsp-hero__title,
.ecommerce-page .ec-hero__title,
.fashion-web-page .fwd-hero__title,
.shopify-experts-page .se-hero__title,
.ecommerce-page .ec-split__title,
.fashion-web-page .fwd-split__title,
.shopify-experts-page .se-split__title,
.ecommerce-page .ec-guide__lead,
.fashion-web-page .fwd-guide__lead,
.shopify-experts-page .se-guide__lead,
.ecommerce-page .ec-timeline-head__title,
.fashion-web-page .fwd-timeline-head__title,
.shopify-experts-page .se-timeline-head__title,
.ecommerce-page .ec-faq__title,
.fashion-web-page .fwd-faq__title,
.shopify-experts-page .se-faq__title,
.ecommerce-page .ec-cta__title,
.fashion-web-page .fwd-cta__title,
.shopify-experts-page .se-cta__title,
.ecommerce-page .ec-work__title,
.fashion-web-page .fwd-work__title,
.shopify-experts-page .se-work__title,
.campaign-page .cp-split__title,
.campaign-page .cp-timeline-head__title,
.campaign-page .cp-faq__title,
.campaign-page .cp-cta__title,
.film-page .ff-timeline-head__title,
.film-page .ff-faq__title,
.film-page .ff-cta__title,
.content-page .cc-includes__title,
.content-page .cc-timeline-head__title,
.content-page .cc-faq__title,
.content-page .cc-cta__title,
.content-page .cc-dark__title,
.shoot-page .fsp-split__title,
.shoot-page .fsp-guide__lead,
.shoot-page .fsp-timeline-head__title,
.shoot-page .fsp-faq__title,
.shoot-page .fsp-cta__title,
.brand-identity-page .bi-hero__title,
.brand-identity-page .bi-split__title,
.brand-identity-page .bi-guide__lead,
.brand-identity-page .bi-timeline-head__title,
.brand-identity-page .bi-faq__title,
.brand-identity-page .bi-cta__title,
.brand-identity-page .bi-work__title,
.brand-strategy-page .bs-hero__title,
.brand-strategy-page .bs-split__title,
.brand-strategy-page .bs-guide__lead,
.brand-strategy-page .bs-timeline-head__title,
.brand-strategy-page .bs-faq__title,
.brand-strategy-page .bs-cta__title,
.brand-strategy-page .bs-work__title,
.creative-direction-page .cd-hero__title,
.creative-direction-page .cd-split__title,
.creative-direction-page .cd-guide__lead,
.creative-direction-page .cd-timeline-head__title,
.creative-direction-page .cd-faq__title,
.creative-direction-page .cd-cta__title,
.creative-direction-page .cd-work__title {
  font-weight: 600;
  text-transform: uppercase;
  color: var(--black);
}

.campaign-page .cp-hero__title,
.film-page .ff-hero__title,
.content-page .cc-hero__title,
.shoot-page .fsp-hero__title,
.ecommerce-page .ec-hero__title,
.fashion-web-page .fwd-hero__title,
.shopify-experts-page .se-hero__title ,
.brand-identity-page .bi-hero__title,
.brand-strategy-page .bs-hero__title,
.creative-direction-page .cd-hero__title {
  margin: 0;
  font-size: var(--sub-title-hero);
  line-height: 1.1;
  letter-spacing: -0.03em;

}

.campaign-page .cp-split__title,
.campaign-page .cp-timeline-head__title,
.campaign-page .cp-faq__title,
.campaign-page .cp-cta__title,
.film-page .ff-timeline-head__title,
.film-page .ff-faq__title,
.film-page .ff-cta__title,
.content-page .cc-includes__title,
.content-page .cc-timeline-head__title,
.content-page .cc-faq__title,
.content-page .cc-cta__title,
.content-page .cc-dark__title,
.shoot-page .fsp-split__title,
.shoot-page .fsp-guide__lead,
.shoot-page .fsp-timeline-head__title,
.shoot-page .fsp-faq__title,
.shoot-page .fsp-cta__title,
.ecommerce-page .ec-split__title,
.fashion-web-page .fwd-split__title,
.shopify-experts-page .se-split__title,
.ecommerce-page .ec-guide__lead,
.fashion-web-page .fwd-guide__lead,
.shopify-experts-page .se-guide__lead,
.ecommerce-page .ec-timeline-head__title,
.fashion-web-page .fwd-timeline-head__title,
.shopify-experts-page .se-timeline-head__title,
.ecommerce-page .ec-faq__title,
.fashion-web-page .fwd-faq__title,
.shopify-experts-page .se-faq__title,
.ecommerce-page .ec-cta__title,
.fashion-web-page .fwd-cta__title,
.shopify-experts-page .se-cta__title,
.ecommerce-page .ec-work__title,
.fashion-web-page .fwd-work__title,
.shopify-experts-page .se-work__title,
.brand-identity-page .bi-split__title,
.brand-identity-page .bi-guide__lead,
.brand-identity-page .bi-timeline-head__title,
.brand-identity-page .bi-faq__title,
.brand-identity-page .bi-cta__title,
.brand-identity-page .bi-work__title,
.brand-strategy-page .bs-split__title,
.brand-strategy-page .bs-guide__lead,
.brand-strategy-page .bs-timeline-head__title,
.brand-strategy-page .bs-faq__title,
.brand-strategy-page .bs-cta__title,
.brand-strategy-page .bs-work__title,
.creative-direction-page .cd-split__title,
.creative-direction-page .cd-guide__lead,
.creative-direction-page .cd-timeline-head__title,
.creative-direction-page .cd-faq__title,
.creative-direction-page .cd-cta__title,
.creative-direction-page .cd-work__title {
  margin: 0;
  font-size: var(--sub-title-split);
  line-height: 1.1;
  letter-spacing: -0.025em;

}

.shoot-page .fsp-phase__title,
.ecommerce-page .ec-topic__title,
.fashion-web-page .fwd-topic__title,
.shopify-experts-page .se-topic__title ,
.brand-identity-page .bi-topic__title,
.brand-strategy-page .bs-topic__title,
.creative-direction-page .cd-topic__title {
  font-size: var(--sub-title-phase);

}

.campaign-page .cp-hero__title-line,
.film-page .ff-hero__title-line,
.content-page .cc-hero__title-line,
.shoot-page .fsp-hero__title-line,
.ecommerce-page .ec-hero__title-line,
.fashion-web-page .fwd-hero__title-line,
.shopify-experts-page .se-hero__title-line,
.campaign-page .cp-split__title-line,
.shoot-page .fsp-split__title-line,
.shoot-page .fsp-timeline-head__title-line,
.ecommerce-page .ec-split__title-line,
.fashion-web-page .fwd-split__title-line,
.shopify-experts-page .se-split__title-line,
.ecommerce-page .ec-timeline-head__title-line,
.fashion-web-page .fwd-timeline-head__title-line,
.shopify-experts-page .se-timeline-head__title-line ,
.brand-identity-page .bi-hero__title-line,
.brand-identity-page .bi-split__title-line,
.brand-identity-page .bi-timeline-head__title-line,
.brand-strategy-page .bs-hero__title-line,
.brand-strategy-page .bs-split__title-line,
.brand-strategy-page .bs-timeline-head__title-line,
.creative-direction-page .cd-hero__title-line,
.creative-direction-page .cd-split__title-line,
.creative-direction-page .cd-timeline-head__title-line {
  display: block;

}

/* —— Hero / split body copy —— */
.campaign-page .cp-hero__body,
.film-page .ff-hero__body,
.content-page .cc-hero__body,
.shoot-page .fsp-hero__body,
.ecommerce-page .ec-hero__body,
.fashion-web-page .fwd-hero__body,
.shopify-experts-page .se-hero__body ,
.brand-identity-page .bi-hero__body,
.brand-strategy-page .bs-hero__body,
.creative-direction-page .cd-hero__body {
  display: flex;
  flex-direction: column;
  gap: var(--sub-gap-body);
  max-width: var(--sub-prose-max);
  padding-top: 0;
  justify-self: stretch;

}

.campaign-page .cp-split__intro,
.campaign-page .cp-hero__body,
.film-page .ff-hero__body,
.content-page .cc-hero__body,
.content-page .cc-includes__intro,
.shoot-page .fsp-prose,
.ecommerce-page .ec-prose,
.fashion-web-page .fwd-prose,
.shopify-experts-page .se-prose,
.brand-identity-page .bi-prose,
.brand-strategy-page .bs-prose,
.creative-direction-page .cd-prose,
.campaign-page .cp-timeline-head__intro,
.film-page .ff-timeline-head__intro,
.content-page .cc-timeline-head__intro,
.shoot-page .fsp-timeline-head__intro,
.ecommerce-page .ec-timeline-head__intro,
.fashion-web-page .fwd-timeline-head__intro,
.shopify-experts-page .se-timeline-head__intro,
.brand-identity-page .bi-timeline-head__intro,
.brand-strategy-page .bs-timeline-head__intro,
.creative-direction-page .cd-timeline-head__intro {
  max-width: var(--sub-prose-max);
}

.campaign-page .cp-hero__body p,
.campaign-page .cp-split__intro p,
.campaign-page .cp-block__body p,
.campaign-page .cp-timeline-head__intro p,
.campaign-page .cp-timeline__text,
.campaign-page .cp-faq__intro,
.campaign-page .cp-cta__body p,
.campaign-page .accordion__panel p,
.film-page .ff-hero__body p,
.film-page .ff-make__item p,
.film-page .ff-timeline-head__intro p,
.film-page .ff-timeline__text,
.film-page .ff-faq__intro,
.film-page .ff-cta__body p,
.film-page .accordion__panel p,
.content-page .cc-hero__body p,
.content-page .cc-includes__intro p,
.content-page .cc-block__body p,
.content-page .cc-timeline-head__intro p,
.content-page .cc-timeline__text,
.content-page .cc-faq__intro,
.content-page .cc-cta__body p,
.content-page .cc-dark__body p,
.content-page .accordion__panel p,
.shoot-page .fsp-prose p,
.shoot-page .accordion__panel p,
.shoot-page .fsp-item__body p,
.shoot-page .fsp-timeline__text,
.shoot-page .fsp-timeline__note,
.shoot-page .fsp-faq__intro,
.shoot-page .fsp-cta__body p,
.ecommerce-page .ec-prose p,
.fashion-web-page .fwd-prose p,
.shopify-experts-page .se-prose p,
.ecommerce-page .accordion__panel p,
.ecommerce-page .ec-topic__body p,
.fashion-web-page .fwd-topic__body p,
.shopify-experts-page .se-topic__body p,
.ecommerce-page .ec-phases__text,
.fashion-web-page .fwd-phases__text,
.shopify-experts-page .se-phases__text,
.ecommerce-page .ec-work__text,
.fashion-web-page .fwd-work__text,
.shopify-experts-page .se-work__text,
.ecommerce-page .ec-faq__intro,
.fashion-web-page .fwd-faq__intro,
.shopify-experts-page .se-faq__intro,
.ecommerce-page .ec-cta__body p,
.fashion-web-page .fwd-cta__body p,
.shopify-experts-page .se-cta__body p ,
.brand-identity-page .bi-prose p,
.brand-strategy-page .bs-prose p,
.creative-direction-page .cd-prose p,
.brand-identity-page .bi-topic__body p,
.brand-strategy-page .bs-topic__body p,
.creative-direction-page .cd-topic__body p,
.brand-identity-page .bi-work__text,
.brand-strategy-page .bs-work__text,
.creative-direction-page .cd-work__text,
.brand-identity-page .bi-faq__intro,
.brand-strategy-page .bs-faq__intro,
.creative-direction-page .cd-faq__intro,
.brand-identity-page .bi-cta__body p,
.brand-strategy-page .bs-cta__body p,
.creative-direction-page .cd-cta__body p {
  margin: 0 0 clamp(0.9rem, 1.6vh, 1.15rem);
  font-size: var(--sub-body);
  line-height: 1.58;
  color: #1a1a1a;
}

.campaign-page .cp-hero__body p:last-child,
.campaign-page .cp-split__intro p:last-child,
.campaign-page .cp-block__body p:last-child,
.campaign-page .cp-timeline-head__intro p:last-child,
.film-page .ff-hero__body p:last-child,
.content-page .cc-hero__body p:last-child,
.content-page .cc-includes__intro p:last-child,
.content-page .cc-block__body p:last-child,
.content-page .cc-timeline-head__intro p:last-child,
.shoot-page .fsp-prose p:last-child,
.shoot-page .accordion__panel p:last-child,
.ecommerce-page .ec-prose p:last-child,
.fashion-web-page .fwd-prose p:last-child,
.shopify-experts-page .se-prose p:last-child,
.ecommerce-page .accordion__panel p:last-child ,
.brand-identity-page .bi-prose p:last-child,
.brand-strategy-page .bs-prose p:last-child,
.creative-direction-page .cd-prose p:last-child,
.brand-identity-page .bi-topic__body p:last-child,
.brand-strategy-page .bs-topic__body p:last-child,
.creative-direction-page .cd-topic__body p:last-child {
  margin-bottom: 0;
}

/* Shoot subpages: prose blocks inside split / CTA columns */
.shoot-page .fsp-prose h3,
.shoot-page .fsp-cta__body h3 {
  margin: clamp(1.75rem, 3.5vh, 2.25rem) 0 clamp(0.85rem, 1.6vh, 1.1rem);
  font-size: var(--sub-title-phase);
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: var(--black);
}

.shoot-page .fsp-prose h3:first-child,
.shoot-page .fsp-cta__body h3:first-child {
  margin-top: 0;
}

.shoot-page .fsp-prose ul,
.shoot-page .fsp-cta__body ul {
  margin: 0 0 clamp(1.25rem, 2.2vh, 1.65rem);
  padding: 0 0 0 1.15em;
  list-style: disc;
}

.shoot-page .fsp-prose ul li,
.shoot-page .fsp-cta__body ul li {
  margin: 0 0 clamp(0.5rem, 1vh, 0.65rem);
  font-size: var(--sub-body);
  line-height: 1.58;
  color: #1a1a1a;
}

.shoot-page .fsp-prose ul li:last-child,
.shoot-page .fsp-cta__body ul li:last-child {
  margin-bottom: 0;
}

.shoot-page .fsp-prose a,
.shoot-page .fsp-cta__body a:not(.fsp-cta__btn) {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.shoot-page .fsp-prose a:hover,
.shoot-page .fsp-cta__body a:not(.fsp-cta__btn):hover {
  opacity: 0.55;
}

.campaign-page .cp-faq__intro,
.film-page .ff-faq__intro,
.content-page .cc-faq__intro,
.shoot-page .fsp-faq__intro,
.ecommerce-page .ec-faq__intro,
.fashion-web-page .fwd-faq__intro,
.shopify-experts-page .se-faq__intro ,
.brand-identity-page .bi-faq__intro,
.brand-strategy-page .bs-faq__intro,
.creative-direction-page .cd-faq__intro {
  margin-bottom: 0;

}

.content-page .cc-dark__body p {
  color: rgba(255, 255, 255, 0.92);
}

.campaign-page .cp-block__heading,
.film-page .ff-make__item h3,
.film-page .ff-make__label,
.content-page .cc-block__heading,
.shoot-page .fsp-item__heading,
.ecommerce-page .ec-topic__heading,
.fashion-web-page .fwd-topic__heading,
.shopify-experts-page .se-topic__heading ,
.brand-identity-page .bi-topic__heading,
.brand-strategy-page .bs-topic__heading,
.creative-direction-page .cd-topic__heading {
  font-size: var(--sub-heading-sm);

}

/* —— Split / mid sections —— */
.campaign-page .cp-split,
.campaign-page .cp-faq,
.campaign-page .cp-cta,
.campaign-page .cp-timeline-section,
.film-page .ff-make,
.film-page .ff-timeline-section,
.film-page .ff-faq,
.film-page .ff-cta,
.content-page .cc-includes,
.content-page .cc-dark,
.content-page .cc-case,
.content-page .cc-timeline-section,
.content-page .cc-faq,
.content-page .cc-cta,
.shoot-page .fsp-split,
.shoot-page .fsp-guide,
.shoot-page .fsp-timeline-section,
.shoot-page .fsp-faq,
.shoot-page .fsp-cta,
.ecommerce-page .ec-split,
.fashion-web-page .fwd-split,
.shopify-experts-page .se-split,
.shopify-experts-page .se-chapter,
.ecommerce-page .ec-guide,
.fashion-web-page .fwd-guide,
.shopify-experts-page .se-guide,
.fashion-web-page .fwd-services,
.shopify-experts-page .se-services,
.ecommerce-page .ec-timeline-section,
.fashion-web-page .fwd-timeline-section,
.shopify-experts-page .se-timeline-section,
.ecommerce-page .ec-work-section,
.fashion-web-page .fwd-work-section,
.shopify-experts-page .se-work-section,
.ecommerce-page .ec-faq,
.fashion-web-page .fwd-faq,
.shopify-experts-page .se-faq,
.shopify-experts-page .se-brands-section,
.ecommerce-page .ec-cta,
.fashion-web-page .fwd-cta,
.shopify-experts-page .se-cta ,
.brand-identity-page .bi-split,
.brand-strategy-page .bs-split,
.creative-direction-page .cd-split,
.brand-identity-page .bi-chapter,
.brand-strategy-page .bs-chapter,
.creative-direction-page .cd-chapter,
.ecommerce-page .ec-guide,
.fashion-web-page .fwd-guide,
.brand-identity-page .bi-guide,
.brand-strategy-page .bs-guide,
.creative-direction-page .cd-guide,
.fashion-web-page .fwd-services,
.brand-identity-page .bi-services,
.brand-strategy-page .bs-services,
.creative-direction-page .cd-services,
.ecommerce-page .ec-timeline-section,
.fashion-web-page .fwd-timeline-section,
.brand-identity-page .bi-timeline-section,
.brand-strategy-page .bs-timeline-section,
.creative-direction-page .cd-timeline-section,
.ecommerce-page .ec-work-section,
.fashion-web-page .fwd-work-section,
.brand-identity-page .bi-work-section,
.brand-strategy-page .bs-work-section,
.creative-direction-page .cd-work-section,
.ecommerce-page .ec-faq,
.fashion-web-page .fwd-faq,
.brand-identity-page .bi-faq,
.brand-strategy-page .bs-faq,
.creative-direction-page .cd-faq,
.brand-identity-page .bi-brands-section,
.brand-strategy-page .bs-brands-section,
.creative-direction-page .cd-brands-section,
.ecommerce-page .ec-cta,
.fashion-web-page .fwd-cta,
.brand-identity-page .bi-cta,
.brand-strategy-page .bs-cta,
.creative-direction-page .cd-cta {
  padding: var(--sub-pad-block) var(--section-inline);
}

.campaign-page .cp-split__grid,
.campaign-page .cp-cta__grid,
.campaign-page .cp-timeline-head,
.campaign-page .cp-faq__head,
.film-page .ff-cta__grid,
.film-page .ff-timeline-head,
.film-page .ff-faq__head,
.content-page .cc-includes__grid,
.content-page .cc-cta__grid,
.content-page .cc-timeline-head,
.content-page .cc-faq__head,
.shoot-page .fsp-split__grid,
.shoot-page .fsp-cta__grid,
.shoot-page .fsp-timeline-head,
.shoot-page .fsp-faq__head,
.ecommerce-page .ec-split__grid,
.fashion-web-page .fwd-split__grid,
.shopify-experts-page .se-split__grid,
.ecommerce-page .ec-cta__grid,
.fashion-web-page .fwd-cta__grid,
.shopify-experts-page .se-cta__grid,
.ecommerce-page .ec-timeline-head,
.fashion-web-page .fwd-timeline-head,
.shopify-experts-page .se-timeline-head,
.ecommerce-page .ec-faq__head,
.fashion-web-page .fwd-faq__head,
.shopify-experts-page .se-faq__head,
.ecommerce-page .ec-guide__grid,
.fashion-web-page .fwd-guide__grid,
.shopify-experts-page .se-guide__grid ,
.brand-identity-page .bi-split__grid,
.brand-strategy-page .bs-split__grid,
.creative-direction-page .cd-split__grid,
.brand-identity-page .bi-cta__grid,
.brand-strategy-page .bs-cta__grid,
.creative-direction-page .cd-cta__grid,
.brand-identity-page .bi-timeline-head,
.brand-strategy-page .bs-timeline-head,
.creative-direction-page .cd-timeline-head,
.brand-identity-page .bi-faq__head,
.brand-strategy-page .bs-faq__head,
.creative-direction-page .cd-faq__head,
.brand-identity-page .bi-guide__grid,
.brand-strategy-page .bs-guide__grid,
.creative-direction-page .cd-guide__grid {
  display: grid;
  grid-template-columns: var(--sub-grid-split);
  gap: var(--sub-gap-col) var(--sub-gap-row);
  align-items: start;
}

.campaign-page .cp-split__col,
.film-page .ff-make__grid,
.content-page .cc-includes__col,
.shoot-page .fsp-items,
.ecommerce-page .ec-topics,
.fashion-web-page .fwd-topics,
.shopify-experts-page .se-topics ,
.brand-identity-page .bi-topics,
.brand-strategy-page .bs-topics,
.creative-direction-page .cd-topics {
  gap: var(--sub-gap-blocks);

}

.campaign-page .cp-collage,
.campaign-page .cp-duo,
.campaign-page .cp-feature,
.film-page .ff-video,
.content-page .cc-video,
.content-page .cc-feature,
.shoot-page .fsp-media-section,
.ecommerce-page .ec-media-section,
.fashion-web-page .fwd-media-section,
.shopify-experts-page .se-media-section ,
.brand-identity-page .bi-media-section,
.brand-strategy-page .bs-media-section,
.creative-direction-page .cd-media-section {
  padding-bottom: var(--sub-pad-media-b);

}

.campaign-page .cp-collage__grid,
.campaign-page .cp-duo__grid {
  gap: var(--sub-gap-row);
}

.film-page .ff-taglines {
  font-size: var(--sub-body-lg);
}

/* —— Timeline labels —— */
.campaign-page .cp-timeline__name,
.film-page .ff-timeline__name,
.content-page .cc-timeline__name,
.shoot-page .fsp-timeline__name,
.ecommerce-page .ec-timeline__name,
.fashion-web-page .fwd-timeline__name,
.shopify-experts-page .se-timeline__name,
.brand-identity-page .bi-timeline__name,
.brand-strategy-page .bs-timeline__name,
.creative-direction-page .cd-timeline__name {
  font-size: clamp(1.0625rem, 1.4vw, 1.125rem);

}

/* —— Accordion —— */
.campaign-page .accordion__head,
.film-page .accordion__head,
.content-page .accordion__head,
.shoot-page .accordion__head,
.ecommerce-page .accordion__head {
  font-size: clamp(0.8125rem, 1.05vw, 0.9375rem);
  letter-spacing: 0.05em;
  padding-top: 1.65rem;
  padding-bottom: 1.65rem;
}

.content-page .accordion__icon,
.shoot-page .accordion__icon,
.ecommerce-page .accordion__icon {
  border-right-color: var(--pink);
  border-bottom-color: var(--pink);
}

/* —— Section foot / back to top —— */
.campaign-page .cp-section__foot,
.film-page .ff-section__foot,
.content-page .cc-section__foot,
.shoot-page .fsp-section__foot,
.ecommerce-page .ec-section__foot,
.fashion-web-page .fwd-section__foot,
.shopify-experts-page .se-section__foot ,
.brand-identity-page .bi-section__foot,
.brand-strategy-page .bs-section__foot,
.creative-direction-page .cd-section__foot {
  padding-top: clamp(3rem, 7vh, 5rem);

}

/* —— CTA buttons —— */
.campaign-page .cp-cta__btn,
.film-page .ff-cta__btn,
.content-page .cc-cta__btn,
.shoot-page .fsp-cta__btn,
.ecommerce-page .ec-cta__btn,
.fashion-web-page .fwd-cta__btn,
.shopify-experts-page .se-cta__btn ,
.brand-identity-page .bi-cta__btn,
.brand-strategy-page .bs-cta__btn,
.creative-direction-page .cd-cta__btn {
  display: inline-block;
  margin-top: clamp(0.5rem, 1.5vh, 1rem);
  background: var(--black);
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
  align-self: flex-start;
  transition: opacity 0.2s ease;
  color: var(--white);
  font-size: clamp(0.75rem, 0.95vw, 0.8125rem);
  padding: 1.1rem 2rem;
  letter-spacing: 0.16em;

}

.campaign-page .cp-cta__body a:not(.cp-cta__btn),
.film-page .ff-cta__body a:not(.ff-cta__btn),
.content-page .cc-cta__body a:not(.cc-cta__btn),
.shoot-page .fsp-cta__body a:not(.fsp-cta__btn),
.ecommerce-page .ec-cta__body a:not(.ec-cta__btn),
.fashion-web-page .fwd-cta__body a:not(.fwd-cta__btn),
.shopify-experts-page .se-cta__body a:not(.se-cta__btn) ,
.brand-identity-page .bi-cta__body a:not(.bi-cta__btn),
.brand-strategy-page .bs-cta__body a:not(.bs-cta__btn),
.creative-direction-page .cd-cta__body a:not(.cd-cta__btn) {
  color: inherit;
}

.campaign-page .cp-cta__btn:hover,
.campaign-page .cp-cta__btn:focus-visible,
.film-page .ff-cta__btn:hover,
.film-page .ff-cta__btn:focus-visible,
.content-page .cc-cta__btn:hover,
.content-page .cc-cta__btn:focus-visible,
.shoot-page .fsp-cta__btn:hover,
.shoot-page .fsp-cta__btn:focus-visible,
.ecommerce-page .ec-cta__btn:hover,
.fashion-web-page .fwd-cta__btn:hover,
.shopify-experts-page .se-cta__btn:hover,
.ecommerce-page .ec-cta__btn:focus-visible,
.fashion-web-page .fwd-cta__btn:focus-visible,
.shopify-experts-page .se-cta__btn:focus-visible ,
.brand-identity-page .bi-cta__btn:hover,
.brand-identity-page .bi-cta__btn:focus-visible,
.brand-strategy-page .bs-cta__btn:hover,
.brand-strategy-page .bs-cta__btn:focus-visible,
.creative-direction-page .cd-cta__btn:hover,
.creative-direction-page .cd-cta__btn:focus-visible {
  color: var(--white);
  opacity: 0.72;
}

/* —— Footer services grid —— */
.footer-services {
  padding: clamp(3.5rem, 9vh, 6rem) var(--section-inline) clamp(2.5rem, 6vh, 4rem);
  background: var(--white);
  border-top: 1px solid rgba(0, 0, 0, 0.06);
}

.footer-services__inner {
  width: var(--sub-wrap, min(1580px, calc(100% - 2 * var(--section-inline))));
  margin-inline: auto;
}

.footer-services__title {
  margin: 0 0 clamp(2.5rem, 5vh, 3.5rem);
  font-size: var(--sub-title-split);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -0.025em;
  text-transform: uppercase;
  color: var(--black);
}

.footer-services__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(2rem, 4vw, 3.5rem) clamp(1.5rem, 3vw, 2.5rem);
}

.footer-services__col-title {
  margin: 0 0 clamp(1rem, 2vh, 1.35rem);
  font-size: clamp(0.78rem, 1vw, 0.875rem);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--black);
}

.footer-services__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(0.55rem, 1.2vh, 0.75rem);
}

.footer-services__list a {
  font-size: clamp(0.72rem, 0.95vw, 0.8125rem);
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
  color: var(--black);
  line-height: 1.45;
}

.footer-services__list a:hover,
.footer-services__list a:focus-visible {
  opacity: 0.55;
}

.footer-services__label {
  display: block;
  font-size: clamp(0.72rem, 0.95vw, 0.8125rem);
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--black);
  line-height: 1.45;
  cursor: default;
}

.footer-services__foot {
  display: flex;
  justify-content: center;
  padding-top: clamp(3rem, 7vh, 4.5rem);
}

.footer-services__back-top {
  display: block;
  width: 12px;
  height: 12px;
  border-right: 2px solid var(--pink);
  border-bottom: 2px solid var(--pink);
  transform: rotate(-135deg);
  text-decoration: none;
  opacity: 0.95;
  transition: opacity 0.2s ease, transform 0.2s var(--ease-out);
}

.footer-services__back-top:hover,
.footer-services__back-top:focus-visible {
  opacity: 0.55;
  transform: rotate(-135deg) translateY(-3px);
}

.campaign-page .site-footer,
.film-page .site-footer,
.content-page .site-footer,
.shoot-page .site-footer,
.ecommerce-page .site-footer,
.fashion-web-page .site-footer,
.shopify-experts-page .site-footer,
.brand-identity-page .site-footer,
.brand-strategy-page .site-footer,
.creative-direction-page .site-footer {
  padding-top: clamp(2rem, 4vh, 3rem);
}

@media (max-width: 900px) {
  .campaign-page .cp-hero__grid,
  .film-page .ff-hero__grid,
  .content-page .cc-hero__grid,
  .content-page .cc-includes__grid,
  .shoot-page .fsp-hero__grid,
  .ecommerce-page .ec-hero__grid,
  .fashion-web-page .fwd-hero__grid,
  .shopify-experts-page .se-hero__grid,
  .brand-identity-page .bi-hero__grid,
  .brand-strategy-page .bs-hero__grid,
  .creative-direction-page .cd-hero__grid,
  .shoot-page .fsp-split__grid,
  .ecommerce-page .ec-split__grid,
  .fashion-web-page .fwd-split__grid,
  .shopify-experts-page .se-split__grid,
  .brand-identity-page .bi-split__grid,
  .brand-strategy-page .bs-split__grid,
  .creative-direction-page .cd-split__grid,
  .campaign-page .cp-split__grid,
  .campaign-page .cp-cta__grid,
  .campaign-page .cp-timeline-head,
  .campaign-page .cp-faq__head,
  .film-page .ff-cta__grid,
  .film-page .ff-timeline-head,
  .film-page .ff-faq__head,
  .content-page .cc-cta__grid,
  .content-page .cc-timeline-head,
  .content-page .cc-faq__head,
  .shoot-page .fsp-cta__grid,
  .ecommerce-page .ec-cta__grid,
  .fashion-web-page .fwd-cta__grid,
  .shopify-experts-page .se-cta__grid,
  .brand-identity-page .bi-cta__grid,
  .brand-strategy-page .bs-cta__grid,
  .creative-direction-page .cd-cta__grid,
  .shoot-page .fsp-timeline-head,
  .ecommerce-page .ec-timeline-head,
  .fashion-web-page .fwd-timeline-head,
  .shopify-experts-page .se-timeline-head,
  .brand-identity-page .bi-timeline-head,
  .brand-strategy-page .bs-timeline-head,
  .shoot-page .fsp-faq__head,
  .ecommerce-page .ec-faq__head,
  .fashion-web-page .fwd-faq__head,
  .shopify-experts-page .se-faq__head,
  .brand-identity-page .bi-faq__head,
  .brand-strategy-page .bs-faq__head,
  .creative-direction-page .cd-faq__head,
  .shoot-page .fsp-guide__grid,
  .ecommerce-page .ec-guide__grid,
  .fashion-web-page .fwd-guide__grid,
  .shopify-experts-page .se-guide__grid,
  .brand-identity-page .bi-guide__grid,
  .brand-strategy-page .bs-guide__grid,
  .creative-direction-page .cd-guide__grid {
    grid-template-columns: 1fr;
  }

  .shoot-page .fsp-guide__lead,
  .ecommerce-page .ec-guide__lead,
  .fashion-web-page .fwd-guide__lead,
  .shopify-experts-page .se-guide__lead,
  .brand-identity-page .bi-guide__lead,
  .brand-strategy-page .bs-guide__lead,
  .creative-direction-page .cd-guide__lead {
    position: static;
  }
}

@media (max-width: 1024px) {
  .footer-services__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .footer-services__grid {
    grid-template-columns: 1fr;
  }
}