/* =================== Base / Paleta =================== */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --blue-900:#0A1F44; --blue-800:#0F2A5A; --blue-700:#1E3A8A;
  --blue-600:#2F4EB2; --blue-500:#3B82F6; --blue-300:#93C5FD;
  --slate-900:#0F172A; --slate-800:#1E293B; --slate-700:#334155;
  --slate-600:#475569; --slate-500:#64748B; --slate-200:#E2E8F0;
  --white:#fff; --bg:#F7FAFD;
  --radius:18px; --shadow:0 20px 50px rgba(17,24,39,.12);
  --card-h:160px; --icon-size:64px;
}

@font-face {
  font-family:'Azonix';
  src:url('assets/Azonix.otf') format('opentype');
  font-weight:400; font-style:normal;
}

html{scroll-behavior:smooth}
body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,'Noto Sans','Liberation Sans',sans-serif;
  color:var(--slate-800); background:var(--bg); line-height:1.6
}

/* ===== Alinha a largura da seção "Soluções Inovadoras" à caixa dos softwares ===== */
#solutions .container {
  max-width: 1100px;   /* ou o mesmo valor usado no container dos softwares */
  margin: 0 auto;
}

#solutions h2,
#solutions .section-subtitle {
  max-width: none;     /* permite expandir até a largura total */
  width: 100%;
}

/**/
.section-header,
.section-intro {
  max-width: 1100px;     /* igual à largura da caixa abaixo */
  margin: 0 auto;
  text-align: left;
  padding: 0 24px;
}

.section-intro p {
  max-width: none;        /* remove limitação de largura do parágrafo */
  width: 100%;
}

@media (max-width: 960px) {
  .section-header,
  .section-intro {
    max-width: 100%;
    padding: 0 18px;
  }
}

/* =================== Layout utils =================== */
.container{width:min(1200px,92%);margin-inline:auto}
.section{padding:clamp(56px,7vw,96px) 0}
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}

@media(max-width:960px){
  .grid-2{grid-template-columns:1fr}
}
.mt-16{
  margin-top:16px
}
.mt-24{
  margin-top:24px
}
.center{
  text-align:center
}

/* =================== Navbar =================== */
.nav{position:sticky;
  top:0;
  z-index:50;
  background:rgba(15,42,90,.9);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.08)
}

.nav-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 0
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  color:#EAF2FF;
  text-decoration:none;
  font-weight:800;
  letter-spacing:.4px;
  font-family:'Azonix','Orbitron',sans-serif;
  font-size:20px}

.brand img{
  height:42px;
  width:auto;
  object-fit:contain
}

.nav ul{list-style:none;display:flex;gap:22px}

.nav a{color:#EAF2FF;text-decoration:none;font-weight:600;position:relative}

.nav a::after{content:'';position:absolute;left:0;bottom:-6px;width:0;height:2px;background:var(--blue-500);transition:width .25s}

.nav a:hover::after{width:100%}

.lang-switch{display:flex;gap:8px}

.lang-switch button{background:transparent;
  color:#EAF2FF;
  border:1px solid rgba(255,255,255,.25);
  padding:6px 10px;
  border-radius:10px;
  cursor:pointer;
  font-weight:700
}

.lang-switch button.active{
  background:var(--blue-500);
  border-color:transparent;
  color:white}

/* =================== Hero =================== */
.hero{
  background:
    radial-gradient(1200px 600px at -10% -10%, #EAF2FF 0%, transparent 50%),
    radial-gradient(1000px 500px at 110% -20%, #E4ECFF 0%, transparent 50%),
    linear-gradient(180deg, #F7FAFF 0%, #ECF3FF 100%);
}
.hero-grid{display:grid;grid-template-columns:1fr 480px;align-items:start;gap:48px}
@media(max-width:960px){.hero-grid{grid-template-columns:1fr}}
.badge{display:inline-flex;align-items:center;gap:8px;background:white;border:1px solid var(--slate-200);color:var(--slate-600);border-radius:999px;padding:8px 14px;box-shadow:var(--shadow);white-space:nowrap;max-width:100%}
.badge svg{flex-shrink:0;min-width:20px;min-height:20px}
.hero h1{font-size:clamp(40px,4.8vw,64px);line-height:1.1;color:var(--slate-900)}
.hero h1 .accent{color:var(--blue-600)}
.hero p{margin-top:14px;color:var(--slate-600);font-size:clamp(16px,1.2vw,18px)}

/* =================== Botões / KPIs =================== */
.btn{display:inline-flex;align-items:center;gap:8px;border:none;cursor:pointer;text-decoration:none;font-weight:800;border-radius:14px;padding:14px 18px}
.btn-primary{background:var(--blue-500);color:white;box-shadow:0 12px 30px rgba(59,130,246,.25)}
.btn-light{background:white;color:var(--slate-800);border:1px solid var(--slate-200)}
.kpis{display:flex;gap:28px;margin-top:24px;color:var(--slate-600)}
.kpis b{display:block;color:var(--slate-900);font-size:22px}

/* =================== Pilha Vertical: Logo + Cards =================== */
.software-stack{display:flex;flex-direction:column;gap:20px;width:100%;max-width:480px}
.software-stack .badge{margin-bottom:20px;margin-top:0;align-self:flex-start;background:white;border:1px solid var(--slate-200);box-shadow:var(--shadow);padding:10px 16px;border-radius:12px;display:inline-flex;align-items:center;gap:10px;white-space:normal;max-width:100%;line-height:1.4}
.software-stack .badge svg{flex-shrink:0;min-width:20px;min-height:20px}
.company-logo-left{display:flex;justify-content:center;align-items:center;margin-bottom:24px}
.company-logo-left img{height:180px;width:auto;filter:drop-shadow(0 8px 16px rgba(0,0,0,.1))}

/* Cards empilhados */
.card{background:#fff;border:1px solid var(--slate-200);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);display:flex;align-items:flex-start;gap:18px;min-height:var(--card-h);width:100%}
.card .icon{width:var(--icon-size);height:var(--icon-size);flex:0 0 var(--icon-size);border-radius:16px;background:linear-gradient(135deg,#5B7FC7 0%,#4A6BA8 100%);color:#fff;display:grid;place-items:center;font-size:28px;box-shadow:0 8px 20px rgba(75,107,168,.25)}
.card h3{margin:0 0 8px 0;color:var(--slate-900);font-size:20px;line-height:1.3}
.card p{color:var(--slate-600);line-height:1.6;margin:0;font-size:15px}

/* =================== Sobre mim =================== */
.about .photo{border-radius:20px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--slate-200)}
.about .photo img{width:100%;height:100%;object-fit:cover}

/* =================== Softwares (cards grandes) =================== */
.softwrap{background:white;border:1px solid var(--slate-200);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}
.softwrap h3{color:var(--blue-700);margin-bottom:8px}
.hero-logo-top{height:180px;margin-bottom:10px}

/* =================== Footer =================== */
footer{background:linear-gradient(135deg,#0A1F44 0%,#0F2A5A 100%);color:#DDE6FF;padding:80px 0 40px;margin-top:80px}
.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
@media(max-width:960px){.footer-grid{grid-template-columns:1fr;gap:40px}}
.footer-left{max-width:500px}
.footer-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(59,130,246,.15);border:1px solid rgba(59,130,246,.3);color:#93C5FD;border-radius:999px;padding:6px 12px;font-size:14px;font-weight:600;margin-bottom:16px}
.footer-title{font-size:clamp(32px,4vw,42px);line-height:1.2;color:white;margin-bottom:16px}
.footer-accent{background:linear-gradient(135deg,#60A5FA 0%,#3B82F6 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.footer-description{color:#B8C5E0;font-size:16px;line-height:1.7;margin-bottom:32px}
.footer-info{display:flex;flex-direction:column;gap:20px;margin-bottom:24px}
.footer-info-item{display:flex;gap:14px;align-items:flex-start}
.footer-icon{width:40px;height:40px;border-radius:10px;background:rgba(59,130,246,.15);border:1px solid rgba(59,130,246,.3);color:#60A5FA;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.footer-label{font-size:12px;color:#8B9BC4;text-transform:uppercase;letter-spacing:.5px;font-weight:600;margin-bottom:4px}
.footer-info-item a{color:#C7D7FF;text-decoration:none;font-size:15px;transition:color .2s}
.footer-info-item a:hover{color:#60A5FA}
.footer-info-item span{color:#C7D7FF;font-size:15px}
.footer-social{display:flex;gap:12px;margin-bottom:32px}
.footer-social a{width:44px;height:44px;border-radius:10px;background:rgba(59,130,246,.15);border:1px solid rgba(59,130,246,.3);color:#60A5FA;display:flex;align-items:center;justify-content:center;transition:all .3s}
.footer-social a:hover{background:rgba(59,130,246,.25);border-color:#60A5FA;transform:translateY(-2px)}
.footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:12px;padding-top:32px;border-top:1px solid rgba(255,255,255,.1)}
.footer-brand img{height:36px;width:auto}
.footer-brand span{color:white;font-weight:700;font-size:18px;font-family:'Azonix','Orbitron',sans-serif}
.footer-copyright{color:#8B9BC4;font-size:14px;margin-top:8px}
.contact-form{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:32px;backdrop-filter:blur(10px)}
.contact-form h3{color:white;font-size:24px;margin-bottom:24px}
.form-group{margin-bottom:20px}
.form-group label{display:block;color:#B8C5E0;font-size:14px;font-weight:600;margin-bottom:8px}
.form-group input,.form-group textarea{width:100%;background:rgba(15,42,90,.5);border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:12px 16px;color:white;font-size:15px;font-family:inherit;transition:all .3s}
.form-group input::placeholder,.form-group textarea::placeholder{color:#6B7BA8}
.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#60A5FA;background:rgba(15,42,90,.7)}
.form-group textarea{resize:vertical;min-height:120px}
.btn-full{width:100%;justify-content:center;font-size:16px;padding:14px 24px}
.form-status{margin-top:16px;padding:12px;border-radius:10px;font-size:14px;text-align:center;display:none}
.form-status.success{background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.3);color:#86EFAC;display:block}
.form-status.error{background:rgba(239,68,68,.15);border:1px solid rgba(239,68,68,.3);color:#FCA5A5;display:block}

/* =================== Páginas internas =================== */
.header-min{padding:64px 0 28px;background:linear-gradient(180deg,#F8FBFF 0,#EEF5FF 100%);border-bottom:1px solid var(--slate-200)}
.prose{max-width:820px;margin-inline:auto;padding:24px 0}
.prose h1{font-size:40px;color:var(--slate-900);margin-bottom:8px}
.prose h2{margin-top:24px;color:var(--blue-700)}
.prose p{margin:12px 0;color:var(--slate-700)}

/* =================== About Cards Grid =================== */
.about-cards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:24px}
@media(max-width:768px){.about-cards-grid{grid-template-columns:1fr}}
.about-card{background:#F8FAFC;border:1px solid var(--slate-200);border-radius:16px;padding:24px;transition:all .3s ease}
.about-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(15,23,42,.08);border-color:var(--blue-300)}
.about-icon{width:48px;height:48px;border-radius:12px;background:linear-gradient(135deg,#5B7FC7 0%,#4A6BA8 100%);color:white;display:flex;align-items:center;justify-content:center;margin-bottom:16px;box-shadow:0 4px 12px rgba(75,107,168,.2)}
.about-card h3{color:var(--slate-900);font-size:18px;font-weight:700;margin-bottom:8px;line-height:1.3}
.about-card p{color:var(--slate-600);font-size:14px;line-height:1.6;margin:0}

/* =================== Software Detail Section =================== */
.section-subtitle{margin-top:12px;color:var(--slate-600);font-size:18px;max-width:800px;line-height:1.7}
.software-detail{background:white;border:1px solid var(--slate-200);border-radius:24px;overflow:hidden;box-shadow:var(--shadow);margin-top:48px}
.software-header{background:linear-gradient(135deg,#F8FAFC 0%,#EEF5FF 100%);padding:40px;border-bottom:1px solid var(--slate-200)}
.software-logo-title {
  font-family: 'Azonix', sans-serif;
  font-size: 32px;          /* antes: 24px */
  font-weight: 400;         /* Azonix já é bold */
  letter-spacing: 0.5px;
  color: var(--blue-800);
  display: flex;
  align-items: center; /* alinha verticalmente o logo e os textos */
  gap: 24px;           /* espaço entre logo e textos */

}
.software-logo-large{width:180px;height:auto;flex-shrink:0}
.software-subtitle {
  font-family: sans-serif;
  font-size: 18px;          /* antes: 16px */
  font-weight: 400;
  letter-spacing: 1px;
  color: var(--blue-600);
  text-transform: uppercase; /* opcional, deixa mais técnico */
}

.software-description{
  color:var(--slate-600);
  font-family: sans-serif;
  font-size:16px;
  line-height:1.7;
  margin-top:12px
}

.software-body{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:40px}
@media(max-width:960px){
  .software-body{grid-template-columns:1fr}
  .software-logo-title{flex-direction:column;align-items:center;text-align:center}
}
.software-body h4{color:var(--slate-900);font-size:20px;margin-bottom:20px;font-weight:700}
.feature-list{list-style:none;display:flex;flex-direction:column;gap:12px}
.feature-list li{display:flex;align-items:flex-start;gap:12px;color:var(--slate-700);font-size:15px;line-height:1.6}
.feature-list li svg{color:var(--blue-600);flex-shrink:0;margin-top:2px}
.impact-cards{display:flex;flex-direction:column;gap:16px}
.impact-card{background:#F8FAFC;border:1px solid var(--slate-200);border-radius:12px;padding:20px;display:flex;gap:16px;align-items:flex-start;transition:all .3s}
.impact-card:hover{border-color:var(--blue-300);box-shadow:0 4px 12px rgba(59,130,246,.1);transform:translateY(-2px)}
.impact-icon{width:44px;height:44px;flex-shrink:0;border-radius:10px;background:linear-gradient(135deg,#5B7FC7 0%,#4A6BA8 100%);color:white;display:flex;align-items:center;justify-content:center}
.impact-card strong{display:block;color:var(--slate-900);font-size:16px;margin-bottom:6px}
.impact-card p{color:var(--slate-600);font-size:14px;line-height:1.6;margin:0}
.software-footer{padding:32px 40px;background:#FAFBFC;border-top:1px solid var(--slate-200);display:flex;justify-content:center}

/* Scroll offset para âncoras */
#solutions{scroll-margin-top:80px}

/* =================== Project Maestro (cards do topo + galeria) =================== */
.maestro-hero{padding:64px 0 40px;background:radial-gradient(1200px 600px at 20% -10%, rgba(90,167,255,.15), transparent),radial-gradient(900px 400px at 110% -30%, rgba(155,208,255,.12), transparent)}
.maestro-hero .hero-grid{display:grid;grid-template-columns:160px 1fr;gap:32px;align-items:center}
.maestro-hero .hero-logo{width:140px;height:140px;object-fit:contain;border-radius:16px;box-shadow:0 8px 24px rgba(90,167,255,.25)}
.maestro-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
.maestro-card{background:white;border:1px solid var(--slate-200);border-radius:16px;padding:20px;box-shadow:var(--shadow)}
.key-features{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:24px}
.key-features .feat{background:#f8fafc;border:1px solid var(--slate-200);border-radius:14px;padding:16px}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:24px}
.gallery figure{border-radius:14px;overflow:hidden;box-shadow:0 6px 18px rgba(15,23,42,.15);background:#fff;border:1px solid var(--slate-200)}
.gallery .shot{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:#F8FAFC}
.gallery figcaption{padding:10px;font-size:14px;color:var(--slate-600);background:#f9fafb;border-top:1px solid var(--slate-200)}
@media(max-width:900px){
  .key-features,.gallery,.maestro-cards{grid-template-columns:1fr}
  .maestro-hero .hero-grid{grid-template-columns:1fr}
}

/* =================== Timeline – About (linha à esquerda, nó centralizado, sem bullets) =================== */
.timeline-section{
  background:#fff;
  padding:80px 0
}
/* Timeline: afasta conteúdo e mantém nó exatamente sobre a linha  */
.timeline{
  position:relative;
  margin-top:40px;
  padding-left:110px;   /* antes: 90px  → dá espaço entre linha e logo */
  max-width:1100px;
}

/* Linha vertical (move junto com o padding acima) */
.timeline::before{
  content:"";
  position:absolute;
  left:64px;            /* antes: 44px  → acompanha o novo padding */
  top:0; bottom:0;
  width:3px;
  background:linear-gradient(180deg,#3B82F6,#1E3A8A);
  border-radius:4px;
}

/* Nó (bolinha) centralizado na linha, sem encostar no logo) */
.timeline-item{
  position:relative;
  display:flex;
  align-items:flex-start;
  gap:28px;
  margin-bottom:56px;
}
.timeline-item::before{
  content:"";
  position:absolute;
  left:64px;            /* igual à linha para ficar exatamente em cima dela */
  top:34px;
  width:12px;height:12px;
  background:#3B82F6;
  border-radius:50%;
  box-shadow:0 0 0 3px #DBEAFE;
  transform:translateX(-50%); /* mantém o centro do nó alinhado ao centro da linha */
  z-index:1;            /* fica atrás dos cartões, caso ainda haja sobreposição */
}

/* Garante que o logo/card fique acima do nó se cruzarem por altura */
.timeline-company,
.company-logo-wrapper{
  position:relative;
  z-index:2;
}

.company-logo-wrapper{
  background:#fff;
  border:1px solid var(--slate-200);
  border-radius:16px;
  padding:14px;display:flex;
  align-items:center;
  justify-content:center;
  min-height:92px;
  box-shadow:0 6px 18px rgba(59,130,246,.15);
  margin-bottom:8px
}

.company-logo{
  max-width:140px;
  max-height:64px;
  width:auto;
  height:auto;
  object-fit:contain
}

.timeline-company .company-name{
  color:var(--slate-700);
  font-weight:600
}

.timeline-company .company-loc{
  color:var(--slate-500);
  font-size:13px
}

.timeline-content{
  background:#F8FAFC;
  border:1px solid var(--slate-200);
  border-radius:20px;
  padding:28px 32px;
  flex:1;
  box-shadow:0 10px 24px rgba(15,23,42,.06)
}

.timeline-period{
  color:var(--blue-600);
  font-weight:700;
  font-size:14px;
  margin-bottom:8px;
  text-transform:uppercase;
  letter-spacing:.5px
}

.timeline-role{
  color:var(--slate-900);
  font-size:22px;
  font-weight:700;
  margin-bottom:14px
}

.timeline-achievements{
  list-style:none;margin:0;
  padding:0;display:flex;
  flex-direction:column;
  gap:10px
}

.timeline-achievements li{
  color:var(--slate-700);
  font-size:15px;
  line-height:1.75;
  padding-left:0;
  position:static
}

.timeline-achievements li::before{
  content:none !important
}

/* Responsivo: mantém as proporções no mobile */
@media (max-width:960px){
  .timeline{ padding-left:78px; }
  .timeline::before{ left:38px; }
  .timeline-item::before{ left:38px; top:18px; }
}

/* ===== EDUCATION (logos das instituições) ===== */
.education-card {
  background:#fff;
  border:1px solid var(--slate-200);
  border-radius:16px;
  padding:24px;
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  transition:.3s;
  min-height:200px;
}
.education-card:hover {
  transform:translateY(-4px);
  box-shadow:0 16px 40px rgba(17,24,39,.15);
}
.education-logo-wrapper {
  display:flex;
  justify-content:center;
  align-items:center;
  height:60px;
  margin-bottom:18px;
}
.education-logo {
  max-height:48px;
  max-width:120px;
  object-fit:contain;
}
.education-degree {
  color:var(--slate-900);
  font-size:18px;
  font-weight:700;
  margin-bottom:8px;
  text-align:left;
}
.education-institution {
  color:var(--blue-600);
  font-size:15px;
  font-weight:600;
  margin-bottom:8px;
  text-align:left;
}
.education-year {
  color:var(--slate-600);
  font-size:13px;
  text-align:left;
}

/* Botão Conheça o Fundador */
.photo {
  position: relative;
}

.btn-founder {
  display: inline-block;
  width: 100%;
  margin-top: 20px;
  padding: 14px 24px;
  background: linear-gradient(135deg, var(--blue-600) 0%, var(--blue-700) 100%);
  color: var(--white);
  text-decoration: none;
  border-radius: 12px;
  font-weight: 600;
  font-size: 15px;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
  text-align: center;
}

.btn-founder:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(59, 130, 246, 0.4);
  background: linear-gradient(135deg, var(--blue-700) 0%, var(--blue-600) 100%);
}

/* Mensagens de Status do Formulário */
.form-status {
  padding: 16px 20px;
  border-radius: 12px;
  margin-bottom: 24px;
  font-size: 15px;
  font-weight: 500;
  animation: slideDown 0.3s ease;
}

.form-status.success {
  background: linear-gradient(135deg, #D1FAE5 0%, #A7F3D0 100%);
  color: #065F46;
  border: 1px solid #34D399;
}

.form-status.error {
  background: linear-gradient(135deg, #FEE2E2 0%, #FECACA 100%);
  color: #991B1B;
  border: 1px solid #F87171;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =================== LinkedIn Social Item =================== */
.footer-social {
  margin-top: 24px;
}

.footer-social-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
}

.social-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: rgba(59, 130, 246, 0.1);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.social-icon svg {
  color: #3B82F6;
  transition: all 0.3s ease;
}

.footer-social-item:hover .social-icon {
  background: rgba(59, 130, 246, 0.2);
  transform: translateY(-2px);
}

.social-label {
  font-size: 12px;
  font-weight: 600;
  color: #64748B;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 4px;
}

.social-text {
  display: block;
  font-size: 15px;
  font-weight: 600;
  color: #334155;
  margin-bottom: 4px;
}

.social-link {
  display: block;
  font-size: 14px;
  color: #3B82F6;
  text-decoration: none;
  transition: all 0.3s ease;
}

.social-link:hover {
  text-decoration: underline;
  color: #2563EB;
}