/* UpKate B2B — brand-preserving institutional revision (21/10/2026). */

/* The new long positioning statement must remain legible in the layered hero. */
.upkate-front .uk-hero h1 {
  max-width: 17ch;
  font-size: clamp(2.15rem, 3vw, 3.55rem);
  line-height: 1.12;
}
.upkate-front .uk-hero__content { max-width: 650px; }
.upkate-front .uk-hero .uk-lead {
  max-width: 53ch;
  font-size: clamp(1rem, 1.35vw, 1.13rem);
  line-height: 1.62;
}

/* Challenges */
.uk-b2b-split {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  align-items: center;
  gap: clamp(2rem, 7vw, 8rem);
}
.uk-b2b-split h2 { max-width: 19ch; }
.uk-b2b-split__copy {
  max-width: 55ch;
  font-size: clamp(1.03rem, 1.4vw, 1.16rem);
  line-height: 1.85;
}
.uk-b2b-split__copy .uk-button { margin-top: .6rem; }

/* Five business pillars — three balanced columns followed by two wide. */
.uk-b2b-solutions .uk-section__heading { max-width: 830px; margin-bottom: clamp(2.5rem, 4vw, 4rem); }
.uk-b2b-service-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(.9rem, 1.8vw, 1.4rem);
}
.uk-b2b-service {
  grid-column: span 2;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: clamp(1.5rem, 2.7vw, 2.5rem);
  border-radius: 5px;
  border: 1px solid rgba(75, 48, 104, .15);
  background: var(--uk-white);
  box-shadow: 0 3px 20px rgba(75, 48, 104, .045);
  transition: border-color .2s ease, transform .2s ease;
}
.uk-b2b-service:nth-child(4),
.uk-b2b-service:nth-child(5) { grid-column: span 3; }
.uk-b2b-service:hover,
.uk-b2b-service:focus-within {
  transform: translateY(-3px);
  border-color: var(--uk-magenta);
}
.uk-b2b-service__num {
  color: var(--uk-magenta-rich);
  font-size: .82rem;
  font-weight: 750;
  letter-spacing: .12em;
  margin-bottom: 1.7rem;
}
.uk-b2b-service h3 {
  max-width: 24ch;
  font-size: clamp(1.3rem, 2vw, 1.7rem);
  color: var(--uk-purple);
  margin-bottom: 1rem;
}
.uk-b2b-service p { line-height: 1.72; color: var(--uk-ink); opacity: .9; }
.uk-b2b-service .uk-b2b-service__cta {
  margin-top: auto;
  align-self: flex-start;
}
.uk-b2b-service .uk-b2b-service__cta:hover {
  text-decoration: none;
}
.uk-b2b-section-action { display: flex; justify-content: center; margin-top: clamp(2rem, 3vw, 3rem); }

/* Reuse the original connected timeline (uk-steps / uk-step) from
   home-components.css: horizontal connector and vertical mobile fallback. */
.uk-b2b-method { background: var(--uk-purple); color: #fff; }
.uk-b2b-method .uk-eyebrow { color: var(--uk-lavender); }
.uk-b2b-method h2, .uk-b2b-method h3 { color: #fff; }
.uk-b2b-method .uk-section__heading > p:last-child { color: rgba(255,255,255,.83); }
.uk-b2b-method .uk-b2b-method__steps { margin-top: clamp(2rem, 5vw, 4rem); }
.uk-b2b-method .uk-step h3 {
  color: #fff;
  font-size: 1.28rem;
  font-weight: 600;
  line-height: 1.3;
  margin: 0 0 .75rem;
}
.uk-b2b-method .uk-step p { line-height: 1.75; color: rgba(255,255,255,.9); }
.uk-b2b-method .uk-b2b-section-action { justify-content: flex-start; }

/* Reuse the old two-tone solution component, including its 5px outer radius,
   equal split, magenta/purple panels and white outline CTAs. */
.uk-b2b-secondary { background: var(--uk-mist); }
.uk-b2b-secondary .uk-solution h2 {
  max-width: 18ch;
  color: #fff;
  font-size: clamp(1.65rem, 2.3vw, 2.25rem);
  font-weight: 600;
  margin-bottom: 1.15rem;
}
.uk-b2b-secondary .uk-solution .uk-button { margin-top: auto; }

/* Header CTA anchors land comfortably below the sticky navigation.
   Keep this scoped to the new conversion destinations only. */
#diagnostico,
#formulario-contato {
  scroll-margin-top: 6.5rem;
}

/* Institutional editorial pages. */
.uk-institutional__hero .uk-eyebrow { margin-top: 1rem; margin-bottom: .8rem; }
.uk-institutional__lead { max-width: 65ch; font-size: clamp(1.15rem, 2vw, 1.45rem); line-height: 1.58; margin-top: 1.5rem; }
.uk-institutional__prose { width: 100%; max-width: none; }
.uk-institutional__prose h2 { color: var(--uk-purple); }
.uk-institutional__prose h3 { color: var(--uk-magenta-rich); }
.uk-institutional__cta { color: #fff; background: var(--uk-purple); padding-block: clamp(3rem, 6vw, 5.5rem); }
.uk-institutional__cta-inner { display: flex; gap: clamp(2rem,4vw,5rem); align-items: center; justify-content: space-between; }
.uk-institutional__cta .uk-eyebrow { color: var(--uk-lavender); }
.uk-institutional__cta h2 { color: #fff; max-width: 22ch; font-size: clamp(1.7rem, 3vw, 2.8rem); }
.uk-institutional__cta p { max-width: 48ch; color: rgba(255,255,255,.85); }
.uk-institutional__cta .uk-button { flex-shrink: 0; }
.uk-via-page .uk-forcas { padding-top: clamp(2.5rem, 4vw, 4rem); }
.uk-via-page .uk-forcas__intro { margin-top: 1.2rem; }

/* Contact has no sidebar: let the form occupy the entire institutional
   main container. Keep the inner two-field grid for usability on desktop. */
.uk-institutional--contact .uk-institutional__body {
  display: block;
}
.uk-institutional--contact .uk-institutional__body > .uk-prose {
  display: block;
  width: 100%;
  max-width: none;
}
.uk-institutional--contact .uk-lead-form,
.uk-institutional--contact .uk-lead-form__fields {
  width: 100%;
  max-width: none;
}

/* Form: no external JS, accessible HTML5 validation and actionable feedback. */
.uk-lead-form { margin-top: 2.25rem; max-width: 900px; }
.uk-lead-form__fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 1.2rem; row-gap: 1.2rem; }
.uk-lead-form__fields > label {
  display: flex;
  flex-direction: column;
  gap: .4rem;
  color: var(--uk-ink);
  font-size: .96rem;
  font-weight: 650;
  line-height: 1.55;
}
.uk-lead-form__fields input:not([type="checkbox"]),
.uk-lead-form__fields select,
.uk-lead-form__fields textarea {
  width: 100%;
  border: 1px solid rgba(75,48,104,.28);
  border-radius: 5px;
  background: #fff;
  color: var(--uk-ink);
  padding: .85rem .95rem;
  font: inherit;
  font-weight: 400;
}
.uk-lead-form__fields textarea { resize: vertical; min-height: 160px; }
.uk-lead-form__fields input:focus,
.uk-lead-form__fields select:focus,
.uk-lead-form__fields textarea:focus { outline: 3px solid rgba(185,71,106,.35); outline-offset: 2px; }
.uk-lead-form__wide, .uk-lead-form__consent, .uk-lead-form__actions { grid-column: 1/-1; }
.uk-lead-form__fields > .uk-lead-form__consent { flex-direction: row; gap: .75rem; font-weight: 400; }
.uk-lead-form__consent input { flex-shrink: 0; width: 1.2rem; height: 1.2rem; margin-top: .25rem; accent-color: var(--uk-magenta); }
.uk-lead-form__actions { display: flex; align-items: center; gap: 1.4rem; flex-wrap: wrap; margin-top: .8rem; }
.uk-lead-form__actions p { margin: 0; font-size: .93rem; }
.uk-lead-form__feedback {
  background: var(--uk-mist);
  color: var(--uk-purple);
  border-left: 4px solid var(--uk-purple);
  padding: 1rem 1.3rem;
}
.uk-lead-form__feedback--error { border-left-color: var(--uk-magenta); }
.uk-lead-form__trap { position: absolute !important; width: 1px; height: 1px; opacity: 0; overflow: hidden; pointer-events: none; }

/* Primary navigation: contextual submenu + room for B2B labels. */
.site-header .uk-brand { max-width: 174px; }
.uk-nav > ul { flex-wrap: nowrap; gap: .25rem clamp(.65rem, 1.1vw, 1.1rem); }
.uk-nav li { position: relative; }
.uk-nav a { font-size: clamp(.85rem, 1vw, 1rem); }
/* Preserve the original white-outline Contato CTA styling, including hover:
   no magenta or purple background transition. */
.uk-nav .uk-nav__contact,
.uk-nav .uk-nav__contact:hover,
.uk-nav .uk-nav__contact:focus-visible {
  background: transparent;
  color: var(--uk-white);
  border-color: rgba(255,255,255,.9);
}
.uk-nav .sub-menu {
  position: absolute;
  z-index: 10;
  inset-block-start: 100%;
  inset-inline-start: -.85rem;
  width: min(320px, 80vw);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  margin: 0;
  padding: .5rem;
  background: var(--uk-purple);
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 5px;
  box-shadow: 0 16px 32px rgba(25,13,38,.18);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-5px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.uk-nav li:hover > .sub-menu,
.uk-nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.uk-nav .sub-menu a { display: block; padding: .6rem .75rem; line-height: 1.4; }
.uk-nav .sub-menu a:hover { background: rgba(255,255,255,.1); }
.uk-nav .sub-menu a::after { display: none; }

@media (max-width: 1100px) {
  /* Match the JS 1100px navigation breakpoint without stacking the hero early. */
  .uk-header-inner { position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: .75rem; padding-block: .75rem; }
  .site-header .uk-brand { max-width: 170px; }
  .uk-mobile-nav-ready .uk-menu-toggle { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 5px; width: 46px; height: 46px; padding: 10px; border: 1px solid rgba(255,255,255,.5); border-radius: 5px; background: transparent; color: #fff; cursor: pointer; }
  .uk-menu-toggle__line { display: block; width: 24px; height: 2px; flex-shrink: 0; background: currentColor; border-radius: 1px; }
  .uk-mobile-nav-ready .site-header .uk-nav {
    position: absolute; top: 100%; inset-inline: 0; z-index: 10; width: 100%;
    max-height: calc(100dvh - 90px); overflow-y: auto;
    padding: 1rem; background: var(--uk-purple);
    border-top: 1px solid rgba(255,255,255,.15);
    box-shadow: 0 12px 22px rgba(28,18,38,.18);
    opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-8px);
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
  }
  .uk-mobile-nav-ready .site-header[data-menu-open="true"] .uk-nav { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); }
  .uk-mobile-nav-ready .site-header .uk-nav > ul { display: flex; flex-direction: column; align-items: stretch; flex-wrap: nowrap; gap: .2rem; margin: 0; }
  .uk-mobile-nav-ready .site-header .uk-nav a { display: block; width: fit-content; max-width: 100%; padding: .65rem .3rem; font-size: 1rem; }
  .uk-mobile-nav-ready .site-header .uk-nav .uk-nav__contact { padding: .65rem 1rem; margin-top: .5rem; }
  .uk-mobile-nav-ready .site-header .uk-nav .sub-menu { position: static; display: block; width: 100%; transform: none; opacity: 1; visibility: visible; box-shadow: none; border: none; padding: 0 0 0 1rem; background: transparent; }
  .uk-mobile-nav-ready .site-header .uk-nav .sub-menu a { font-size: .92rem; padding: .45rem .75rem; }
  .site-header { overflow: visible; }
}
@media (max-width: 880px) {
  .uk-b2b-service { grid-column: span 3; }
  .uk-b2b-service:last-child { grid-column: span 6; }
  .uk-b2b-split { gap: 2.5rem; }
}
@media (max-width: 760px) {
  .upkate-front .uk-hero h1 { font-size: clamp(2.35rem, 7vw, 3.15rem); max-width: 18ch; }
  .uk-b2b-split { grid-template-columns: 1fr; }
  .uk-institutional__cta-inner { flex-direction: column; align-items: flex-start; }
  .uk-lead-form__fields { grid-template-columns: 1fr; }
  .uk-lead-form__fields > * { grid-column: 1; }
}
@media (max-width: 560px) {
  .uk-b2b-service-grid { grid-template-columns: 1fr; }
  .uk-b2b-service, .uk-b2b-service:nth-child(4), .uk-b2b-service:nth-child(5) { grid-column: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .uk-b2b-service, .uk-nav .sub-menu { transition: none; }
  .uk-b2b-service:hover { transform: none; }
}


/* ────────────────────────────────────────────────────────────────
   Institutional pages: full-width editorial main, one content column.
   This deliberately does not touch two-column SEO pages.
   ──────────────────────────────────────────────────────────────── */
.uk-institutional__body { min-width: 0; }
.uk-institutional__body > .uk-prose,
.uk-institutional__prose { width: 100%; max-width: 100%; }
.uk-institutional__body .uk-prose > :first-child { margin-top: 0; }

/* Soluções para Empresas: all service copy remains editable in Gutenberg.
   The visual grid has exactly two cards per row on desktop. */
.uk-inst-solutions { width: 100%; min-width: 0; }
.uk-inst-solutions__intro {
  max-width: 83ch;
  font-size: clamp(1.05rem, 1.4vw, 1.18rem);
  line-height: 1.8;
  margin-bottom: clamp(2.25rem, 4.4vw, 4.25rem);
}
.uk-inst-services__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: clamp(1rem, 2vw, 1.6rem);
}
.uk-inst-service {
  display: grid;
  grid-template-columns: 66px minmax(0, 1fr);
  align-content: start;
  gap: clamp(.9rem, 1.9vw, 1.4rem);
  padding: clamp(1.65rem, 2.7vw, 2.8rem);
  min-width: 0;
  background: var(--uk-white);
  border: 1px solid var(--uk-border);
  border-radius: var(--uk-radius);
}
.uk-inst-service__icon {
  display: inline-flex;
  justify-content: center;
  align-items: flex-start;
  width: 66px;
  min-height: 66px;
  flex-shrink: 0;
  color: var(--uk-magenta-rich);
}
.uk-inst-service__icon svg {
  width: 58px;
  height: 58px;
  stroke-width: 1.4;
}
.uk-inst-service__copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.uk-inst-service__copy h2 {
  color: var(--uk-purple);
  font-size: clamp(1.25rem, 1.7vw, 1.6rem);
  font-weight: 600;
  line-height: 1.32;
  letter-spacing: -.02em;
  margin: 0 0 1rem;
}
.uk-inst-service__description {
  color: var(--uk-ink);
  line-height: 1.78;
  font-size: .99rem;
}
.uk-inst-service__description > :first-child { margin-top: 0; }
.uk-inst-service__description > :last-child { margin-bottom: 0; }
.uk-inst-service__description p { margin: 0 0 1rem; }
.uk-inst-service__link {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  width: fit-content;
  margin-top: 1.25rem;
  color: var(--uk-magenta-rich);
  text-decoration-thickness: 1px;
  text-underline-offset: .3em;
  font-weight: 650;
  font-size: .95rem;
}
.uk-inst-service__link:hover { text-decoration-thickness: 2px; }

/* Reuses the existing uk-accordion component (home-components.css).
   All questions are collapsible and keyboard accessible without JavaScript. */
.uk-inst-faq {
  margin-top: clamp(4rem, 7vw, 7rem);
  padding-top: clamp(3rem, 5vw, 4.5rem);
  border-top: 1px solid var(--uk-border);
}
.uk-inst-faq__heading { margin-bottom: 1.35rem; }
.uk-inst-faq__heading .uk-eyebrow { margin-bottom: .7rem; }
.uk-inst-faq__heading h2 {
  color: var(--uk-purple);
  font-size: clamp(1.85rem, 3.5vw, 2.9rem);
  font-weight: 600;
  margin: 0;
}
.uk-inst-faq__list { max-width: none; }
.uk-inst-faq__list .uk-accordion__item { border-bottom-color: var(--uk-border); }
.uk-inst-faq__list .uk-accordion__item > summary { padding-block: 1.35rem; }
.uk-inst-faq__list .uk-accordion__label { color: var(--uk-ink); }
.uk-inst-faq__list .uk-accordion__content { max-width: 90ch; }
.uk-inst-faq__list .uk-accordion__content > :last-child { margin-bottom: 0; }
.uk-inst-solutions__tail { margin-top: 3rem; }

/* Lighter institutional symbol: transparent, fine purple outlines and quiet
   magenta accents. The copy remains the focal point of the split composition. */
.uk-inst-rh__intro {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  align-items: center;
  gap: clamp(2rem, 5vw, 5rem);
  margin-bottom: clamp(4rem, 6vw, 6rem);
}
.uk-inst-visual {
  display: block;
  width: 100%;
  max-width: 440px;
  margin-inline: auto;
  border: 0;
  border-radius: 0;
  overflow: visible;
  background: transparent;
}
.uk-inst-visual svg {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 520 / 420;
}
/* RH Estratégico: human, light editorial photo instead of the icon SVG.
   Scope it to this institutional section; the reusable SVG remains available
   for future page variants without influencing this photo. */
.uk-inst-rh__photo {
  width: 100%;
  max-width: 520px;
  margin-inline: auto;
  border-radius: var(--uk-radius);
  overflow: hidden;
  background: var(--uk-white);
}
.uk-inst-rh__photo img {
  display: block;
  width: 100%;
  aspect-ratio: 5 / 4;
  height: auto;
  object-fit: cover;
  object-position: center;
}
/* About: same portrait shown in the homepage uk-about__media block.
   Preserve the homepage's 3:4 portrait framing without its magenta backdrop. */
.uk-inst-rh__photo--portrait {
  max-width: 390px;
}
.uk-inst-rh__photo--portrait img {
  aspect-ratio: 3 / 4;
  object-position: center top;
}
/* Service / About intro only: an editorial lead that sits between body copy
   and headings. No change to details, list copy, forms or the rest of the site. */
.uk-inst-rh__copy {
  max-width: 58ch;
  font-size: clamp(1.105rem, 1.4vw, 1.23rem);
  font-weight: 500;
  line-height: 1.74;
  letter-spacing: -0.006em;
}
.uk-inst-rh__copy p { margin-bottom: 1.4rem; }
.uk-inst-rh__copy p:last-child { margin-bottom: 0; }
.uk-inst-rh__details {
  padding-top: clamp(2.3rem, 4vw, 4rem);
  border-top: 1px solid var(--uk-border);
}
.uk-inst-rh__details h2 {
  font-size: clamp(1.8rem, 3vw, 2.65rem);
  margin-top: clamp(2.5rem, 4vw, 3.5rem);
  margin-bottom: 1.4rem;
}
.uk-inst-rh__details > h2:first-child { margin-top: 0; }
.uk-inst-rh__details ul { max-width: 100%; }

@media (max-width: 980px) {
  .uk-inst-rh__intro { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 1.75rem; }
  .uk-inst-service { grid-template-columns: 54px minmax(0, 1fr); padding: 1.5rem; }
  .uk-inst-service__icon { width: 54px; min-height: 54px; }
  .uk-inst-service__icon svg { width: 52px; height: 52px; }
}
@media (max-width: 760px) {
  .uk-inst-services__grid { grid-template-columns: 1fr; }
  .uk-inst-rh__intro { grid-template-columns: 1fr; gap: 2rem; }
  .uk-inst-rh__copy { order: -1; }
  .uk-inst-visual { width: 100%; max-width: 320px; margin-inline: auto; }
  .uk-inst-faq__list .uk-accordion__item > summary { min-height: 70px; }
}
@media (max-width: 480px) {
  .uk-inst-service { grid-template-columns: 46px minmax(0, 1fr); gap: .9rem; padding: 1.35rem 1.15rem; }
  .uk-inst-service__icon { width: 46px; min-height: 46px; }
  .uk-inst-service__icon svg { width: 44px; height: 44px; }
  .uk-inst-service__copy h2 { font-size: 1.22rem; }
  .uk-inst-faq__list .uk-accordion__content { padding-inline: 1.8rem .45rem; }
}

@media (max-width: 760px) {
  .uk-inst-rh__copy {
    font-size: clamp(1.065rem, 2.6vw, 1.145rem);
    line-height: 1.75;
  }
}
