/* Central Técnicos — light, welcoming sections and a quieter brand header. */
:root { --ct-line: #dce9f0; --ct-soft: #f2f8fc; }
body { background: #fff; }
header.fixed { background: #ffffffed !important; box-shadow: 0 4px 28px #10365405 !important; }
header > .container { height: 116px !important; }
header > .container > a { width: 166px; justify-content: flex-start; }
header > .container > a img { width: 150px !important; height: 104px !important; object-fit: contain; border-radius: 0; background: transparent; transform: scale(1.35); }
header > .container > a > div { display: none !important; }
header nav { gap: 27px !important; }
header nav a, header nav button { font-size: 12px !important; font-weight: 600; }
header > .container > div button { height: 44px; border-radius: 10px; }
#hero { margin-top: 116px; }
section { scroll-margin-top: 132px; }
body:not(.ct-is-home) [class*='pt-24'] { padding-top: 156px; }
body:not(.ct-is-home) [class*='pt-20'] { padding-top: 146px; }
.ct-brands { background: #f7fafc !important; padding: 32px 0 36px !important; border-bottom-color: #e8f0f5; }
.ct-brands a { color: #7c8d9b !important; transition: color .2s, transform .2s; }
.ct-brands a:hover { color: #126ca8 !important; transform: translateY(-2px); }

/* Image-led service cards. */
#servicos { padding: 100px 0 84px !important; background: linear-gradient(180deg, #fff, #f5f9fc); }
#servicos > .container > div:first-child { max-width: 820px; margin-bottom: 42px; }
#servicos h2 { max-width: 780px; font-size: 42px; line-height: 1.17 !important; }
#servicos h2 span { white-space: nowrap; }
#servicos > .container > div:first-child p { max-width: 640px; font-size: 15px; margin-top: 20px; }
#servicos > .container > .grid { gap: 28px; }
#servicos > .container > .grid a { border-color: #e1ebf1; border-radius: 20px; box-shadow: 0 8px 30px #163f6010; position: relative; }
#servicos > .container > .grid a:hover { transform: translateY(-7px); border-color: #a9cde3; box-shadow: 0 18px 40px #1b56751a; }
#servicos > .container > .grid a > div:first-child { height: 224px; position: relative; }
#servicos > .container > .grid a > div:first-child::after { content: ''; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, #092d4b25); pointer-events: none; }
#servicos .grid img, #servicos .grid video { transition: transform .65s ease; }
#servicos .grid a:hover img, #servicos .grid a:hover video { transform: scale(1.045); }
#servicos > .container > .grid a > div:last-child { padding: 27px; }
#servicos h3 { font-size: 21px; margin-bottom: 12px; }
#servicos .grid p { font-size: 13px; line-height: 1.85; }
#servicos .grid a span { border-top: 1px solid #e7eef4; padding-top: 18px; font-size: 12px; color: #1176b3; text-decoration: none; }
#servicos > .container > div:last-child:not(.grid) { margin-top: 44px; padding: 28px 32px; border: 1px solid #dce9f2; border-radius: 18px; background: #eaf4fb; }
#servicos > .container > div:last-child > p { color: #254b66; font-size: 13px; margin-bottom: 16px; }
#servicos > .container > div:last-child a { background: #ffffffa6; border-color: #d4e6f2; border-radius: 8px; padding: 9px 13px; font-size: 11px; }
#servicos > .container > div:last-child a:hover { background: #fff; border-color: #73b0d4; }

/* Four connected, easy-to-scan steps. */
#como-funciona { padding: 82px 0 88px !important; background: #fff; border: 0; }
#como-funciona > .container > div:first-child { margin-bottom: 44px; }
#como-funciona > .container > div:first-child::before { content: 'DO PRIMEIRO CONTATO AO PÓS-ATENDIMENTO'; display: block; margin-bottom: 15px; color: #287aa9; font-size: 10px; font-weight: 800; letter-spacing: .13em; }
#como-funciona h2 { font-size: 38px; }
#como-funciona > .container > .grid { gap: 24px; }
#como-funciona .grid > div { padding: 29px 24px 26px; background: #f4f9fc; border: 1px solid #e2edf3; border-radius: 18px; }
#como-funciona .grid > div > div { width: 46px; height: 46px; margin-bottom: 27px; justify-content: center; background: #e1f0fa; border-radius: 13px; color: #0d73b3; }
#como-funciona .grid > div > span { width: auto; height: auto; top: 31px; right: 25px; font-size: 28px; font-weight: 700; color: #b5d0e1; }
#como-funciona h3 { font-size: 15px; margin-bottom: 11px; line-height: 1.45; }
#como-funciona .grid p { font-size: 12px; line-height: 1.85; }

/* Quote section: calm blue canvas, clear form, generous touch targets. */
#solicitar { position: relative; background: radial-gradient(ellipse at 10% 12%, #d9edf9, transparent 55%), #f0f7fb; padding: 96px 0 !important; border-block: 1px solid #e1edf5; }
#solicitar > .container { gap: 84px; grid-template-columns: .88fr 1fr; align-items: start; }
#solicitar > .container > div:first-child { top: 150px; padding-top: 28px; }
#solicitar > .container > div:first-child > span { display: inline-block; background: #dceef9; color: #17618f; border: 1px solid #c8e2f2; padding: 8px 12px; border-radius: 7px; font-size: 10px; font-weight: 700; letter-spacing: .12em; }
#solicitar h2 { max-width: 420px; margin-top: 24px; font-size: 46px; }
#solicitar > .container > div:first-child > p { color: #536b7e; font-size: 15px; max-width: 390px; line-height: 1.85; }
#solicitar form { padding: 36px; background: #fff; border-color: #e0eaf2; border-radius: 22px; box-shadow: 0 20px 65px #1b537014; }
form label { font-size: 12px !important; font-weight: 600; }
form input, form textarea, form button[role='combobox'] { border-color: #d9e5ed !important; border-radius: 9px !important; }
form input, form button[role='combobox'] { min-height: 48px; }
#solicitar form button[type='submit'], #cadastro form button[type='submit'] { height: 54px; border-radius: 10px; box-shadow: 0 7px 18px #0c72b81b; }
.ct-form-note { margin-top: 32px; padding: 24px; max-width: 390px; border: 1px solid #d4e5f0; border-radius: 16px; background: #ffffff70; }
.ct-form-note strong { font-size: 13px; }
.ct-form-note p { font-size: 12px !important; }
.ct-form-note a { font-size: 23px; }
.ct-form-note small { font-size: 11px; }

/* Regional links are readable destinations, not a wall of small text. */
.ct-regions { padding: 88px 0 !important; background: #fff !important; }
.ct-regions h2 { font-size: 39px; max-width: 720px; }
.ct-regions > .container > div:first-child > p { max-width: 900px; font-size: 14px; }
.ct-regions > .container > div:nth-child(2) { gap: 14px; margin: 34px 0 42px; }
.ct-regions > .container > div:nth-child(2) > a { padding: 20px; background: #f5f9fc; border: 1px solid #e3edf4; border-radius: 13px; transition: transform .2s, background .2s, border-color .2s; }
.ct-regions > .container > div:nth-child(2) > a:hover { transform: translateY(-3px); background: #eaf5fc; border-color: #a6cfe8; }
.ct-regions > .container > div:nth-child(2) h3 { font-size: 14px; }
.ct-regions > .container > div:nth-child(2) p { font-size: 12px; line-height: 1.75; }
.ct-regions > .container > div:nth-child(3) { gap: 22px; }
.ct-regions > .container > div:nth-child(3) > div { padding: 24px; border: 1px solid #dfeaf2 !important; border-radius: 16px; background: #fff; }
.ct-regions > .container > div:nth-child(3) h3 { font-size: 16px; }
.ct-regions > .container > div:nth-child(3) p { font-size: 12px; }
.ct-regions > .container > div:nth-child(3) svg { width: 28px; height: 28px; }
.ct-regions > .container > div:nth-child(4) { background: #f5f9fc !important; border-radius: 14px; }

/* Postal-code search. */
#atendimento-cep { padding: 54px 0 !important; background: linear-gradient(115deg, #0e3450, #126ba0) !important; color: #fff; }
#atendimento-cep h2 { font-size: 31px; color: #fff; }
#atendimento-cep h2 span { color: #a9defd; }
#atendimento-cep .text-gradient-primary { -webkit-text-fill-color: #a9defd; color: #a9defd; }
#atendimento-cep > .container > div > div:first-child > span { color: #a9defd; }
#atendimento-cep > .container > div > div:first-child > p, #atendimento-cep > .container > div > p { color: #d2e4ef; }
#atendimento-cep form input { background: #fff !important; color: #163c56; border: 0 !important; border-radius: 9px !important; }
#atendimento-cep form button { background: #ff8a36; color: #1d3346; font-weight: 700; border-radius: 9px; }
#atendimento-cep form button:hover { background: #ff9f5c; }
#atendimento-cep a { color: #d6efff; text-decoration: underline; text-underline-offset: 3px; }
#atendimento-cep .bg-green-50 { color: #166534; }
#atendimento-cep .bg-green-50 a { color: #166534; font-weight: 600; }
#atendimento-cep .bg-red-50 { color: #991b1b; }

.ct-noroeste { padding: 64px 0 !important; background: #f4f9fc !important; border: 0; }
.ct-noroeste h2 { font-size: 30px; }
.ct-noroeste h2 span { font-size: inherit; font-weight: inherit; line-height: inherit; color: #0d73b3; }
.ct-noroeste p { font-size: 13px; line-height: 1.85; }
.ct-noroeste a { min-height: 45px; border-radius: 9px; font-size: 12px; box-shadow: none; }
.ct-extra { padding: 72px 32px 82px; }
.ct-extra > h2 { font-size: 32px; margin-bottom: 30px; }
.ct-extra details { margin-top: 12px; padding-inline: 24px; border: 1px solid #dfeaf2 !important; border-radius: 13px; background: #fff; transition: background .2s, box-shadow .2s; }
.ct-extra details:hover { background: #f8fbfd; }
.ct-extra details[open] { box-shadow: 0 10px 30px #1844630a; background: #f8fbfd; }
.ct-extra summary { padding: 23px 0; font-size: 14px; }
.ct-extra summary::after { width: 29px; height: 29px; border-radius: 50%; background: #e8f3fa; color: #176f9e; display: grid; place-items: center; font-size: 21px; flex-shrink: 0; }
.ct-extra details > div { padding-top: 8px; }

/* Technician invitation, using an image already present in the original site. */
#tecnicos { padding: 86px 0 !important; position: relative; isolation: isolate; overflow: hidden; background: #0e2e47; }
#tecnicos::before { content: ''; position: absolute; inset: 0 0 0 45%; background: url('/assets/hero-mobile-BkgCaDYo.webp') center/cover; z-index: -2; }
#tecnicos::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #0e2e47 0%, #0e2e47fa 38%, #0e2e47b3 62%, #0e2e4733); z-index: -1; }
#tecnicos .max-w-3xl { max-width: 650px; margin-left: 0; text-align: left; }
#tecnicos .max-w-3xl > div:first-child { text-align: left; }
#tecnicos .max-w-3xl > div:first-child > span { color: #abdffb; font-weight: 700; }
#tecnicos h2 { font-size: 41px; max-width: 500px; margin: 18px 0 0; }
#tecnicos .max-w-3xl > div:first-child > p { max-width: 480px; margin: 20px 0 0; line-height: 1.9; }
#tecnicos .grid { grid-template-columns: 1fr; gap: 16px; margin: 28px 0 32px; }
#tecnicos .grid > div { display: flex; flex-direction: row; gap: 14px; align-items: center; text-align: left; border: 0; padding: 0; }
#tecnicos .grid svg { width: 22px; height: 22px; margin: 0; flex-shrink: 0; }
#tecnicos .grid p { max-width: none; margin: 0; font-size: 13px; }
#tecnicos button { height: 51px; padding-inline: 24px; border-radius: 9px; }
#cadastro { background: #f5f9fc; padding: 84px 0 !important; }
#cadastro > .container { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: start; }
#cadastro > .container > div:first-child { text-align: left; padding-top: 28px; }
#cadastro h2 { font-size: 40px; max-width: 380px; margin-top: 18px; }
#cadastro > .container > div:first-child > p { max-width: 340px; font-size: 14px; line-height: 1.9; margin-top: 20px; }
#cadastro form { width: 100%; max-width: none; margin: 0; padding: 34px; background: #fff; border: 1px solid #e0eaf2; border-radius: 20px; box-shadow: 0 12px 45px #1b53700c; }
#cadastro form button[type='button'] { min-height: 35px; border-radius: 7px; }
#cadastro form button[role='checkbox'] { width: 18px; height: 18px; min-height: 18px; padding: 0; border-radius: 4px; }
#cadastro form input[type='checkbox'] { width: 18px; height: 18px; min-height: 18px; flex-shrink: 0; accent-color: #0c72b8; }

/* Transparent logo stays legible on a light footer. */
footer { background: #eaf4fa !important; color: #34536b; padding: 56px 0 24px !important; border-top: 1px solid #d4e5f0; }
footer > .container > .grid { gap: 30px; }
footer img { width: 172px !important; height: 126px !important; object-fit: contain; border-radius: 0 !important; transform: scale(1.3); }
footer h3 { color: #123c59; font-size: 13px; }
footer a, footer p, footer li { color: #526c80; font-size: 11px !important; line-height: 1.9; }
footer span, footer svg { color: #526c80 !important; }
footer span { font-size: 11px; overflow-wrap: anywhere; }
footer .opacity-70, footer .opacity-50 { opacity: 1; }
footer a:hover { color: #0c72b8 !important; }
footer .border-t { border-color: #cfe1ed !important; color: #647c8f !important; font-size: 10px; }

/* Light snow: no hit testing, no canvas loop, and a pause control. */
.ct-snow { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: 35; contain: strict; }
.ct-snow > span { position: absolute; left: var(--x); top: -32px; color: #8fc5e4; width: var(--size); height: var(--size); opacity: var(--opacity); animation: ct-snowfall var(--duration) linear var(--delay) infinite; will-change: transform; }
.ct-snow svg { display: block; width: 100%; height: 100%; filter: drop-shadow(0 0 1px #fff9); }
.ct-snow[data-paused='true'] { visibility: hidden; }
.ct-snow[data-paused='true'] > span, .ct-snow[data-idle='true'] > span { animation-play-state: paused; }
.ct-snow-toggle { position: fixed; left: 22px; bottom: 24px; width: 38px; height: 38px; z-index: 45; display: grid; place-items: center; color: #4284ac; background: #ffffffe8; border: 1px solid #dbeaf3; border-radius: 50%; box-shadow: 0 3px 14px #173c4d0c; backdrop-filter: blur(8px); }
.ct-snow-toggle svg { width: 19px; height: 19px; }
.ct-snow-toggle[aria-pressed='true'] { color: #8a9ba8; background: #edf4f8; }
.ct-snow-toggle:hover { color: #0c72b8; background: #fff; }
@keyframes ct-snowfall { from { transform: translate3d(0, -30px, 0) rotate(0); } to { transform: translate3d(var(--drift), calc(100vh + 60px), 0) rotate(200deg); } }

@media (max-width: 1100px) and (min-width: 768px) {
  header nav { gap: 18px !important; }
  header > .container > a { width: 138px; }
  header > .container > a img { width: 136px !important; height: 100px !important; }
  #solicitar > .container, #cadastro > .container { gap: 42px; }
  #solicitar h2, #cadastro h2 { font-size: 37px; }
  #como-funciona > .container > .grid { gap: 14px; }
  #como-funciona .grid > div { padding: 24px 18px; }
  #como-funciona h3 { font-size: 13px; }
}
@media (max-width: 767px) {
  header > .container { height: 94px !important; }
  header > .container > a { width: 126px; }
  header > .container > a img { width: 118px !important; height: 84px !important; }
  header > .container > div button { height: 39px; }
  header > .container > div > button:last-child { width: 37px; }
  #hero { margin-top: 94px; }
  section { scroll-margin-top: 108px; }
  .ct-brands { padding: 27px 0 !important; }
  #servicos { padding: 60px 0 !important; }
  #servicos > .container > div:first-child { margin-bottom: 30px; }
  #servicos h2 { font-size: 31px; }
  #servicos > .container > div:first-child p { font-size: 13px; line-height: 1.85; }
  #servicos > .container > .grid { gap: 24px; }
  #servicos > .container > .grid a { border-radius: 17px; }
  #servicos > .container > .grid a > div:first-child { height: 220px; }
  #servicos > .container > .grid a > div:last-child { padding: 24px; }
  #servicos h3 { font-size: 22px; }
  #servicos > .container > div:last-child:not(.grid) { margin-top: 30px; padding: 24px 20px; }
  #servicos > .container > div:last-child > p { font-size: 12px; }
  #servicos > .container > div:last-child a { font-size: 10px; }
  #como-funciona { padding: 55px 0 60px !important; }
  #como-funciona > .container > div:first-child::before { font-size: 8px; line-height: 1.8; letter-spacing: .09em; }
  #como-funciona h2 { font-size: 30px; }
  #como-funciona > .container > div:first-child { margin-bottom: 30px; }
  #como-funciona > .container > .grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  #como-funciona .grid > div { padding: 20px 17px; border-radius: 15px; }
  #como-funciona .grid > div > div { width: 36px; height: 36px; border-radius: 10px; margin-bottom: 20px; }
  #como-funciona .grid > div > div svg { width: 22px; height: 22px; }
  #como-funciona .grid > div > span { top: 23px; right: 17px; font-size: 22px; }
  #como-funciona h3 { font-size: 13px; }
  #como-funciona .grid p { font-size: 11px; line-height: 1.8; }
  #solicitar { padding: 58px 0 !important; }
  #solicitar > .container { grid-template-columns: 1fr; gap: 28px; }
  #solicitar > .container > div:first-child { padding-top: 0; text-align: center; }
  #solicitar h2 { font-size: 35px; max-width: 340px; margin: 20px auto 0; }
  #solicitar > .container > div:first-child > p { font-size: 13px; margin: 18px auto 0; }
  #solicitar form, #cadastro form { padding: 24px; border-radius: 17px; }
  .ct-form-note { padding: 16px 20px; max-width: 340px; margin: 22px auto 0; }
  .ct-form-note a { font-size: 18px; }
  .ct-regions { padding: 58px 0 !important; }
  .ct-regions h2 { font-size: 31px; }
  .ct-regions > .container > div:first-child > p { font-size: 13px; }
  .ct-regions > .container > div:nth-child(2) { gap: 12px; margin: 28px 0; }
  .ct-regions > .container > div:nth-child(2) > a { padding: 17px 14px; }
  .ct-regions > .container > div:nth-child(2) h3 { font-size: 12px; }
  .ct-regions > .container > div:nth-child(2) p { font-size: 10px; }
  .ct-regions > .container > div:nth-child(3) { gap: 16px; }
  .ct-regions > .container > div:nth-child(3) > div { padding: 23px; }
  #atendimento-cep { padding: 42px 0 !important; }
  #atendimento-cep h2 { font-size: 28px; }
  #atendimento-cep > .container > div > div:first-child > p { font-size: 12px; }
  .ct-noroeste { padding: 46px 0 !important; }
  .ct-noroeste h2 { font-size: 26px; }
  .ct-noroeste p { font-size: 12px; }
  .ct-extra { padding: 50px 22px 58px; }
  .ct-extra > h2 { font-size: 27px; }
  .ct-extra details { padding-inline: 18px; }
  .ct-extra summary { font-size: 12px; gap: 14px; }
  #tecnicos { padding: 55px 0 !important; }
  #tecnicos::before { inset: 0; opacity: .22; }
  #tecnicos::after { background: linear-gradient(90deg, #0e2e47f5, #0e2e4780); }
  #tecnicos h2 { font-size: 33px; max-width: 350px; }
  #tecnicos .max-w-3xl > div:first-child > p { font-size: 13px; }
  #tecnicos .grid { gap: 19px; }
  #tecnicos .grid > div { max-width: none; margin: 0; padding: 0; }
  #tecnicos .grid p { font-size: 12px; }
  #cadastro { padding: 56px 0 !important; }
  #cadastro > .container { display: block; }
  #cadastro > .container > div:first-child { padding: 0; text-align: center; margin-bottom: 30px; }
  #cadastro h2 { font-size: 32px; margin-inline: auto; }
  #cadastro > .container > div:first-child > p { font-size: 13px; margin-inline: auto; }
  footer { padding-top: 34px !important; }
  footer img { width: 164px !important; height: 123px !important; }
  footer > .container > .grid > div:first-child > p { max-width: 390px; }
  .ct-snow > span:nth-child(n+11) { display: none; }
  .ct-snow-toggle { left: 16px; bottom: 20px; width: 34px; height: 34px; }
}
@media (max-width: 359px) {
  header > .container > a { width: 112px; }
  header > .container > a img { width: 107px !important; }
  header > .container > div button { padding-inline: 9px; }
  #como-funciona > .container > .grid { grid-template-columns: 1fr; }
  #como-funciona .grid > div { padding: 24px; }
  #como-funciona .grid p { font-size: 12px; max-width: none; }
}
@media (prefers-reduced-motion: reduce) {
  .ct-snow, .ct-snow-toggle { display: none !important; }
  #servicos .grid a:hover, .ct-regions a:hover { transform: none !important; }
  [style*='translateY'] { opacity: 1 !important; transform: none !important; }
}
