/* Base styles - herdados do style.css principal */
:root{
  --bg:#0c1222;
  --bg-alt:#0f1730;
  --text:#e8ecf6;
  --muted:#b7c0d6;
  --brand:#2ee1d1;
  --brand-2:#7aa5ff;
  --card:#121a33;
  --card-2:#0b1226;
  --border:rgba(255,255,255,.12);
  --shadow:0 10px 30px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);

}
img{max-width:100%;display:block}
.container{width:min(1100px,92%);margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:auto}
.skip-link:focus{left:1rem;top:1rem;background:#fff;color:#000;padding:.5rem .75rem;border-radius:.5rem}

/* Header */
.site-header{position:fixed;top:0;left:0;right:0;z-index:100;font-family:'Montserrat',sans-serif;background:transparent;backdrop-filter:saturate(120%) blur(8px);transition:background-color .25s ease, box-shadow .25s ease, border-color .25s ease}
.site-header.scrolled{background:rgba(56, 70, 99,.9);box-shadow:0 8px 24px rgba(0,0,0,.35);border-bottom:1px solid rgba(255,255,255,.08)}
.header-inner{display:flex;align-items:center;gap:2rem;justify-content:space-between;padding:1rem 0}
.brand{display:flex;align-items:center;gap:.8rem}
.brand a{display:block}
.logo-img{width:140px;height:auto;display:block}
.brand-name{display:none}

.nav{flex:1;display:flex;justify-content:center}
.nav-toggle{display:none;background:transparent;border:1px solid var(--border);color:var(--text);padding:.4rem .5rem;border-radius:.5rem}
.menu{display:flex;gap:2rem;list-style:none;margin:0;padding:0}
.menu a{color:#e8ecf6;text-decoration:none;font-size:1.3rem;font-weight:600;transition:color .2s}
.menu a:hover{color:var(--brand)}
.header-actions{display:flex;gap:.75rem;align-items:center}
.lang-switch select{background:transparent;border:1px solid rgba(255,255,255,.25);color:#e8ecf6;padding:.5rem .75rem;border-radius:.5rem;font-size:.9rem;cursor:pointer}
.btn-entrar{background:transparent;border:1px solid rgba(255,255,255,.3);color:#e8ecf6;padding:.5rem 1.25rem;border-radius:.5rem;text-decoration:none;font-size:.9rem;font-weight:500;transition:all .2s}
.btn-entrar:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.5)}

/* About Hero - texto à esquerda e imagem escura como no slider */
.about-hero{
  position: relative;
  background-image: url('../../../resources/img/newYcons/bg-about.jpg');
  min-height: 700px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 6rem 0 4rem;
  background-color:#0c1222;
  background-size:cover;
  background-position:center 5%;
  background-repeat:no-repeat;
  overflow: hidden;
}

/* Overlay escuro para a imagem de fundo */
.about-hero::before{
  content:'';
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(12,18,34,0.1) 0%, rgba(12,18,34,0.1) 100%);
  z-index: 1;
  pointer-events: none;
}

.about-hero .container{
  position: relative;
  z-index: 2;
  max-width: 1100px;
}

.about-hero h1{
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(2.5rem, 5vw, 3.5rem);
  color: #fff;
  margin: 13rem 0 1.25rem 0;
  font-weight: 300;
  letter-spacing: .02em;
  text-shadow: 0 4px 16px rgba(0,0,0,0.8);
}
.about-hero p{
  font-size:1.25rem;
  color:#c8d4e8;
  margin:0;
  text-align: left;
}

/* Timeline - estilo da imagem: linha azul-cinza, conectores sólidos, texto legível */
.about-timeline{
  background:#e9eef6;
  padding:4.5rem 0 5.25rem;
  color:#2f3a46;
}

.about-timeline-title{
  font-family:'Montserrat',sans-serif;
  font-size:clamp(2.2rem,4vw,3.8rem);
  font-weight:700;
  color:#84a8d3;
  margin:0 0 2.2rem;
  line-height:1.2;
  text-align:left;
}

.timeline{
  --line-color:#355b81;
  --dot-size:26px;
  --dot-size-start:48px;
  --connector-len:98px;
  --baseline-thickness:4px;
  --top-year:18px;
  --top-text:68px;
  --bottom-year:calc(50% + 108px);
  --bottom-text:calc(50% + 158px);
  --year-size:46px;
  --text-size:18px;
  --text-width:205px;
  --text-width-long:238px;
  --timeline-edge-offset: calc(100% / 14);
  position:relative;
  display:grid;
  grid-template-columns:repeat(7,minmax(120px,1fr));
  gap:0 .3rem;
  align-items:center;
  max-width:1240px;
  margin:0 auto;
  padding:.5rem 0;
}

.timeline::before{
  content:'';
  position:absolute;
  left:var(--timeline-edge-offset);
  right:var(--timeline-edge-offset);
  top:50%;
  transform:translateY(-50%);
  height:var(--baseline-thickness);
  border-radius:999px;
  background:var(--line-color);
  z-index:0;
}

.timeline-item{
  min-height:610px;
  position:relative;
  z-index:1;
  text-align:center;
  color:#2f3a46;
}

.timeline-year{
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.35rem,1.85vw,2.25rem);
  line-height:1.2;
  font-weight:700;
  color:#2d2f33;
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  margin:0;
  width:max-content;
  text-align:center;
}

.timeline-text{
margin: 0;
    font-size: clamp(.9rem, 0.8vw, 1.25rem);
    line-height: 1.15;
    color: #2d2f33;
    max-width: var(--text-width);
    font-weight: 200;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
}

.timeline-dot{
  width:var(--dot-size);
  height:var(--dot-size);
  border-radius:50%;
  background:var(--line-color);
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}


.timeline-dot::after{
  content:'';
  position:absolute;
  left:50%;
  width:0;
  border-left:4px solid var(--line-color);
  transform:translateX(-50%);
}

.timeline-item--top .timeline-text{
  top:var(--top-text);
}

.timeline-item--top .timeline-year{
  top:var(--top-year);
}

.timeline-item--top .timeline-dot::after{
  bottom:100%;
  height:var(--connector-len);
}

.timeline-item--bottom .timeline-year{
  top:var(--bottom-year);
}

.timeline-item--bottom .timeline-text{
  top:var(--bottom-text);
}

.timeline-item--bottom .timeline-dot::after{
  top:100%;
  height:var(--connector-len);
}

.timeline-item:nth-child(6) .timeline-text,
.timeline-item:nth-child(7) .timeline-text{
  max-width:var(--text-width-long);
}

.timeline-item:nth-child(7) .timeline-text{
  text-align:center;
}

/* About Content */
.about-content{background:#f8f9fb;padding:4rem 0;color:#1a1a1a}
.about-content h2{font-family:'Montserrat',sans-serif;font-size:3rem;color:#43516f;margin:3rem 0 2.5rem}
.about-content h2:first-child{margin-top:0;text-align: left}
.about-content p{font-size:1.1rem;line-height:1.5;color:#545454;margin-bottom: 2%;}
.values-list{list-style:none;padding:0;margin:2rem 0}
.values-list li{font-size:1.05rem;line-height:2;color:#545454;padding-left:2rem;position:relative}
.values-list li:before{content:'✓';position:absolute;left:0;color:#ff6b35;font-weight:700;font-size:1.2rem}
.about-cta{text-align:center;margin-top:3rem}
.about-cta .btn.primary{background:#384663;color:#fff;padding:1rem 3rem;border-radius:50px;font-size:1.1rem;font-weight:600;text-decoration:none;display:inline-block;transition:transform .2s,box-shadow .2s}
.about-cta .btn.primary:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(10,15,28,.3)}

/* Botão Saiba mais - igual ao home */
.link-saiba-mais{font-family:'Montserrat',sans-serif;text-decoration:none;font-weight:500;font-size:1.05rem;display:inline-flex;align-items:center;gap:1rem;transition:transform .25s ease, box-shadow .25s ease;color:#1e2d49;background:#85b0df;padding:.75rem 1.4rem .75rem 1.75rem;border-radius:999px;box-shadow:0 6px 14px rgba(38,72,122,.18)}
.link-saiba-mais .arrow{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#334a76;color:#fff;padding:.45rem}
.link-saiba-mais:hover{transform:translateY(-1px);box-shadow:0 10px 18px rgba(38,72,122,.24)}

/* Footer */
.site-footer{background:#384663;color:#fff;padding:3rem 0 0;margin-top:0}
.footer-grid{display:grid;grid-template-columns:1fr auto;gap:4rem;align-items:start;padding-bottom:2rem;border-bottom:1px solid rgba(255,255,255,.1)}
.footer-left .footer-brand{margin-bottom:1.5rem}
.footer-left .logo-img{width:120px;height:auto}
.footer-address{font-style:normal;color:#fff;line-height:1.8;font-weight: 600;}
.footer-address p{margin: 0;font-size:.95rem}
.footer-address strong{color:#fff;font-weight:600}

.footer-contact a{color:#fff;text-decoration:none;transition:color .2s}
.footer-contact a:hover{color:#fff}
.footer-right nav{display:flex;flex-direction:column;gap:1rem;align-items:flex-end}
.footer-right nav a{color:#fff;text-decoration:none;font-size:1.05rem;font-weight:500;transition:color .2s}
.footer-right nav a:hover{color:#2ee1d1}
.footer-bottom{padding:1.5rem 0}
.footer-bottom-content{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.footer-copyright{grid-column:2;margin:0;color:#fff;font-size:.9rem;text-align:center}
.footer-social{grid-column:3;justify-self:end;display:flex;gap:1rem}
.footer-social a{color:#b7c0d6;transition:color .2s}
.footer-social a:hover{color:#fff}
.footer-social svg{display:block}
/* Responsivo */
@media (max-width: 1150px){
  .about-timeline-title{font-size:clamp(2rem,5.2vw,3rem)}
  .timeline{
    --dot-size:22px;
    --dot-size-start:40px;
    --connector-len:98px;
    --top-year:22px;
    --top-text:64px;
    --bottom-year:calc(50% + 96px);
    --bottom-text:calc(50% + 142px);
    --text-width:160px;
    --text-width-long:190px;
    grid-template-columns:repeat(7,minmax(86px,1fr));
  }
  .timeline-item{min-height:540px}
  .timeline-year{font-size:clamp(1.15rem,1.55vw,1.7rem)}
  .timeline-text{font-size:clamp(.78rem,.92vw,.9rem)}
}

@media (max-width: 900px){
  .nav-toggle{display:inline-block;font-size:1.5rem;padding:.55rem .7rem;cursor:pointer}
  .menu{position:absolute;right:1rem;top:65px;background:#0b1226;border:1px solid var(--border);padding:.75rem;border-radius:.6rem;flex-direction:column;display:none;z-index:10;min-width:160px}
  .menu.open{display:flex}
  .about-timeline-title{font-size:clamp(1.7rem,7vw,2.35rem)}

  /* Vertical timeline: left line, dot on line, content to the right */
  .timeline{
    display:block;
    padding:1rem 0 1rem 0;
    position:relative;
  }
  .timeline::before{
    content:'';
    position:absolute;
    left:20px;
    right:auto;
    top:0;
    bottom:0;
    width:3px;
    height:auto;
    transform:none;
    background:var(--line-color);
    border-radius:999px;
  }
  /* Reset all items to simple block */
  .timeline-item,
  .timeline-item--top,
  .timeline-item--bottom,
  .timeline-item--start{
    display:flex;
    flex-direction:column;
    position:relative;
    min-height:auto;
    padding:0 1rem 2.5rem 56px;
    text-align:left;
  }
  /* Dot */
  .timeline-dot{
    position:absolute !important;
    left:9px !important;
    top:4px !important;
    width:22px !important;
    height:22px !important;
    border-radius:50% !important;
    background:var(--line-color) !important;
    transform:none !important;
    box-shadow:0 0 0 4px rgba(53,91,129,.2);
  }
  .timeline-dot::after{display:none !important}

  /* Reset all absolute positioning from desktop */
  .timeline-year,
  .timeline-text{
    position:static !important;
    left:auto !important;
    top:auto !important;
    transform:none !important;
    width:auto !important;
    max-width:none !important;
    text-align:left !important;
  }
  /* Year always on top */
  .timeline-year{
    order:1;
    font-size:1.4rem;
    font-weight:800;
    color:#1d2c40;
    margin:0 0 .3rem;
    line-height:1.1;
  }
  /* Description below year */
  .timeline-text{
    order:2;
    font-size:.95rem;
    line-height:1.45;
    font-weight:400;
    color:#445566;
    margin:0;
  }
}
@media (max-width: 640px){
  .nav-toggle{display:inline-block}
  .menu{position:absolute;right:1rem;top:60px;background:#0b1226;border:1px solid var(--border);padding:.5rem;border-radius:.6rem;flex-direction:column;display:none}
  .menu.open{display:flex}
  .footer-grid{grid-template-columns:1fr;gap:2rem}
  .footer-right nav{align-items:flex-start}
  .footer-bottom-content{flex-direction:column;gap:1rem;text-align:center}
  .about-hero{padding:6rem 0 3rem}
  .timeline-year{font-size:1.2rem;min-width:60px}
}

.tech-cta{
  text-align: center;
}