/* Identidade W&R — azul e verde da logo fornecida pelo cliente. */
@layer brand;
@layer brand {
  .quote-consent { display:flex; align-items:flex-start; gap:11px; font-size:11px; line-height:1.7; margin:20px 0; color:#c6d2e7; }
  .quote-consent input { accent-color:#7de309; flex-shrink:0; width:17px; height:17px; margin-top:2px; }
  .quote-consent button { color:#a6ee56; text-decoration:underline; padding:0; font:inherit; text-align:left; }
  .quote-trap { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
  .privacy-list a { color:#a6ee56; text-decoration:underline; }
  #quiz-next:disabled { opacity:.6; cursor:wait; }
  :root {
    --brand-blue: #1b1094;
    --brand-green: #7de309;
    --brand-green-hover: #92f426;
    --blue: var(--brand-green);
    --blue2: #3022bb;
    --bg: #080920;
    --bg2: #101131;
    --panel: #141536;
    --line: rgba(160, 167, 223, .16);
  }
  ::selection { background: var(--brand-green); color: #101439; }
  :is(a, button, summary, input, select, textarea, [tabindex]):focus-visible {
    outline-color: var(--brand-green);
  }
  .light :is(a, button, summary, input, select, textarea):focus-visible {
    outline-color: var(--brand-blue);
  }
  .preview-bar { background: #111338; color: #c0eda0; }
  .header { background: rgba(20, 14, 86, .96); border-bottom-color: #83df1329; }
  .brand { width: 170px; flex-shrink: 0; }
  .brand-logo { width: 100%; height: 65px; object-fit: contain; }
  .nav { height: 86px; }
  .nav nav { gap: 25px; }
  .nav nav a:after { background: var(--brand-green); }
  .button { background: var(--brand-green); color: #111240; }
  .button:hover { background: var(--brand-green-hover); }
  .button-outline { background: transparent; color: #f7f9ff; border-color: #a6d87173; }
  .button-outline:hover { background: #7de30915; border-color: var(--brand-green); }
  .button-glass { background: #111b3b33; color: white; border-color: #dbe5ff77; }
  .button-glass:hover { background: #111b3b66; }
  .button-quiet { background: transparent; color: #b7c6e5; border-color: #536583; }
  .button-quiet:hover { background: #222d48; }
  .hero { background: #161a48; }
  .hero-photo { background-image: url('assets/hero-frota-wr.webp'); background-position: 64% center; }
  .hero-shade {
    background: linear-gradient(90deg, #090d36ee 0%, #111b45b8 28%, #111a4230 60%, #09112c00 100%),
      linear-gradient(0deg, #080a24c9, transparent 32%);
  }
  .hero h1 span { color: var(--brand-green); }
  .eyebrow-pill { background: #20335140; border-color: #b4e87955; color: #d0f4a8; }
  .status-dot { background: var(--brand-green); box-shadow: 0 0 12px #7de30977; }
  .hero-content > p { color: #dce4ef; }
  .hero-types strong { color: #f7faff; }
  .hero-types > div { border-right-color: #c2dfaa33; }
  .hero-scroll { color: #c8d7bf; }
  .clients { background: #101132; }
  .eyebrow, .text-link, .check-line, .tiny-number { color: #a2df6c; }
  .text-link:hover { color: #e7ffd7; }
  .light .eyebrow, .light .text-link { color: var(--brand-blue); }
  .light h2 span { color: var(--brand-blue); }
  .light .text-link:hover { color: #4032c3; }
  .icon-box { color: #171548; box-shadow: 0 6px 25px #7de30920; }
  .about-values > div { background: linear-gradient(135deg, #1c1b4966, #10122e40); }
  .about-bus { border-color: #a1db7240; }
  .video-trigger { background: #131638ed; border-color: #8ac54855; }
  .video-trigger > span:last-child { color: var(--brand-green); }
  .play-icon { color: #15123c; }
  .service-card { background: linear-gradient(145deg, #1b1b486b, #0c102700); border-color: #7676b833; }
  .service-card:hover { border-color: #8ee63288; }
  .service-number { color: #323179; }
  .service-tag { color: #a3bfc8; }
  .tags span { color: #c0e3a0; border-color: #63824466; background: #7de30907; }
  .coverage-highlights svg { color: var(--brand-blue); }
  .map-pin { color: #171240; background: var(--brand-green); }
  .map-state { color: #282064; }
  .map-legend span { background: var(--brand-blue); }
  .quote-mark { color: #759e62; }
  .avatar { background: #e5f3d5; color: #376c10; }
  .testimonial-grid figure { background: linear-gradient(140deg, #edf3fa, #fafcff); }
  .faq-list summary span:before, .faq-list summary span:after { background: var(--brand-green); }
  .cta-band { background: #070a22; border-color: #32345a; }
  .cta-route { border-color: #8ee13624; box-shadow: 0 0 0 50px #7de30905, 0 0 0 100px #7de30904, 0 0 0 150px #7de30903; }
  .contact-social { background: #f0f4fb; }
  .contact-social strong, .contact-social > span:last-child { color: var(--brand-blue); }
  .contact-card { background: linear-gradient(135deg, #eef3ff, #f9fcf7); }
  .contact-card h3 { color: #21195b; }
  .contact-card-top { color: #50694e; }
  .contact-step > span { color: #416c21; background: #e7f3d9; border-color: #d1e6bb; }
  footer { background: #10112d; }
  .footer-main .brand { width: 190px; }
  .footer-main .brand-logo { height: 75px; }
  .footer-main > div > button:hover, .footer-main > div > a:hover { color: var(--brand-green); }
  dialog { background: #11142f; border-color: #464b70; }
  .quiz-progress > span { color: #b0dc8a; }
  .quiz-progress i { background: var(--brand-green); }
  .service-choice:has(input:checked) { border-color: var(--brand-green); background: #7de3090c; }
  .quiz-finished .finish-check { background: #7de30920; color: var(--brand-green); }
  .quiz-vehicle { border-left: 2px solid var(--brand-green); padding-left: 10px; font-size: 11px; margin-top: 15px; color: #c6dea9; }

  /* Sete modelos: slides individuais, sem duplicação de conteúdo para o loop. */
  .fleet .section-heading { margin-bottom: 37px; }
  .fleet-carousel { border: 1px solid #36365e; border-radius: 13px; background: linear-gradient(125deg, #151638, #0e122b); overflow: hidden; }
  .fleet-stage { position: relative; min-width: 0; }
  .fleet-slide {
    display: grid; grid-template-columns: .86fr 1.4fr; align-items: center;
    min-height: 440px; gap: 20px; padding: 27px 27px 27px 40px;
  }
  .fleet-slide:not([hidden]) { animation: fleet-enter .45s ease both; }
  .fleet-copy { min-width: 0; padding: 12px 0; }
  .fleet-model-type { display: inline-flex; align-items: center; gap: 7px; font-size: 8px; letter-spacing: .13em; color: #b7ed8d; border: 1px solid #7de30936; border-radius: 20px; padding: 4px 10px; background: #7de30909; }
  .fleet-model-type:before { content: ''; width: 4px; height: 4px; background: var(--brand-green); border-radius: 50%; }
  .fleet-copy h3 { font-size: clamp(37px, 3.8vw, 57px); margin: 23px 0 12px; }
  .fleet-copy h3 span { color: var(--brand-green); display: block; }
  .fleet-chassis { color: #c6cce2; font-size: 10px; letter-spacing: .04em; }
  .fleet-description { font-size: 12px; line-height: 1.9; max-width: 335px; margin-top: 23px; }
  .fleet-copy .text-link { margin-top: 25px; font-size: 11px; }
  .fleet-photo { position: relative; min-width: 0; border-radius: 10px; overflow: hidden; background: #dfe6ed; border: 1px solid #ffffff1a; }
  .fleet-photo img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
  .fleet-photo figcaption { position: absolute; bottom: 11px; right: 12px; max-width: calc(100% - 24px); background: #0a123bbd; color: #f2f5fb; padding: 3px 8px; border-radius: 3px; font-size: 7px; backdrop-filter: blur(9px); }
  .fleet-photo-count { position: absolute; top: 13px; left: 14px; background: #101a3ac9; padding: 5px 9px; border-radius: 4px; color: white; font-family: var(--display); font-size: 15px; letter-spacing: .05em; }
  .fleet-bottom { display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 20px 29px; border-top: 1px solid var(--line); }
  .fleet-current-label { display: flex; align-items: center; gap: 14px; min-width: 0; }
  .fleet-counter { font: 600 22px var(--display); white-space: nowrap; color: var(--brand-green); }
  .fleet-counter span { color: #62718d; font-size: 14px; }
  .fleet-current-name { font-size: 10px; color: #a0adc3; }
  .fleet-dots { display: flex; gap: 8px; }
  .fleet-dot { width: 24px; height: 24px; display: grid; place-items: center; padding: 4px; border-radius: 4px; }
  .fleet-dot:before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #586682; transition: background .2s, width .2s; }
  .fleet-dot[aria-pressed=true]:before { background: var(--brand-green); width: 18px; border-radius: 7px; }
  .fleet-controls { display: flex; gap: 8px; align-items: center; }
  .fleet-arrow { height: 35px; width: 35px; border: 1px solid #53607c; border-radius: 5px; display: grid; place-items: center; font-size: 19px; color: #d9e4f9; transition: background .2s; }
  .fleet-arrow:hover { color: #111240; background: var(--brand-green); border-color: var(--brand-green); }
  .fleet-autoplay { display: flex; align-items: center; gap: 8px; padding: 8px 12px; font-size: 9px; color: #b3c6da; margin-right: 6px; border: 1px solid #394260; border-radius: 5px; min-height: 35px; }
  .fleet-autoplay svg { width: 11px; height: 11px; }
  .fleet-note { font-size: 9px; color: #7c8aa5; margin-top: 18px; text-align: center; }
  .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
  @keyframes fleet-enter { from { opacity: .3; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }

  @media(max-width: 1150px) {
    .brand { width: 145px; }
    .nav nav { gap: 18px; }
    .fleet-slide { padding: 25px; gap: 25px; min-height: 400px; }
    .fleet-copy h3 { font-size: 44px; }
    .fleet-copy .fleet-description { font-size: 11px; }
    .fleet-bottom { padding: 19px 24px; gap: 15px; }
    .fleet-current-name { font-size: 9px; }
    .fleet-dots { gap: 3px; }
  }
  @media(max-width: 900px) {
    .nav nav { top: 86px; background: #151346; border-bottom-color: #a8db3e44; }
    .hero-shade { background: linear-gradient(90deg, #0a1035ed, #14234ac9 34%, #101e4240 80%), linear-gradient(0deg, #090e2dd9, transparent 35%); }
    .hero-photo { background-position: 65% center; }
    .fleet-slide { grid-template-columns: .9fr 1.1fr; padding: 23px; gap: 20px; min-height: 370px; }
    .fleet-copy h3 { font-size: 39px; }
    .fleet-chassis { font-size: 9px; }
    .fleet-description { font-size: 11px; margin-top: 18px; }
    .fleet-current-name { display: none; }
    .fleet-note { font-size: 8px; }
  }
  @media(max-width: 640px) {
    .nav { height: 72px; }
    .brand { width: 118px; }
    .brand-logo { height: 54px; }
    .nav nav { top: 72px; }
    .hero-photo { background-size: auto 555px; background-position: 71% bottom; background-color: #111b43; }
    .hero-shade { background: linear-gradient(180deg, #0a1535 0%, #0a1535 38%, #0a1535c9 55%, #0a153530 73%, #080d2e33 100%); }
    .hero-content { padding-bottom: 300px; }
    .eyebrow-pill { color: #dcf5c4; font-size: 7px; }
    .footer-main .brand { width: 160px; }
    .footer-main .brand-logo { height: 61px; }
    .footer-main > div:first-child > p { margin-left: 20px; }
    .fleet-carousel { border-radius: 10px; }
    .fleet-slide { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 0; min-height: 0; }
    .fleet-photo { order: -1; border: 0; border-radius: 0; }
    .fleet-photo img { aspect-ratio: 16 / 9; object-fit: cover; }
    .fleet-photo figcaption { font-size: 6px; bottom: 8px; right: 9px; }
    .fleet-photo-count { top: 10px; left: 12px; font-size: 14px; }
    .fleet-copy { padding: 26px 24px; min-height: 321px; }
    .fleet-copy h3 { font-size: 41px; margin: 19px 0 10px; }
    .fleet-copy h3 span { display: inline; }
    .fleet-description { max-width: 100%; margin-top: 18px; font-size: 11px; }
    .fleet-copy .text-link { margin-top: 20px; }
    .fleet-bottom { flex-wrap: wrap; padding: 17px 19px; gap: 13px; }
    .fleet-current-label { order: 1; }
    .fleet-controls { order: 2; margin-left: auto; }
    .fleet-dots { order: 3; flex-basis: 100%; justify-content: center; gap: 7px; border-top: 1px solid var(--line); padding-top: 10px; }
    .fleet-autoplay { font-size: 8px; padding: 8px; margin: 0 3px 0 0; }
    .fleet-arrow { height: 33px; width: 33px; }
    .fleet-note { font-size: 8px; max-width: 300px; margin-inline: auto; line-height: 1.8; }
  }
  @media(max-width: 360px) {
    .brand { width: 101px; }
    .brand-logo { height: 47px; }
    .footer-main > div:first-child > p { display: block; margin: 12px 0 0; }
    .fleet-copy { padding: 23px 21px; min-height: 340px; }
    .fleet-copy h3 { font-size: 37px; }
    .fleet-bottom { padding: 14px; gap: 8px; }
    .fleet-counter { font-size: 20px; }
    .fleet-arrow { width: 30px; height: 30px; }
    .fleet-autoplay { gap: 5px; font-size: 7px; padding: 7px; }
  }
  @media(prefers-reduced-motion: reduce) {
    .fleet-slide:not([hidden]) { animation: none; }
  }
}