/* =======================================================================
   Template "Signature" — éditorial premium
   Overrides and specifics on top of base.css + components.css + sections.css
   ======================================================================= */

/* Background & base feel */
body.template-signature {
  background: var(--color-bg);
}

/* Strong serif for display text */
.template-signature h1,
.template-signature h2,
.template-signature .hero__title,
.template-signature .manifesto__quote,
.template-signature .testimonial__text {
  font-weight: 400;
  letter-spacing: -0.03em;
}

/* Hero — full-size editorial feel */
.template-signature .hero {
  padding-top: clamp(7rem, 16vw, 11rem);
  padding-bottom: clamp(5rem, 12vw, 9rem);
  background:
    radial-gradient(ellipse 80% 60% at 70% -10%, color-mix(in srgb, var(--color-primary) 8%, transparent), transparent 60%),
    var(--color-bg);
}

.template-signature .hero__title {
  font-size: clamp(3rem, 8vw, var(--fs-7xl));
  line-height: 0.95;
}

.template-signature .hero__image-wrap {
  border-radius: var(--radius-xl);
}

/* Trust bar — darker contrast line */
.template-signature .trust-bar {
  border-top: 1px solid var(--color-line);
  border-bottom: 1px solid var(--color-line);
}

/* Services — remove card borders, let the grid lines do the work */
.template-signature .services {
  background: var(--color-bg);
}

/* Manifesto — dramatic display */
.template-signature .manifesto {
  padding-block: clamp(6rem, 14vw, 11rem);
  background: var(--color-bg-alt);
}

.template-signature .manifesto__quote {
  font-size: clamp(2rem, 5vw, var(--fs-5xl));
  line-height: 1.15;
  font-style: normal;
}

.template-signature .manifesto__quote::before {
  content: '';
  display: block;
  width: 48px;
  height: 3px;
  background: var(--color-primary);
  margin-inline: auto;
  margin-bottom: var(--s-10);
}

/* Showcase cards — more editorial */
.template-signature .showcase-card__media {
  border-radius: var(--radius-md);
}

.template-signature .showcase-card__title {
  font-size: var(--fs-2xl);
  letter-spacing: var(--tracking-tight);
}

/* Testimonials — dark elegant section */
.template-signature .testimonials {
  background: var(--color-ink);
  color: #fff;
}

.template-signature .testimonials__title,
.template-signature .testimonial__text,
.template-signature .testimonial__name {
  color: #fff;
}

.template-signature .testimonial__text::before,
.template-signature .testimonial__text::after {
  color: var(--color-secondary);
}

.template-signature .testimonial__role {
  color: rgba(255, 255, 255, 0.6);
}

.template-signature .testimonials__prev,
.template-signature .testimonials__next {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.2);
  color: #fff;
}

.template-signature .testimonials__prev:hover,
.template-signature .testimonials__next:hover {
  background: #fff;
  color: var(--color-ink);
  border-color: #fff;
}

.template-signature .testimonials__pagination {
  color: rgba(255, 255, 255, 0.6);
}

/* CTA final — full color statement */
.template-signature .cta-final--dark {
  background:
    radial-gradient(ellipse 60% 40% at 50% 100%, color-mix(in srgb, var(--color-primary) 30%, transparent), transparent 60%),
    var(--color-bg-dark);
}

.template-signature .cta-final__title {
  font-size: clamp(2.5rem, 6vw, var(--fs-5xl));
  line-height: 1.05;
}

/* Contact block — refined */
.template-signature .contact-block__form {
  background: var(--color-bg-alt);
  border: 1px solid var(--color-line);
}

/* Header specifics */
.template-signature .site-header__brand {
  font-style: italic;
}

/* Subtle noise texture overlay (optional, via ::before pseudo on body) */
.template-signature {
  position: relative;
}

/* Typography refinements — italic emphasis on specific display text */
.template-signature .hero__title em,
.template-signature .services__title em,
.template-signature .manifesto__quote em,
.template-signature .cta-final__title em {
  font-style: italic;
  color: var(--color-primary);
}