/*
Theme Name: Brilantec
Theme URI: https://brilantec.com/
Description: Tema de bloques corporativo para Brilantec.
Author: Brilantec
Author URI: https://brilantec.com/
Version: 1.2.0
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: brilantec
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

:root {
  --br-ink: #0b1220;
  --br-ink-soft: #14213a;
  --br-blue: #3766f5;
  --br-blue-dark: #2450dc;
  --br-cyan: #33d1c6;
  --br-paper: #f7f8fa;
  --br-white: #ffffff;
  --br-slate: #667085;
  --br-border: #e5e9f2;
  --br-lime: #b9f227;
  --br-shadow: 0 24px 70px rgba(15, 31, 66, .10);
  --br-radius: 22px;
}

html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * { margin-block-start: 0; }
.wp-site-blocks > .alignfull { width: 100% !important; max-width: none !important; margin-inline: 0 !important; }
.is-layout-constrained > .alignwide.br-shell { max-width: 1320px !important; }
a { transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease; }
.br-site-main { overflow: hidden; }

.br-shell {
  width: min(1320px, calc(100% - clamp(40px, 6vw, 96px))) !important;
  max-width: 1320px !important;
  margin-inline: auto;
}

.br-header {
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid rgba(229, 233, 242, .85);
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(16px);
}
.br-header__inner { min-height: 78px; }
.br-wordmark { margin: 0; font-size: 1.4rem; font-weight: 800; letter-spacing: -.04em; line-height: 1; }
.br-wordmark a { text-decoration: none; color: var(--br-ink); }
.br-wordmark a::before {
  content: "";
  display: inline-block;
  width: 36px;
  height: 36px;
  margin-right: 10px;
  background: url("assets/images/logo-mark.svg") center / contain no-repeat;
  vertical-align: -11px;
}
.br-nav { font-size: .93rem; font-weight: 600; }
.br-nav a:hover { color: var(--br-blue) !important; }

.wp-block-button .wp-block-button__link {
  box-shadow: none;
  font-weight: 700;
  letter-spacing: -.01em;
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.wp-block-button .wp-block-button__link:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(55, 102, 245, .22);
}
.br-button-outline .wp-block-button__link {
  color: var(--br-blue) !important;
  background: transparent !important;
  border: 1px solid var(--br-blue);
}

.br-hero {
  position: relative;
  padding: clamp(72px, 8vw, 116px) 0 clamp(68px, 7vw, 104px);
  background:
    radial-gradient(circle at 86% 18%, rgba(51, 209, 198, .12), transparent 24%),
    radial-gradient(circle at 12% 2%, rgba(55, 102, 245, .09), transparent 20%),
    var(--br-white);
}
.br-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .28;
  background-image: radial-gradient(#9fb0d4 1px, transparent 1px);
  background-size: 24px 24px;
  mask-image: linear-gradient(90deg, transparent 15%, #000 65%, transparent 100%);
}
.br-hero__content { position: relative; z-index: 2; }
.br-eyebrow {
  margin-bottom: 18px;
  color: var(--br-blue);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.br-hero h1 {
  max-width: 680px;
  margin: 0;
  font-size: clamp(2.7rem, 5.1vw, 5rem);
  line-height: .99;
  letter-spacing: -.064em;
}
.br-hero__lead {
  max-width: 610px;
  margin-top: 26px;
  color: #4f5d75;
  font-size: clamp(1.05rem, 1.5vw, 1.22rem);
  line-height: 1.62;
}
.br-hero .wp-block-buttons { margin-top: 32px; }

.br-visual {
  position: relative;
  min-height: 520px;
  background: url("assets/images/hero-platform-v1.webp") center / contain no-repeat;
}
.br-visual::before {
  display: none;
}
.br-ui-card {
  position: absolute;
  overflow: hidden;
  border: 1px solid rgba(192, 202, 222, .72);
  border-radius: 18px;
  background: rgba(255, 255, 255, .96);
  box-shadow: var(--br-shadow);
}
.br-ui-card__top {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 0 14px;
  border-bottom: 1px solid var(--br-border);
  color: var(--br-slate);
  font-size: 11px;
  font-weight: 700;
}
.br-dot { width: 7px; height: 7px; border-radius: 50%; background: #d4dbea; }
.br-ui-dashboard { top: 32px; left: 8px; width: 72%; height: 250px; transform: rotate(2deg); }
.br-ui-workflow { top: 118px; right: -10px; width: 45%; height: 246px; }
.br-ui-monitor { bottom: 6px; left: 19%; width: 65%; height: 175px; background: var(--br-ink); color: #fff; }
.br-chart { display: flex; align-items: flex-end; gap: 8px; height: 92px; padding: 18px 20px 0; }
.br-chart span { flex: 1; border-radius: 5px 5px 2px 2px; background: linear-gradient(#43d7cc, #3766f5); }
.br-chart span:nth-child(1) { height: 36%; }.br-chart span:nth-child(2) { height: 58%; }.br-chart span:nth-child(3) { height: 44%; }.br-chart span:nth-child(4) { height: 76%; }.br-chart span:nth-child(5) { height: 65%; }.br-chart span:nth-child(6) { height: 94%; }
.br-ui-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 15px 20px; }
.br-ui-stat { min-height: 58px; padding: 10px; border-radius: 10px; background: #f3f6fb; }
.br-ui-stat b { display: block; color: var(--br-ink); font-size: 14px; }
.br-ui-stat small { color: var(--br-slate); font-size: 9px; }
.br-flow { padding: 15px; }
.br-flow__item { position: relative; margin-bottom: 11px; padding: 10px 10px 10px 34px; border: 1px solid var(--br-border); border-radius: 9px; font-size: 10px; font-weight: 700; }
.br-flow__item::before { content: ""; position: absolute; left: 11px; top: 12px; width: 11px; height: 11px; border-radius: 4px; background: var(--br-cyan); }
.br-flow__item:nth-child(2)::before { background: var(--br-blue); transform: rotate(45deg); }
.br-monitor__title { display: flex; justify-content: space-between; padding: 16px 18px 0; font-size: 11px; font-weight: 700; }
.br-online { color: var(--br-lime); }
.br-monitor__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; padding: 14px 18px; }
.br-monitor__metric { padding: 12px; border: 1px solid #263653; border-radius: 10px; background: #101c32; }
.br-monitor__metric small { display: block; color: #8fa0be; font-size: 8px; }
.br-monitor__metric b { font-size: 14px; }

.br-section { padding: clamp(64px, 6.5vw, 92px) 0; }
.br-section--soft { background: var(--br-paper); }
.br-section__head { max-width: 720px; margin-bottom: 40px; }
.br-section__head h2, .br-product h2, .br-about h2, .br-cta h2 {
  margin: 0;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.05;
  letter-spacing: -.052em;
}
.br-section__intro { margin-top: 16px; color: var(--br-slate); font-size: 1.08rem; line-height: 1.65; }

.br-service-grid { gap: 18px; }
.br-service-card {
  min-height: 225px;
  padding: 28px !important;
  border: 1px solid var(--br-border);
  border-radius: var(--br-radius);
  background: #fff;
  box-shadow: 0 12px 34px rgba(15, 31, 66, .05);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.br-service-card:hover { transform: translateY(-6px); border-color: #bdcafa; box-shadow: 0 22px 50px rgba(15, 31, 66, .10); }
.br-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin-bottom: 28px;
  border-radius: 14px;
  color: var(--br-blue);
  background: #edf1ff;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 32px 32px;
  font-size: 0;
  font-weight: 800;
}
.br-icon--cyan { color: #0a9e95; background: #e4fbf8; }
.br-service-grid > .wp-block-column:nth-child(1) .br-icon { background-image: url("assets/images/service-apps.svg"); }
.br-service-grid > .wp-block-column:nth-child(2) .br-icon { background-image: url("assets/images/service-automation.svg"); }
.br-service-grid > .wp-block-column:nth-child(3) .br-icon { background-image: url("assets/images/service-data.svg"); }
.br-service-grid > .wp-block-column:nth-child(4) .br-icon { background-image: url("assets/images/service-industry.svg"); }
.br-service-card h3 { margin: 0 0 10px; font-size: 1.13rem; letter-spacing: -.025em; }
.br-service-card p { margin: 0; color: var(--br-slate); font-size: .92rem; line-height: 1.55; }

.br-product { position: relative; overflow: hidden; padding: clamp(44px, 6vw, 76px) !important; border-radius: 30px; color: #fff; background: var(--br-ink); }
.br-product::before { content: ""; position: absolute; width: 440px; height: 440px; right: -120px; top: -210px; border-radius: 50%; background: rgba(51, 209, 198, .13); }
.br-product::after { content: ""; position: absolute; width: 340px; height: 340px; left: 38%; bottom: -260px; border-radius: 50%; background: rgba(185, 242, 39, .12); }
.br-product > * { position: relative; z-index: 2; }
.br-product .br-eyebrow { color: var(--br-cyan); }
.br-product p { color: #bcc8dc; line-height: 1.62; }
.br-chip { display: inline-block; padding: 7px 12px; border-radius: 999px; color: #101b3f; background: var(--br-lime); font-size: .74rem; font-weight: 800; }
.br-match-app {
  position: relative;
  min-height: 520px;
  background: url("assets/images/matchvity-product-v1.webp") center / contain no-repeat;
}
.br-phone {
  position: absolute;
  left: 12%;
  top: 0;
  width: 270px;
  min-height: 438px;
  padding: 16px;
  border: 5px solid #dbe2f0;
  border-radius: 35px;
  background: #101b3f;
  box-shadow: 0 30px 70px rgba(0, 0, 0, .35);
  transform: rotate(-3deg);
}
.br-phone__notch { width: 82px; height: 20px; margin: -8px auto 16px; border-radius: 0 0 12px 12px; background: #071027; }
.br-match-logo { color: #fff; font-size: 14px; font-weight: 800; }.br-match-logo span { color: var(--br-lime); }
.br-match-card { margin-top: 18px; padding: 16px; border: 1px solid #2c3b61; border-radius: 14px; background: #111f44; }
.br-match-card small { color: #93a3c7; font-size: 9px; }.br-match-card b { display: block; margin-top: 5px; color: #fff; font-size: 12px; }
.br-match-versus { display: flex; justify-content: space-between; align-items: center; margin: 18px 0; color: #fff; font-size: 11px; font-weight: 700; }
.br-team-badge { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; color: #101b3f; background: var(--br-lime); }
.br-team-badge:last-child { background: var(--br-cyan); }
.br-app-row { display: flex; justify-content: space-between; margin-top: 8px; padding: 10px; border-radius: 9px; color: #c9d3e7; background: #15264d; font-size: 9px; }
.br-app-kpi { position: absolute; right: 0; width: 150px; padding: 16px; border: 1px solid #26395f; border-radius: 15px; background: #122348; box-shadow: 0 20px 45px rgba(0,0,0,.26); }
.br-app-kpi--one { top: 80px; }.br-app-kpi--two { top: 175px; }.br-app-kpi--three { top: 270px; }
.br-app-kpi small { display: block; color: #8ea0c7; font-size: 9px; }.br-app-kpi b { display: block; margin-top: 5px; color: #fff; font-size: 22px; }

.br-process { counter-reset: process; }
.br-step { position: relative; padding: 26px 18px !important; border-top: 1px solid #ced6e6; }
.br-step::before { counter-increment: process; content: "0" counter(process); display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 22px; border-radius: 50%; color: #fff; background: var(--br-blue); font-size: .76rem; font-weight: 800; box-shadow: 0 8px 18px rgba(55,102,245,.22); }
.br-step:nth-child(even)::before { color: var(--br-ink); background: var(--br-cyan); box-shadow: 0 8px 18px rgba(51,209,198,.20); }
.br-step h3 { margin: 0 0 8px; font-size: 1.12rem; }.br-step p { margin: 0; color: var(--br-slate); font-size: .9rem; line-height: 1.55; }

.br-about__panel { padding: 34px !important; border: 1px solid var(--br-border); border-radius: var(--br-radius); background: #fff; }
.br-about__panel h3 { margin-top: 0; font-size: 1.02rem; }.br-about__panel p { color: var(--br-slate); font-size: .92rem; }
.br-about__number { color: var(--br-blue); font-size: 2.1rem; font-weight: 800; letter-spacing: -.05em; }
.br-about-visual { min-height: 330px; background: url("assets/images/about-build.svg") center / contain no-repeat; }
.br-feature-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.br-feature { min-height: 132px; padding: 20px; border: 1px solid var(--br-border); border-radius: 16px; background: #fff; }
.br-feature b { display: block; margin-bottom: 8px; color: var(--br-ink); font-size: .92rem; line-height: 1.25; }
.br-feature span { color: var(--br-slate); font-size: .78rem; line-height: 1.45; }
.br-feature__icon { display: block; margin-bottom: 12px; color: var(--br-blue); font-size: 1.25rem; font-weight: 800; }

.br-cta { padding: clamp(28px, 4vw, 44px) !important; border: 1px solid #dbe4f6; border-radius: 18px; color: var(--br-ink); background: #eef3ff; }
.br-cta h2 { max-width: 760px; font-size: clamp(1.45rem, 2.5vw, 2.2rem); }.br-cta .wp-block-button__link { color: #fff !important; background: var(--br-blue) !important; }

.br-footer { padding: 34px 0; color: #c7d0df; background: var(--br-ink); font-size: .86rem; }
.br-footer .br-wordmark { font-size: 1.1rem; }.br-footer .br-wordmark a { color: #fff; text-decoration: none; }
.br-footer a { color: #c7d0df; text-decoration: none; }.br-footer a:hover { color: #fff; }

.br-content { padding-block: 72px 96px; }
.br-content h1 { font-size: clamp(2.4rem, 5vw, 4.5rem); letter-spacing: -.055em; }
.br-post-meta { color: var(--br-slate); font-size: .9rem; }

@media (max-width: 960px) {
  .br-header .wp-block-navigation__responsive-container-open { display: flex; }
  .br-header .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none; }
  .br-header__cta { display: none !important; }
  .br-hero .wp-block-columns, .br-product .wp-block-columns, .br-about .wp-block-columns { flex-wrap: wrap !important; }
  .br-hero .wp-block-column, .br-product .wp-block-column, .br-about .wp-block-column { flex-basis: 100% !important; }
  .br-visual { margin-top: 30px; min-height: 480px; }
  .br-service-grid { flex-wrap: wrap !important; }
  .br-service-grid > .wp-block-column { flex-basis: calc(50% - 12px) !important; }
  .br-match-app { margin-top: 30px; }
  .br-about-visual { min-height: 280px; }
}

@media (max-width: 640px) {
  .br-shell { width: min(100% - 28px, 1180px); }
  .br-header__inner { min-height: 66px; }
  .br-wordmark { font-size: 1.2rem; }
  .br-wordmark a::before { width: 28px; height: 28px; font-size: 15px; }
  .br-hero { padding-top: 52px; }
  .br-hero h1 { font-size: clamp(2.55rem, 12.3vw, 3.6rem); }
  .br-hero__lead { font-size: 1rem; }
  .br-hero .wp-block-buttons { align-items: stretch; }
  .br-hero .wp-block-button { width: 100%; }.br-hero .wp-block-button__link { width: 100%; text-align: center; }
  .br-visual { min-height: 360px; transform: none; margin-bottom: 0; }
  .br-ui-dashboard { left: -4%; width: 78%; }.br-ui-workflow { right: -8%; width: 49%; }.br-ui-monitor { left: 8%; width: 82%; }
  .br-service-grid > .wp-block-column { flex-basis: 100% !important; }
  .br-service-card { min-height: auto; }
  .br-product { padding: 36px 24px !important; }
  .br-product h2 { font-size: 2.55rem; }
  .br-match-app { min-height: 360px; transform: none; width: 100%; margin-bottom: 0; }
  .br-process { flex-wrap: wrap !important; }.br-process > .wp-block-column { flex-basis: calc(50% - 12px) !important; }
  .br-feature-grid { grid-template-columns: 1fr; }
  .br-cta { padding: 34px 24px !important; }.br-cta .wp-block-columns { flex-wrap: wrap !important; }.br-cta .wp-block-column { flex-basis: 100% !important; }
  .br-footer__inner { flex-direction: column; align-items: flex-start !important; gap: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
