/* VRS Seguros — Quem somos. Usa a paleta e os componentes de style.css. */
.about-hero { background: var(--fundo-suave); padding: 25px 0 0; border-bottom-right-radius: clamp(44px, 7vw, 100px); }
.about-breadcrumb { display: flex; align-items: center; gap: 12px; color: var(--texto-leve); font-size: var(--fonte-minima); margin-bottom: 39px; }
.about-breadcrumb a:hover { color: var(--azul); }
.about-breadcrumb .icon { width: 12px; height: 12px; }
.about-breadcrumb [aria-current] { color: var(--azul-escuro); }
.about-hero-row { --bs-gutter-y: 2rem; }
.about-hero-copy { padding-bottom: 10px; }
.about-title { font-size: clamp(40px, 4.25vw, 62px); font-weight: 500; letter-spacing: -2.3px; line-height: 1.16; margin-bottom: 27px; }
.about-title > span { color: var(--azul-escuro); }
.about-hero-lead { max-width: 565px; font-size: 15px; line-height: 1.8; color: #586C7B; margin-bottom: 18px; }
.about-figure { position: relative; max-width: 420px; margin: 0 0 0 auto; padding-bottom: 27px; }
.about-image-frame { overflow: hidden; border-radius: 54px 10px 10px 10px; background: #0A1F2B; }
.about-image-frame img { display: block; width: 100%; height: auto; }
.about-image-caption { position: relative; display: flex; gap: 15px; align-items: center; width: fit-content; max-width: calc(100% - 30px); margin: -25px auto 0; padding: 20px 24px; background: var(--fundo); color: var(--texto-leve); font-size: var(--fonte-minima); line-height: 1.65; border-radius: 7px; box-shadow: 0 12px 30px rgb(15 76 117 / 9%); }
.about-image-caption > .icon { width: 30px; height: 30px; color: var(--azul); }
.about-image-caption strong { font-weight: 500; color: var(--azul-escuro); }
.about-landmarks { margin-top: 54px; padding: 30px 0 35px; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 30px; border-top: 1px solid var(--borda); }
.about-landmark { display: flex; gap: 19px; align-items: center; padding-right: 24px; border-right: 1px solid var(--borda); }
.about-landmark:last-child { border-right: 0; }
.landmark-number { font-family: var(--font-title); color: var(--azul-escuro); font-size: 35px; font-weight: 500; letter-spacing: -1.5px; flex-shrink: 0; }
.about-landmark > .icon { width: 32px; height: 32px; color: var(--azul); stroke-width: 1.3; }
.about-landmark > span:last-child { font-size: 14px; font-weight: 500; line-height: 1.7; }
.about-landmark small { display: block; color: var(--texto-leve); font-size: var(--fonte-minima); font-weight: 400; margin-top: 4px; }
.about-section-nav { border-bottom: 1px solid var(--borda); }
.about-section-nav .container-wide { display: flex; gap: 30px; align-items: center; flex-wrap: wrap; padding-block: 20px; }
.about-section-nav .container-wide > span { color: var(--texto-leve); font-size: var(--fonte-minima); font-weight: 500; letter-spacing: .7px; margin-right: auto; }
.about-section-nav a { display: flex; gap: 12px; align-items: center; color: var(--azul-escuro); font-size: 13px; }
.about-section-nav a:hover { color: var(--azul); }
.about-section-nav .icon { width: 15px; height: 15px; }
.about-body { font-size: 15px; color: #586C7B; line-height: 1.9; margin-bottom: 0; max-width: 710px; }
.about-history { padding-block: 98px; }
.about-history .section-title { font-size: clamp(34px, 3.2vw, 46px); }
.about-timeline { padding: 6px 0 0 35px; margin: 0 0 0 10px; list-style: none; }
.about-timeline li { position: relative; padding: 0 0 32px 27px; border-left: 1px solid #B8D6E8; }
.about-timeline li:last-child { border-left-color: transparent; padding-bottom: 0; }
.timeline-dot { position: absolute; top: 5px; left: -5px; width: 9px; height: 9px; border-radius: 50%; border: 2px solid var(--fundo); background: var(--azul); box-shadow: 0 0 0 1px var(--azul); }
.timeline-dot--today { background: var(--acento); box-shadow: 0 0 0 1px var(--acento); }
.timeline-year { display: block; color: var(--azul); font-size: 16px; font-weight: 600; line-height: 1.3; margin-bottom: 9px; }
.timeline-year--today { font-size: var(--fonte-minima); color: var(--azul-escuro); letter-spacing: .6px; }
.about-timeline h3 { font-size: 19px; font-weight: 500; letter-spacing: -.5px; margin-bottom: 12px; }
.about-timeline p { color: #586C7B; font-size: 13px; line-height: 1.8; margin-bottom: 0; max-width: 365px; }
.about-essence-shell { padding: 57px 58px; background: var(--fundo-suave); border-radius: 12px 12px 62px 12px; }
.about-essence .section-title { font-size: clamp(31px, 2.9vw, 42px); }
.about-value-mark { display: flex; gap: 14px; align-items: center; font-size: var(--fonte-minima); color: var(--texto-leve); line-height: 1.7; margin-top: 31px; }
.about-value-mark > .icon { width: 33px; height: 33px; color: var(--azul); }
.about-value-mark strong { font-weight: 500; color: var(--azul-escuro); }
.about-essence-divider { height: 1px; background: var(--borda); margin-block: 39px; }
.about-subtitle { color: var(--azul-escuro); font-size: 31px; line-height: 1.3; letter-spacing: -1px; font-weight: 500; margin: 0; }
.about-market { padding-block: 97px; }
.about-market .section-title { margin-bottom: 26px; }
.about-principles { padding: 28px 35px; border: 1px solid var(--borda); border-radius: 10px 42px 10px 10px; background: var(--fundo); margin-left: 27px; }
.about-principles > div { display: flex; align-items: center; gap: 22px; padding: 22px 0; border-bottom: 1px solid var(--borda); }
.about-principles > div:last-child { border-bottom: 0; }
.about-principles > div > span { color: var(--azul); font-size: var(--fonte-minima); }
.about-principles h3 { font-size: 23px; font-weight: 500; letter-spacing: -.5px; margin: 0; }
.about-principles .icon { color: var(--azul); margin-left: auto; width: 18px; height: 18px; }
.about-market .about-principles { margin: 28px 0 0; }
.about-market-figure { position: relative; width: min(100%, 560px); margin: 0 auto; padding: 15px 15px 0 0; }
.about-market-figure::before { position: absolute; z-index: 0; inset: 0 0 15px 15px; border: 1px solid #80BBDD; border-radius: 14px 14px 54px 14px; content: ""; pointer-events: none; }
.about-market-image-frame { position: relative; z-index: 1; overflow: hidden; border: 1px solid var(--borda); border-radius: 10px 10px 49px 10px; background: var(--fundo); box-shadow: 0 18px 44px rgb(15 76 117 / 11%); }
.about-market-image-frame img { display: block; width: 100%; height: auto; }
.about-commitment { padding-top: 67px; padding-bottom: 72px; background: var(--fundo-suave); border-block: 1px solid #EDF2F5; }
.about-partnership { position: relative; padding: 43px 47px; margin-top: 48px; background-color:#80BBDD; color: #444; border-radius: 10px 10px 49px 10px; }
.partnership-kicker { display: flex; gap: 10px; align-items: center; font-size: var(--fonte-minima); color: #D3EAF8; letter-spacing: .7px; line-height: 1.7; margin-bottom: 25px; }
.partnership-kicker .status-dot { background: var(--acento); }
.about-partnership blockquote { max-width: 980px; font-family: var(--font-title); font-size: clamp(20px, 1.8vw, 26px); font-weight: 400; line-height: 1.7; letter-spacing: -.4px; margin-bottom: 25px; }
.partnership-signature { display: flex; align-items: center; gap: 18px; color: #D3EAF8; font-size: var(--fonte-minima); }
.signature-line { width: 55px; height: 1px; background: #80BBDD; }

@media (max-width: 1199.98px) {
  .about-title { font-size: 46px; }
  .about-hero-lead { font-size: 14px; }
  .about-figure { max-width: 350px; }
  .about-landmarks { gap: 22px; }
  .about-landmark { padding-right: 18px; gap: 14px; }
  .about-landmark > span:last-child { font-size: 13px; }
  .about-essence-shell { padding: 45px 42px; }
  .about-essence .section-title { font-size: 34px; }
  .about-body { font-size: 14px; }
  .about-principles { margin-left: 15px; padding: 25px; }
  .about-principles h3 { font-size: 21px; }
}
@media (max-width: 991.98px) {
  .about-breadcrumb { margin-bottom: 31px; }
  .about-title { font-size: 52px; max-width: 680px; }
  .about-hero-lead { font-size: 15px; }
  .about-figure { max-width: 430px; margin: 0 auto; }
  .about-landmarks { margin-top: 34px; gap: 18px; }
  .about-landmark { align-items: flex-start; flex-direction: column; gap: 12px; padding-right: 12px; }
  .about-landmark > span:last-child { font-size: 13px; }
  .landmark-number { font-size: 31px; }
  .about-section-nav .container-wide { gap: 18px 22px; }
  .about-section-nav .container-wide > span { flex-basis: 100%; margin-right: 0; }
  .about-history { padding-block: 75px; }
  .about-timeline { margin-left: 0; padding-left: 7px; }
  .about-timeline p { max-width: 570px; }
  .about-body { font-size: 15px; max-width: none; }
  .about-essence-shell { padding: 39px; }
  .about-essence .section-title { font-size: 39px; }
  .about-value-mark { margin-top: 24px; }
  .about-subtitle { font-size: 31px; }
  .about-market { padding-block: 74px; }
  .about-principles { margin-left: 0; }
  .about-partnership { padding: 35px 36px; }
}
@media (max-width: 575.98px) {
  .about-hero { padding-top: 22px; border-bottom-right-radius: 43px; }
  .about-breadcrumb { font-size: var(--fonte-minima); margin-bottom: 30px; }
  .about-hero-row, .about-history .row, .about-market .row, .about-commitment .row { --bs-gutter-x: 2rem; --bs-gutter-y: 2rem; }
  .about-title { font-size: clamp(32px, 8.8vw, 44px); letter-spacing: -1.3px; line-height: 1.22; margin-bottom: 23px; }
  .about-hero-lead { font-size: 14px; }
  .about-hero .text-link { font-size: 13px; gap: 18px; }
  .about-figure { max-width: 340px; padding-bottom: 0; }
  .about-image-frame { border-top-left-radius: 42px; }
  .about-image-caption { padding: 16px 18px; gap: 12px; max-width: calc(100% - 22px); }
  .about-image-caption > .icon { width: 27px; height: 27px; }
  .about-landmarks { grid-template-columns: 1fr; gap: 0; margin-top: 36px; padding-top: 6px; padding-bottom: 19px; }
  .about-landmark { flex-direction: row; align-items: center; gap: 20px; border-right: 0; padding: 23px 0; border-bottom: 1px solid var(--borda); }
  .about-landmark:last-child { border-bottom: 0; }
  .about-landmark > span:last-child { font-size: 14px; }
  .landmark-number { font-size: 31px; }
  .about-landmark > .icon { margin-inline: 15px; }
  .about-section-nav .container-wide { gap: 18px 23px; padding-block: 23px; }
  .about-section-nav a { font-size: var(--fonte-minima); gap: 8px; }
  .about-section-nav .icon { width: 13px; height: 13px; }
  .about-history { padding-block: 61px; }
  .about-history .section-title { font-size: 32px; letter-spacing: -1px; }
  .about-body { font-size: 14px; line-height: 1.9; }
  .about-timeline { padding-top: 5px; }
  .about-timeline li { padding-left: 23px; }
  .about-timeline h3 { font-size: 18px; }
  .about-timeline p { font-size: 13px; }
  .about-essence-shell { padding: 31px 25px; border-bottom-right-radius: 40px; }
  .about-essence-shell .row { --bs-gutter-x: 1.5rem; --bs-gutter-y: 1.6rem; }
  .about-essence .section-title { font-size: 30px; letter-spacing: -1.2px; }
  .about-value-mark { margin-top: 22px; }
  .about-essence-divider { margin-block: 29px; }
  .about-subtitle { font-size: 28px; }
  .about-market { padding-block: 61px; }
  .about-market .section-title { font-size: 33px; }
  .about-principles { padding: 17px 21px; border-top-right-radius: 32px; }
  .about-principles > div { gap: 15px; padding-block: 23px; }
  .about-principles h3 { font-size: 20px; }
  .about-principles .icon { width: 16px; height: 16px; }
  .about-commitment { padding-top: 58px; padding-bottom: 57px; }
  .about-commitment .section-title { margin-bottom: 0; }
  .about-partnership { padding: 30px 25px; margin-top: 34px; border-bottom-right-radius: 35px; }
  .partnership-kicker { letter-spacing: .3px; align-items: flex-start; gap: 9px; margin-bottom: 23px; }
  .partnership-kicker .status-dot { margin-top: 7px; }
  .about-partnership blockquote { font-size: 20px; line-height: 1.8; }
  .partnership-signature { flex-wrap: wrap; gap: 12px; line-height: 1.7; }
  .signature-line { width: 35px; }
}
@media (prefers-reduced-motion: reduce) {
  .about-page .reveal { animation: none; }
}
