@import url("for-providers-ds2.css");
@import url("assets/css/sections/ds2-hero-photo.css");

/*
  Contact page — Renewal Design System v2 (design_system2.html + renewal-design-system-v2 SKILL.md)
  Scope: .ds2-page only. renewal-sitemap.css provides base .ct-* / shared .btn.
  Hero: same import stack as For Patients/women.html (for-providers-ds2 + ds2-hero-photo).
*/

:root {
  --renewal-green: #05c832;
  --renewal-teal: #afcdd2;
  --renewal-muted: #6e878c;
  --renewal-hero-bg: #3c403e;
  --layout-max: 1300px;
  --ds2-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ds2-ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  /* Hero: fim do degradê horizontal (leitura do texto à esquerda; imagem visível à direita) */
  --ds2-hero-overlay-fade-end: 78%;
  --renewal-blue: #0073ff;
  --nav-mega-surface: #ffffff;
  --nav-mega-ink: #0f172a;
  --nav-mega-muted: #64748b;
  --nav-mega-rule: #e2e8f0;
  --nav-mega-radius: 10px;
  --ds2-border-color: #e5e7eb;
  --home-gutter: 0px;
}

.ds2-page {
  overflow-x: hidden;
}

/* Contact: zero letter-spacing site-wide (overrides renewal-sitemap + local rules) */
.ds2-page,
.ds2-page * {
  letter-spacing: 0 !important;
}

/* ─── Keyframes (DS2) ─── */
@keyframes ds2-nebula-drift {
  0%,
  100% {
    transform: translate(0, 0) scale(1) rotate(0deg);
    opacity: 0.6;
  }
  25% {
    transform: translate(5%, -4%) scale(1.1) rotate(2deg);
    opacity: 0.75;
  }
  50% {
    transform: translate(-3%, 5%) scale(0.95) rotate(-1deg);
    opacity: 0.55;
  }
  75% {
    transform: translate(4%, 2%) scale(1.05) rotate(1deg);
    opacity: 0.7;
  }
}

@keyframes ds2-fade-up {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes ds2-fade-scale {
  from {
    opacity: 0;
    transform: scale(0.92) translateY(20px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

@keyframes ds2-morph-blob {
  0%,
  100% {
    border-radius: 42% 58% 70% 30% / 45% 45% 55% 55%;
  }
  25% {
    border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
  }
  50% {
    border-radius: 30% 70% 50% 50% / 60% 30% 70% 40%;
  }
  75% {
    border-radius: 50% 50% 40% 60% / 35% 55% 45% 65%;
  }
}

@keyframes ds2-text-glow {
  0%,
  100% {
    text-shadow: 0 0 40px rgb(0 115 255 / 0.2), 0 0 80px rgb(80 160 255 / 0.1);
  }
  50% {
    text-shadow: 0 0 60px rgb(0 115 255 / 0.3), 0 0 100px rgb(80 160 255 / 0.15);
  }
}

@keyframes ds2-count-pulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.08);
  }
}

.ds2-reveal {
  opacity: 0;
  transform: translateY(36px);
  transition: opacity 0.8s var(--ds2-ease), transform 0.8s var(--ds2-ease);
}

.ds2-reveal--visible {
  opacity: 1;
  transform: translateY(0);
}

.ds2-reveal--scale {
  opacity: 0;
  transform: scale(0.9) translateY(24px);
  transition: opacity 0.7s var(--ds2-ease), transform 0.7s var(--ds2-ease);
}

.ds2-reveal--scale.ds2-reveal--visible {
  opacity: 1;
  transform: scale(1) translateY(0);
}

.ds2-stagger > * {
  transition-delay: calc(var(--i, 0) * 0.08s);
}


/* ─── Tipografia global página ─── */
.ds2-page h1,
.ds2-page h2 {
  font-family: var(--font-heading);
  font-weight: 300;
  text-transform: none;
}

.ds2-page h2 {
  line-height: 2.6rem;
}

.ds2-page h3,
.ds2-page h4,
.ds2-page h5,
.ds2-page h6 {
  font-family: var(--font-sans);
  font-weight: 400;
}

.ds2-page strong,
.ds2-page b {
  font-weight: 600;
}

.ds2-page .ct-form-main h2,
.ds2-page .ct-next__head h2 {
  font-family: var(--font-heading);
  font-weight: 300;
  color: var(--renewal-text);
}

.ds2-page .ct-form-main > div > p,
.ds2-page .ct-next__head p,
.ds2-page .ct-card__body > p,
.ds2-page .ct-step__body p {
  color: var(--renewal-text-muted);
}

/* Tipografia footer DS2 (navbar clara: rwl-navbar-ds2-light.css via site-shell) */
.ds2-page .footer,
.ds2-page .footer a {
  font-family: var(--font-sans);
}


/* ─── Form + layout width (centrado no viewport) ─── */
.ds2-page .ct-form-section__inner,
.ds2-page .ct-next__inner {
  max-width: var(--layout-max);
  width: min(100%, var(--layout-max));
  margin-left: auto;
  margin-right: auto;
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
  box-sizing: border-box;
}

.ds2-page .ct-field label {
  color: var(--renewal-blue-mid);
  font-weight: 500;
  transition: color 0.2s var(--ds2-ease);
}

.ds2-page .ct-input,
.ds2-page .ct-textarea {
  border-color: var(--ds2-border-color);
  transition: border-color 0.25s var(--ds2-ease), box-shadow 0.25s var(--ds2-ease);
}

.ds2-page .ct-input:focus,
.ds2-page .ct-textarea:focus {
  outline: 2px solid color-mix(in srgb, var(--renewal-blue) 40%, transparent);
  outline-offset: 0;
  border-color: var(--renewal-blue-soft);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--renewal-blue-soft) 18%, transparent);
}

.ds2-page .btn--ct-primary {
  background: var(--renewal-blue);
  transition: background 0.28s var(--ds2-ease), transform 0.28s var(--ds2-ease-bounce), box-shadow 0.28s var(--ds2-ease);
}

.ds2-page .btn--ct-primary:hover {
  background: #0060d6;
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgb(0 115 255 / 0.2);
}

.ds2-page .btn--ct-secondary {
  transition: background 0.28s var(--ds2-ease), transform 0.28s var(--ds2-ease), border-color 0.28s var(--ds2-ease);
}

.ds2-page .btn--ct-secondary:hover {
  transform: translateY(-2px);
}

.ds2-page .btn--ct-submit {
  background: var(--renewal-blue);
  transition: background 0.28s var(--ds2-ease), transform 0.28s var(--ds2-ease-bounce), box-shadow 0.28s var(--ds2-ease);
}

.ds2-page .btn--ct-submit:hover {
  background: #0060d6;
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgb(0 115 255 / 0.18);
}

.ds2-page .ct-consent {
  background: color-mix(in srgb, var(--renewal-blue) 5%, #f8fafc);
  border: 1px solid color-mix(in srgb, var(--renewal-blue-soft) 15%, transparent);
  transition: border-color 0.25s var(--ds2-ease);
}

.ds2-page .ct-consent a {
  color: var(--renewal-blue-mid);
  font-weight: 500;
  transition: color 0.2s var(--ds2-ease);
}

.ds2-page .ct-consent a:hover {
  color: var(--renewal-blue);
}

/* ─── Sidebar cards ─── */
.ds2-page .ct-card {
  border-color: color-mix(in srgb, var(--renewal-blue-soft) 22%, #e5e7eb);
  transition: box-shadow 0.35s var(--ds2-ease), transform 0.35s var(--ds2-ease), border-color 0.3s var(--ds2-ease);
}

.ds2-page .ct-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px -12px rgb(0 115 255 / 0.1);
}

.ds2-page .ct-card__head svg {
  color: var(--renewal-green);
}

.ds2-page .ct-card__head h3 {
  font-weight: 400;
  color: var(--renewal-text);
}

.ds2-page .ct-card__body a {
  color: var(--renewal-blue-mid);
  transition: color 0.2s var(--ds2-ease);
}

.ds2-page .ct-card__body a:hover {
  color: var(--renewal-blue);
}

/* ─── Next steps ─── */
.ds2-page .ct-next {
  background: linear-gradient(180deg, color-mix(in srgb, var(--renewal-blue) 4%, #f8fafc) 0%, #f1f5f9 100%);
}

.ds2-page .ct-step {
  border-color: color-mix(in srgb, var(--renewal-blue-soft) 20%, #e5e7eb);
  transition: box-shadow 0.35s var(--ds2-ease), transform 0.35s var(--ds2-ease), border-color 0.3s var(--ds2-ease);
}

.ds2-page .ct-step:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 36px -10px rgb(0 115 255 / 0.08);
}

.ds2-page .ct-step__num {
  color: var(--renewal-blue);
  font-weight: 600;
}

.ds2-page .ct-step__head h3 {
  font-weight: 400;
  color: var(--renewal-text);
}

/* ─── Reduced motion (hero: for-providers-ds2; conteúdo de contact abaixo) ─── */
@media (prefers-reduced-motion: reduce) {
  .ds2-reveal,
  .ds2-reveal--scale {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .ds2-page .btn--primary:hover,
  .ds2-page .btn--outline:hover,
  .ds2-page .btn--ct-primary:hover,
  .ds2-page .btn--ct-secondary:hover,
  .ds2-page .btn--ct-submit:hover,
  .ds2-page .ct-card:hover,
  .ds2-page .ct-step:hover {
    transform: none;
  }

  .ds2-page .btn--primary,
  .ds2-page .btn--outline,
  .ds2-page .btn--ct-primary,
  .ds2-page .btn--ct-secondary,
  .ds2-page .btn--ct-submit,
  .ds2-page .ct-input,
  .ds2-page .ct-textarea,
  .ds2-page .ct-card,
  .ds2-page .ct-step {
    transition: none !important;
  }
}

@media (max-width: 767px) {
  .ds2-page .ct-form-section__inner,
  .ds2-page .ct-next__inner {
    padding-left: max(env(safe-area-inset-left, 0px), 18px);
    padding-right: max(env(safe-area-inset-right, 0px), 18px);
  }

  .ds2-page .ct-form-section,
  .ds2-page .ct-next {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .ds2-page .ct-card,
  .ds2-page .ct-step {
    border-radius: 1rem;
  }
}