:root {
  --blue: #1b1ea1;
  --yellow: #fdd324;
  --paper: #f2f3f6;
  --ink: #0c1030;
  --card: #121a38;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: Poppins, Arial, sans-serif; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }

.topbar {
  position: relative; z-index: 5; height: 89px; display: flex; align-items: center; justify-content: flex-start;
  padding: 0 max(28px, calc((100vw - 1140px) / 2)); background: var(--yellow); overflow: hidden;
}
.topbar::before {
  content: ""; position: absolute; inset: 0; z-index: -1; background: var(--blue); border-radius: 60px 0;
}
.top-logo { display: block; flex: 0 0 46%; line-height: 0; }
.top-logo img { width: 258px; height: auto; }
.topbar nav { display: flex; align-items: center; gap: 19px; color: #fff; font-weight: 700; font-size: 14px; }
.topbar nav i { opacity: .36; font-style: normal; }
.topbar nav a:hover, .topbar nav a:focus-visible { color: var(--yellow); }
.topbar nav .ma-notification-bell { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 36px; height: 36px; border: 1px solid rgba(255, 211, 36, .78); border-radius: 50%; color: var(--yellow); background: rgba(255, 255, 255, .08); }
.topbar nav .ma-notification-bell svg { display: block; width: 20px; height: 20px; }
.topbar nav .ma-notification-bell:hover, .topbar nav .ma-notification-bell:focus-visible, .topbar nav .ma-notification-bell[aria-current="page"] { color: #102d79; background: var(--yellow); }
.topbar nav .ma-notification-bell:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

.hero-carousel { position: relative; width: min(1500px, calc(100% - 20px)); margin: 10px auto 0; overflow: hidden; background: #d9dbe0; }
.hero-track { display: flex; width: 100%; transform: translate3d(-100%, 0, 0); transition: transform 1.6s cubic-bezier(.22, .61, .36, 1); will-change: transform; }
.hero-track img { display: block; flex: 0 0 100%; width: 100%; min-width: 0; aspect-ratio: 30 / 7; object-fit: cover; }
.hero-nav { position: absolute; top: 50%; z-index: 1; width: 38px; height: 38px; border: 0; border-radius: 50%; color: #fff; background: rgba(27, 30, 161, .75); cursor: pointer; transform: translateY(-50%); font-size: 31px; line-height: 30px; }
.hero-nav:hover { background: var(--blue); }
.hero-nav.prev { left: 20px; }
.hero-nav.next { right: 20px; }
.hero-dots { position: absolute; z-index: 1; bottom: 3px; left: 50%; display: flex; gap: 8px; transform: translateX(-50%); }
/* Bolinha de 10px, mas área de toque de 26px (recomendação de acessibilidade) */
.hero-dots { gap: 2px; }
.hero-dots button { position: relative; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 999px; background: transparent; cursor: pointer; }
.hero-dots button::after { content: ""; position: absolute; inset: 8px; border: 1px solid #fff; border-radius: 999px; background: transparent; box-shadow: 0 0 3px rgba(0,0,0,.35); }
.hero-dots button.active::after { background: #fff; }

.finder-area { padding: 50px 20px 66px; background: var(--paper); }
.finder-card {
  position: relative; width: min(100%, 570px); margin: 0 auto; padding: 38px 42px 34px; overflow: hidden; border-radius: 21px;
  color: #fff; text-align: center; background: linear-gradient(145deg, #202b4e, #080d22 70%); box-shadow: 0 20px 35px rgba(11, 16, 45, .22);
}
.finder-card::before { content: ""; position: absolute; inset: 14px; border: 1px solid rgba(255,255,255,.11); border-radius: 18px; pointer-events: none; }
.finder-card > * { position: relative; }
.theme-switch {
  position: absolute; top: 18px; right: 19px; display: inline-flex; align-items: center; gap: 5px; padding: 8px 14px;
  border: 1px solid rgba(255,255,255,.22); border-radius: 99px; color: inherit; background: rgba(255,255,255,.08); cursor: pointer; font-size: 12px; font-weight: 700;
}
.finder-brand { display: flex; align-items: center; justify-content: center; min-height: 39px; margin-bottom: 22px; }
.finder-brand img { width: 190px; height: auto; filter: brightness(0) invert(1); }
.finder-brand span { display: none; }
.finder-card h1 { margin: 0; font-size: clamp(28px, 4vw, 39px); line-height: 1.14; font-weight: 700; }
.finder-card h1 strong { color: var(--yellow); }
.finder-card > p { margin: 7px 0 23px; font-size: 16px; }
.category-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-bottom: 16px; }
.category-links a { padding: 11px 7px; border: 1px solid rgba(255,255,255,.25); border-radius: 9px; font-size: 13px; font-weight: 600; }
.category-links a:hover, .category-links a:focus-visible { border-color: var(--yellow); color: var(--yellow); }
.search-box { display: grid; grid-template-columns: minmax(0, 1fr) auto; overflow: hidden; border-radius: 9px; background: #fff; box-shadow: 0 6px 0 rgba(81, 124, 183, .25); }
.search-box label { display: flex; min-width: 0; align-items: center; gap: 8px; padding: 0 13px; color: var(--blue); text-align: left; }
.search-box input { width: 100%; height: 50px; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 13px; }
.search-box input::placeholder { color: #7888aa; }
.search-box button { padding: 0 16px; border: 0; color: #151b2e; background: var(--yellow); cursor: pointer; font-size: 13px; font-weight: 700; }
.search-box button:hover { background: #ffd946; }
.finder-card .support { margin: 24px 0 10px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.17); font-size: 13px; }
.support a { color: #36d9ef; font-weight: 700; }
.finder-card small { color: #d8def2; font-size: 11px; }
.finder-card.light { color: #0d3185; background: linear-gradient(145deg, #fff, #edf7ff); }
.finder-card.light::before { border-color: #d9e9ff; }
.finder-card.light .finder-brand img { filter: none; }
.finder-card.light .theme-switch { border-color: #b5d5ff; background: white; }
.finder-card.light .category-links a { border-color: #bad8ff; }
.finder-card.light .finder-card .support, .finder-card.light .support { border-color: #c6ddf7; }
.finder-card.light small { color: #274f99; }

.showcase { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; width: min(1270px, calc(100% - 40px)); margin: 62px auto 75px; }
.pro-card, .invite-card { position: relative; min-height: 315px; overflow: hidden; border-radius: 4px; background: var(--card); box-shadow: 0 7px 15px rgba(10,16,35,.16); }
.photo-slider { position: relative; overflow: hidden; aspect-ratio: 1 / .84; background: #e4e6e8; }
.photo-slider .slides { display: flex; height: 100%; transition: transform .35s ease; }
.photo-slider img { flex: 0 0 100%; width: 100%; height: 100%; object-fit: cover; }
.photo-prev, .photo-next { position: absolute; top: 48%; display: grid; place-items: center; width: 25px; height: 25px; padding: 0; border: 0; border-radius: 50%; color: #fff; background: rgba(0,0,0,.48); cursor: pointer; font-size: 13px; }
.photo-prev { left: 8px; }
.photo-next { right: 8px; }
.photo-dots { position: absolute; bottom: 8px; left: 50%; display: flex; gap: 4px; transform: translateX(-50%); }
.photo-dots i { display: block; width: 5px; height: 5px; border-radius: 50%; background: rgba(255,255,255,.55); }
.photo-dots i.active { background: #fff; }
.pro-info { padding: 14px 15px 15px; color: #fff; }
.pro-info h2 { margin: 0; font-size: 16px; font-weight: 600; }
.pro-info p { margin: 6px 0 12px; color: var(--yellow); font-size: 13px; }
.pro-info p.new { color: #d9e1f3; }
.profile-lock { width: 100%; padding: 9px; border: 1px solid var(--yellow); border-radius: 3px; color: #15182d; background: var(--yellow); cursor: pointer; font-size: 12px; font-weight: 700; }
.locked-layer { position: absolute; inset: 0; display: none; place-content: center; gap: 10px; padding: 25px; color: #fff; text-align: center; background: rgba(8, 12, 28, .94); }
.locked-layer.open { display: grid; }
.locked-layer span { font-size: 31px; }
.locked-layer h3 { margin: 0; font-size: 21px; }
.locked-layer a, .locked-layer button { min-width: 150px; padding: 8px 12px; border: 1px solid var(--yellow); border-radius: 3px; color: #10152c; background: var(--yellow); font-weight: 700; }
.locked-layer a + a { color: #fff; background: transparent; }
.locked-layer button { border: 0; color: #fff; background: transparent; cursor: pointer; font-weight: 500; }
.invite-card { display: grid; place-content: center; padding: 24px; color: #fff; text-align: center; background: #15255b; }
.invite-card::before { content: ""; position: absolute; inset: 9px; border: 1px dashed rgba(253,211,36,.62); border-radius: 4px; }
.invite-card > * { position: relative; }
.invite-card .star { color: var(--yellow); font-size: 27px; }
.invite-card h2 { margin: 9px 0 8px; color: var(--yellow); font-size: 18px; }
.invite-card p { margin: 0; color: #e4eaff; font-size: 12px; line-height: 1.65; }
.invite-card:hover { transform: translateY(-2px); background: #1b3175; }

.image-story { width: 100%; max-width: none; margin: 0; overflow: hidden; background: #236ca5; }
.story-inner { width: min(100%, 1280px); margin: 0 auto; padding: 48px clamp(18px, 4vw, 52px) 32px; }
.story-row { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; }
.story-row + .story-row { margin-top: clamp(-52px, -4vw, -20px); }
.story-photo { position: relative; z-index: 2; display: block; grid-column: 1; grid-row: 1; justify-self: center; width: min(100%, 540px); height: auto; aspect-ratio: 1; object-fit: contain; }
.story-pattern { position: relative; z-index: 1; display: block; grid-column: 2; grid-row: 1; justify-self: start; width: min(100%, 500px); height: auto; opacity: .36; transform: translate(calc(-1 * clamp(40px, 11vw, 145px)), -16%); }
.story-row:nth-child(even) .story-photo { grid-column: 2; }
.story-row:nth-child(even) .story-pattern { grid-column: 1; justify-self: end; transform: translate(clamp(40px, 11vw, 145px), -16%) scaleX(-1); }

.site-footer { padding: 54px 24px 20px; border-top: 1px solid var(--yellow); color: #fff; background: var(--blue); }
.footer-grid { display: grid; grid-template-columns: 1.05fr 1fr .8fr 1.45fr; gap: 55px; width: min(1140px, 100%); margin: 0 auto; }
.footer-grid section { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.footer-grid h2 { margin: 0 0 11px; font-size: 23px; line-height: 1.2; }
.footer-grid a, .footer-grid p { margin: 0; font-size: 14px; }
.footer-grid a:hover { color: var(--yellow); }
.support-col img { width: 163px; height: auto; margin-top: 8px; }
.support-col > a { margin-top: 4px; font-size: 19px; }
.copyright { width: min(1140px, 100%); margin: 58px auto 0; padding-top: 20px; border-top: 1px solid var(--yellow); color: #6aa2ff; text-align: center; font-size: 18px; }

#app-view { min-height: 620px; padding: 72px 20px 82px; background: var(--paper); }
.route-layout { display: grid; grid-template-columns: minmax(310px, 520px) minmax(270px, 450px); align-items: center; justify-content: center; gap: 48px; max-width: 1110px; margin: 0 auto; }
.auth-panel, .route-message { position: relative; padding: 37px 40px; overflow: hidden; border-radius: 25px; color: #fff; text-align: center; background: linear-gradient(145deg,#202948,#090e24); box-shadow: 0 21px 35px rgba(11,16,45,.22); }
.auth-panel::before { content: ""; position: absolute; inset: 18px; border: 1px solid rgba(255,255,255,.12); border-radius: 28px; pointer-events: none; }
.auth-panel > *, .route-message > * { position: relative; }
.route-logo { width: 176px; filter: brightness(0) invert(1); }
.auth-icon { display: grid; place-items: center; width: 72px; height: 72px; margin: 0 auto 14px; border-radius: 25px; background: var(--yellow); font-size: 35px; }
.auth-panel h1, .route-message h1 { margin: 0; font-size: 30px; line-height: 1.15; }
.auth-panel > p { margin: 9px 0 20px; color: #c3cce1; font-size: 13px; }
.auth-form { display: grid; gap: 12px; text-align: left; }
.auth-form label { display: grid; gap: 5px; color: #e0e7f6; font-size: 12px; font-weight: 600; }
.auth-form input { height: 40px; padding: 0 13px; border: 1px solid #64708c; border-radius: 2px; outline: 0; color: #11162a; background: #e9f1ff; }
.auth-form input:focus { box-shadow: 0 0 0 2px rgba(253,211,36,.55); }
.auth-action { width: 100%; margin-top: 12px; padding: 14px; border: 0; border-radius: 13px; color: #141824; background: linear-gradient(110deg,#ffd324,#ffa500); box-shadow: 0 9px 17px rgba(253,211,36,.22); cursor: pointer; font-weight: 700; }
.auth-action.alt { color: #fff; background: #3c53b9; box-shadow: none; }
.auth-panel .small-link { display: block; margin-top: 16px; color: #aebbd6; font-size: 12px; }
.auth-panel .small-link a { color: var(--yellow); font-weight: 700; }
.auth-visual { position: relative; min-height: 570px; overflow: hidden; border-radius: 10px; box-shadow: 0 9px 18px rgba(0,0,0,.25); }
.auth-visual img { width: 100%; height: 100%; object-fit: cover; }
.auth-visual p { position: absolute; right: 0; bottom: 64px; left: 0; margin: 0; padding: 12px; color: #fff; background: rgba(0,0,0,.55); text-align: center; font-size: 24px; line-height: 1.45; }
.account-choice .auth-panel { max-width: 650px; }
.choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 30px; }
.choice { padding: 28px 22px 34px; border: 1px solid rgba(255,255,255,.12); border-radius: 25px; background: rgba(255,255,255,.04); }
.choice .auth-icon { width: 82px; height: 82px; margin-bottom: 20px; background: #303750; font-size: 39px; }
.choice h2 { margin: 0; font-size: 22px; }
.choice p { min-height: 61px; color: #d1d8e8; font-size: 12px; line-height: 1.65; }
.choice a { display: block; padding: 13px; border-radius: 13px; color: #fff; background: #3b50b4; font-size: 14px; font-weight: 700; }
.choice.pro a { color: #171b2d; background: var(--yellow); }
.route-message { max-width: 580px; margin: 0 auto; }
.route-message p { color: #d4def0; }
.route-message a { display: inline-block; margin: 6px; padding: 10px 20px; border-radius: 5px; color: #11162b; background: var(--yellow); font-weight: 700; }
.route-message a.secondary { color: #fff; background: #3b50b4; }
.login-options { display: flex; justify-content: space-between; align-items: center; color: #cbd4e8; font-size: 11px; }
.login-options input { width: auto; height: auto; }

@media (max-width: 850px) {
  .hero-nav { display: none; }
  .finder-area { padding: 32px 16px 46px; }
  .showcase { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; width: min(600px, calc(100% - 28px)); margin: 38px auto 46px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 35px 24px; }
  .route-layout { grid-template-columns: 1fr; gap: 30px; }
  .auth-visual { min-height: 430px; max-width: 450px; width: 100%; margin: 0 auto; }
  .route-layout.account-choice .auth-visual { order: -1; }
}
@media (max-width: 520px) {
  .topbar { height: 75px; padding: 0 18px; }
  .topbar::before { border-radius: 42px 0; }
  .top-logo { flex-basis: auto; margin-right: auto; }
  .top-logo img { width: 128px; }
  .topbar nav { gap: 9px; font-size: 10px; }
  .topbar nav .ma-notification-bell { width: 30px; height: 30px; }
  .topbar nav .ma-notification-bell svg { width: 17px; height: 17px; }
  .topbar nav i { display: none; }
  .topbar nav a:nth-of-type(1) { display: none; }
  .hero-carousel { width: 100%; margin-top: 0; }
  .hero-track img { aspect-ratio: 2.3 / 1; object-position: center; }
  .finder-card { padding: 35px 18px 27px; border-radius: 16px; }
  .finder-card h1 { padding-top: 15px; }
  .finder-brand { margin-bottom: 13px; }
  .finder-brand img { width: 159px; }
  .category-links { grid-template-columns: 1fr; }
  .category-links a { padding: 8px; }
  .search-box { grid-template-columns: 1fr; }
  .search-box button { height: 44px; }
  .showcase { grid-template-columns: 1fr; width: min(320px, calc(100% - 36px)); }
  .story-inner { padding: 20px 12px 24px; }
  .story-row { display: block; }
  .story-row + .story-row { margin-top: -16px; }
  .story-photo { width: min(100%, 540px); margin: 0 auto; }
  .story-pattern { position: absolute; top: 15%; right: -8%; width: 76%; opacity: .22; transform: none; }
  .story-row:nth-child(even) .story-pattern { right: auto; left: -8%; transform: scaleX(-1); }
  .footer-grid { grid-template-columns: 1fr; gap: 30px; }
  .copyright { margin-top: 35px; font-size: 13px; }
  #app-view { padding: 38px 16px 48px; }
  .auth-panel { padding: 31px 21px; border-radius: 19px; }
  .auth-panel h1 { font-size: 26px; }
  .choice-grid { grid-template-columns: 1fr; }
  .choice { padding: 24px 18px; }
  .auth-visual { min-height: 380px; }
  .auth-visual p { bottom: 42px; font-size: 19px; }
}

/* Ajustes de navegação e acabamento da página independente. */
.topbar { justify-content: space-between; }
.top-logo { flex-basis: auto; }
@media (min-width: 851px) {
  .topbar { justify-content: flex-start; padding-inline: max(60px, calc((100vw - 1140px) / 2)); }
  .top-logo { flex: 0 0 45%; }
}
.hero-carousel { border-radius: 4px; }
.finder-area { padding-top: 64px; }
.showcase { align-items: stretch; }
.pro-card, .invite-card { border-radius: 8px; }
.invite-card::before { border-radius: 5px; }
.photo-slider { aspect-ratio: 1 / 1; }
.image-story { box-shadow: 0 8px 30px rgba(10,16,35,.12); }
.site-footer { margin-top: 0; }
.topbar nav a, .category-links a, .profile-lock, .invite-card { transition: color .18s ease, background .18s ease, transform .18s ease; }
@media (max-width: 850px) { .topbar { justify-content: space-between; } }

/* Novo painel de busca da home: tema escuro inicial com opção azul clara. */
.home-finder-area { padding: 22px 20px 26px; background: var(--paper); }
.home-panel {
  --hp-bg:#08266b; --hp-bg2:#0d45b5; --hp-line:rgba(76,160,255,.58); --hp-ink:#0c245f; --hp-muted:#bfcee8;
  position:relative; isolation:isolate; width:min(100%,820px); min-height:370px; margin:0 auto; overflow:hidden;
  padding:19px clamp(20px,3.4vw,38px) 16px; border:1px solid rgba(111,177,255,.35); border-radius:23px;
  color:#eef5ff; background:linear-gradient(128deg,var(--hp-bg) 0%,#082f8e 52%,var(--hp-bg2) 100%);
  box-shadow:0 28px 68px rgba(22,76,154,.24),inset 0 0 0 1px rgba(255,255,255,.08); transition:background .28s ease,color .28s ease;
}
.home-panel::before,.home-panel::after { content:""; position:absolute; z-index:-1; pointer-events:none; }
.home-panel::before { width:880px; height:480px; top:-325px; right:-80px; border:1px solid rgba(86,162,255,.16); border-radius:45%; transform:rotate(-15deg); box-shadow:0 0 0 55px rgba(27,103,224,.07),0 0 0 112px rgba(27,103,224,.045); }
.home-panel::after { right:-160px; bottom:-308px; width:920px; height:510px; border:1px solid rgba(76,162,255,.32); border-radius:50%; background:linear-gradient(165deg,transparent 35%,rgba(14,91,218,.18)); transform:rotate(-7deg); box-shadow:0 -26px 0 -25px rgba(42,139,255,.35),0 -83px 0 -82px rgba(42,139,255,.23); }
.home-panel-head { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.home-panel-brand { display:flex; align-items:center; gap:12px; min-width:0; color:#f5f8ff; text-decoration:none; }
.home-panel-mark { flex:none; width:54px; height:54px; display:grid; place-items:center; border:1px solid #2583f8; border-radius:14px; background:linear-gradient(145deg,#1374ed,#07266f); box-shadow:0 8px 22px rgba(0,10,58,.24); font-size:28px; }
.home-panel-brand-copy strong { display:block; font-size:clamp(16px,2vw,24px); letter-spacing:-.04em; white-space:nowrap; }
.home-panel-brand-copy strong span { font-weight:500; }
.home-panel-brand-copy small { display:block; margin-top:5px; color:#c8d9f8; font-size:10px; letter-spacing:.2em; }
.home-theme-button { display:inline-flex; align-items:center; gap:10px; min-width:145px; justify-content:center; padding:12px 17px; border:1px solid rgba(127,185,255,.55); border-radius:999px; color:#fff; background:rgba(11,70,177,.72); box-shadow:0 7px 18px rgba(0,13,67,.18); cursor:pointer; font-weight:700; }
.home-theme-sun { color:var(--yellow); font-size:18px; }
.home-theme-chevron { color:#b5d2ff; font-size:13px; }
.home-panel-content { width:min(100%,670px); margin:16px auto 34px; }
.home-panel-eyebrow { display:flex; align-items:center; gap:16px; color:#bbd1f7; font-size:12px; font-weight:600; letter-spacing:.36em; }
.home-panel-eyebrow::after { content:""; width:60px; height:1px; background:#87b7ff; }
.home-panel-content h1 { margin:7px 0 3px; color:#fff; font-size:clamp(34px,4vw,46px); line-height:1; letter-spacing:-.055em; font-weight:800; }
.home-panel-content h1 span { color:var(--yellow); }
.home-panel-subtitle { margin:6px 0 12px; color:#e1ebff; font-size:clamp(13px,1.35vw,16px); letter-spacing:-.025em; }
.home-client-guidance { margin:10px 0 13px; padding:9px 12px; border:1px solid rgba(255,218,91,.62); border-radius:11px; background:rgba(255,216,66,.12); color:#fff5ce; font-size:12px; line-height:1.45; }
.home-client-guidance[hidden] { display:none; }
.home-client-guidance a { color:#fff0a8; font-weight:800; text-decoration:underline; }
.home-categories { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; }
.home-category { min-height:40px; display:flex; align-items:center; justify-content:center; gap:8px; padding:7px 9px; border:1px solid var(--hp-line); border-radius:15px; color:#edf5ff; background:rgba(7,45,129,.55); cursor:pointer; font-size:12px; transition:transform .16s ease,background .16s ease,border-color .16s ease; }
.home-category:hover { transform:translateY(-2px); border-color:#66b8ff; }
.home-category svg { flex:none; width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.home-category.active { border-color:#ffe54b; color:#123477; background:linear-gradient(110deg,#ffe33d,#ffc900); box-shadow:0 7px 18px rgba(255,210,0,.16); font-weight:800; }
.home-search { display:grid; grid-template-columns:minmax(0,1fr) 145px; gap:6px; margin-top:13px; padding:6px; border:1px solid rgba(93,163,255,.75); border-radius:18px; background:rgba(13,76,187,.64); box-shadow:0 0 0 4px rgba(30,113,234,.15),0 10px 22px rgba(0,14,73,.16); }
.home-search-field { min-width:0; display:flex; align-items:center; gap:16px; padding:0 20px; border-radius:15px; color:#142e70; background:#f7faff; }
.home-search-field svg { flex:none; width:23px; height:23px; fill:none; stroke:currentColor; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.home-search-field input { width:100%; height:35px; border:0; outline:0; color:var(--hp-ink); background:transparent; font-size:14px; }
.home-search-field input::placeholder { color:#7186b2; opacity:1; }
.home-search-submit { display:flex; align-items:center; justify-content:center; gap:8px; min-height:35px; border:0; border-radius:11px; color:#132f73; background:linear-gradient(115deg,#ffe348,#ffca13); box-shadow:0 8px 16px rgba(255,194,0,.2); cursor:pointer; font-weight:800; font-size:14px; }
.home-search-submit:hover { filter:brightness(1.05); }
.home-search-submit span { font-size:23px; line-height:1; }
.home-panel-benefits { display:grid; grid-template-columns:1fr 1fr; gap:18px; width:min(100%,610px); margin:12px auto 0; padding-top:10px; border-top:1px solid rgba(100,166,255,.4); }
.home-benefit { display:flex; align-items:center; gap:15px; min-width:0; }
.home-benefit + .home-benefit { padding-left:32px; border-left:1px solid rgba(114,174,255,.52); }
.home-benefit-icon { flex:none; width:34px; height:34px; display:grid; place-items:center; border:1px solid rgba(63,145,255,.7); border-radius:50%; color:#fff; background:linear-gradient(145deg,#1454a8,#071d61); box-shadow:inset 0 0 0 4px rgba(70,147,255,.1); }
.home-benefit-icon svg { display:block; width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.home-benefit p { margin:0; color:#dce8ff; font-size:12px; line-height:1.4; }
.home-benefit a { display:block; color:#42d8f6; font-weight:700; text-decoration:none; }
.home-benefit a:hover { text-decoration:underline; }
.home-benefit-sub { display:block; color:#b8cbe9; }
.home-panel-foot { position:absolute; right:36px; bottom:23px; left:36px; display:flex; align-items:end; justify-content:space-between; pointer-events:none; }
.home-panel-foot > span { color:#d3e2ff; font-size:10px; line-height:1.9; letter-spacing:.34em; }
.home-panel-foot > span::before { content:""; display:block; width:28px; height:3px; margin-bottom:8px; background:var(--yellow); }
.home-panel-foot em { max-width:130px; color:#dceaff; font-family:cursive; font-size:14px; line-height:1.15; text-align:right; transform:rotate(-9deg); }
.home-panel[data-theme="light"] { --hp-bg:#f5faff; --hp-bg2:#e4f0ff; --hp-line:#b8d2ff; --hp-ink:#102b72; color:#102b72; border-color:#fff; background:linear-gradient(130deg,#f7fbff 0%,#edf6ff 55%,#deedff 100%); box-shadow:0 25px 60px rgba(37,94,174,.18),inset 0 0 0 1px #fff; }
.home-panel[data-theme="light"]::before { border-color:rgba(75,150,255,.17); box-shadow:0 0 0 55px rgba(49,121,222,.05),0 0 0 112px rgba(49,121,222,.035); }
.home-panel[data-theme="light"]::after { border-color:rgba(58,133,241,.18); background:linear-gradient(165deg,transparent 35%,rgba(50,126,234,.1)); box-shadow:0 -26px 0 -25px rgba(42,139,255,.2),0 -83px 0 -82px rgba(42,139,255,.13); }
.home-panel[data-theme="light"] .home-panel-brand { color:#092a78; }
.home-panel[data-theme="light"] .home-panel-brand-copy small { color:#627db0; }
.home-panel[data-theme="light"] .home-theme-button { border-color:#c3dcff; color:#123b9b; background:rgba(255,255,255,.84); box-shadow:0 6px 17px rgba(30,102,202,.1); }
.home-panel[data-theme="light"] .home-theme-sun { color:#1649bf; }
.home-panel[data-theme="light"] .home-theme-chevron { color:#3e6ec2; }
.home-panel[data-theme="light"] .home-panel-eyebrow { color:#5a72a2; }
.home-panel[data-theme="light"] .home-panel-eyebrow::after { background:#91b5ed; }
.home-panel[data-theme="light"] .home-panel-content h1 { color:#102b72; }
.home-panel[data-theme="light"] .home-panel-content h1 span { color:#1457d9; }
.home-panel[data-theme="light"] .home-panel-subtitle { color:#173c92; }
.home-panel[data-theme="light"] .home-client-guidance { border-color:#adcbff; background:#e8f2ff; color:#173c92; }
.home-panel[data-theme="light"] .home-client-guidance a { color:#064ac2; }
.home-panel[data-theme="light"] .home-category { border-color:#b8d2ff; color:#16377d; background:rgba(255,255,255,.78); }
.home-panel[data-theme="light"] .home-category.active { border-color:#1b65e9; color:#fff; background:linear-gradient(120deg,#2f7dff,#0749d5); box-shadow:0 7px 17px rgba(11,75,200,.2); }
.home-panel[data-theme="light"] .home-search { border-color:#c5dcff; background:rgba(255,255,255,.85); box-shadow:0 0 0 5px rgba(83,152,255,.08),0 13px 28px rgba(44,98,174,.1); }
.home-panel[data-theme="light"] .home-search-field { border:1px solid #e1ecff; }
.home-panel[data-theme="light"] .home-search-field svg { color:#1554ca; }
.home-panel[data-theme="light"] .home-search-submit { color:#fff; background:linear-gradient(115deg,#2678ff,#0649d2); box-shadow:0 8px 16px rgba(14,80,199,.2); }
.home-panel[data-theme="light"] .home-panel-benefits { border-color:#c4daf8; }
.home-panel[data-theme="light"] .home-benefit + .home-benefit { border-color:#b7d0f4; }
.home-panel[data-theme="light"] .home-benefit-icon { border-color:#bfd8ff; color:#1649bb; background:linear-gradient(145deg,#fff,#e9f3ff); box-shadow:inset 0 0 0 5px rgba(70,147,255,.06); }
.home-panel[data-theme="light"] .home-benefit p { color:#193878; }
.home-panel[data-theme="light"] .home-benefit a { color:#0756cf; }
.home-panel[data-theme="light"] .home-benefit-sub { color:#647ba5; }
.home-panel[data-theme="light"] .home-panel-foot > span,.home-panel[data-theme="light"] .home-panel-foot em { color:#274b8c; }

/* O mesmo painel compacto também envolve cadastro, login e mensagens. */
.auth-panel, .route-message {
  border:1px solid rgba(111,177,255,.4); border-radius:22px; color:#eef5ff;
  background:linear-gradient(128deg,#071e59 0%,#082b79 50%,#1048ac 100%);
  box-shadow:0 20px 48px rgba(10,53,129,.2),inset 0 0 0 1px rgba(255,255,255,.06);
}
.auth-panel { padding:26px clamp(20px,3vw,34px); text-align:left; }
.auth-panel::before { inset:10px; border-color:rgba(116,177,255,.2); border-radius:16px; }
.auth-panel > *,.route-message > * { position:relative; }
.auth-panel h1,.route-message h1 { color:#fff; font-size:clamp(25px,3.5vw,36px); }
.auth-panel > p,.route-message p { color:#d6e5ff; }
.auth-panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 22px; padding:0 0 14px; border-bottom:1px solid rgba(117,175,255,.35); }
.auth-panel-brand { display:flex; align-items:center; gap:10px; color:#f5f8ff; }
.auth-panel-brand-mark { display:grid; place-items:center; width:44px; height:44px; border:1px solid #2583f8; border-radius:12px; background:linear-gradient(145deg,#1374ed,#07266f); font-size:23px; }
.auth-panel-brand-copy strong { display:block; font-size:clamp(14px,2vw,19px); letter-spacing:-.035em; }
.auth-panel-brand-copy small { display:block; margin-top:3px; color:#c8d9f8; font-size:8px; letter-spacing:.14em; }
.auth-panel .theme-switch,.route-message .theme-switch { position:static; flex:none; padding:8px 12px; border-color:rgba(127,185,255,.55); color:#fff; background:rgba(11,70,177,.72); }
.route-message-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 22px; padding:0 0 14px; border-bottom:1px solid rgba(117,175,255,.35); text-align:left; }
.route-message-brand { display:flex; align-items:center; gap:10px; color:#f5f8ff; }
.route-message-brand .auth-panel-brand-copy { display:block; }
.auth-form label { color:#e5efff; }
.auth-form input:not([type=checkbox]) { height:42px; border:1px solid #c9dbf5; border-radius:10px; background:#f8fbff; }
.auth-action,.choice a,.route-message a { border:1px solid #ffe159; border-radius:12px; color:#102b60; background:linear-gradient(120deg,#ffe44a,#ffc915); }
.choice { border-color:rgba(105,171,255,.4); border-radius:16px; background:rgba(5,34,100,.5); }
.choice h2 { color:#f2f7ff; }
.choice p,.auth-panel .small-link { color:#d2e2ff; }
.choice .auth-icon { background:linear-gradient(145deg,#1454a8,#071d61); }
.choice.pro a,.route-message a.secondary { border-color:rgba(94,163,255,.65); color:#edf5ff; background:rgba(7,45,129,.72); }
.auth-panel.light,.route-message.light { border-color:#c7dcfb; color:#102b72; background:linear-gradient(130deg,#f7fbff 0%,#edf6ff 55%,#deedff 100%); box-shadow:0 17px 40px rgba(37,94,174,.15),inset 0 0 0 1px #fff; }
.auth-panel.light::before { border-color:#c7dcfb; }
.auth-panel.light :is(h1,h2,label),.route-message.light h1 { color:#102b72; }
.auth-panel.light > p,.auth-panel.light .auth-form label,.auth-panel.light .small-link,.route-message.light p { color:#36558f; }
.auth-panel.light .auth-panel-head { border-color:#c6daf5; }
.auth-panel.light .auth-panel-brand { color:#092a78; }
.auth-panel.light .auth-panel-brand-copy small { color:#627db0; }
.auth-panel.light .theme-switch,.route-message.light .theme-switch { border-color:#c3dcff; color:#123b9b; background:#fff; }
.route-message.light .route-message-head { border-color:#c6daf5; }
.route-message.light .route-message-brand { color:#092a78; }
.auth-panel.light .choice { border-color:#b8d2ff; background:rgba(255,255,255,.8); }
.auth-panel.light .choice h2 { color:#102b72; }
.auth-panel.light .choice p { color:#36558f; }
.auth-panel.light .auth-panel .small-link a,.auth-panel.light .small-link a { color:#0756cf; }
.route-message.light a.secondary { color:#fff; }
@media(max-width:760px) {
  .home-finder-area { padding:28px 12px 42px; }
  .home-panel { min-height:0; padding:20px 17px 27px; border-radius:24px; }
  .home-panel-brand { gap:9px; }
  .home-panel-mark { width:43px; height:43px; border-radius:12px; font-size:23px; }
  .home-panel-brand-copy strong { font-size:clamp(13px,3.6vw,18px); }
  .home-panel-brand-copy small { margin-top:3px; font-size:6px; letter-spacing:.06em; white-space:nowrap; }
  .home-theme-button { min-width:105px; gap:5px; padding:9px 8px; font-size:12px; white-space:nowrap; }
  .home-theme-sun { font-size:15px; }
  .home-panel-content { margin:36px auto 0; }
  .home-panel-eyebrow { font-size:10px; letter-spacing:.3em; }
  .home-panel-content h1 { max-width:300px; margin-top:12px; font-size:clamp(43px,12vw,63px); line-height:.99; }
  .home-panel-content h1 span { display:block; }
  .home-panel-subtitle { max-width:400px; margin:10px 0 22px; font-size:15px; line-height:1.45; }
  .home-categories { grid-template-columns:1fr; gap:8px; }
  .home-category { min-height:49px; justify-content:flex-start; padding:9px 17px; border-radius:14px; font-size:14px; }
  .home-category svg { width:22px; height:22px; margin-right:4px; }
  .home-search { grid-template-columns:1fr; gap:8px; margin-top:17px; padding:6px; border-radius:17px; }
  .home-search-field { min-height:50px; gap:10px; padding:0 13px; border-radius:12px; }
  .home-search-field input { height:48px; font-size:13px; }
  .home-search-submit { min-height:48px; border-radius:12px; font-size:15px; }
  .home-panel-benefits { grid-template-columns:1fr; gap:15px; width:100%; margin-top:17px; padding-top:16px; }
  .home-benefit { gap:12px; }
  .home-benefit + .home-benefit { padding:14px 0 0; border-top:1px solid rgba(114,174,255,.42); border-left:0; }
  .home-benefit-icon { width:43px; height:43px; }
  .home-benefit p { font-size:12px; line-height:1.6; }
  .home-panel-foot { position:relative; right:auto; bottom:auto; left:auto; margin-top:21px; }
  .home-panel-foot > span { font-size:8px; }
  .home-panel-foot em { font-size:12px; }
}

/* Vagas de anúncio com as cores e as curvas do painel da home. */
.invite-card {
  isolation:isolate;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end;
  min-height:315px;
  padding:20px;
  border:1px solid rgba(80,166,255,.8);
  border-radius:18px;
  color:#fff;
  text-align:left;
  text-decoration:none;
  background:radial-gradient(ellipse 115% 75% at 105% 0%,rgba(62,146,255,.64),transparent 72%),linear-gradient(145deg,#103a84,#0e60bd);
  box-shadow:0 12px 28px rgba(9,53,128,.2),inset 0 0 0 1px rgba(255,255,255,.07);
}
.invite-card::before,.invite-card::after {
  content:"";
  position:absolute;
  z-index:-1;
  pointer-events:none;
}
.invite-card::before {
  inset:auto -65% -52% 4%;
  height:75%;
  border:1px solid rgba(111,188,255,.26);
  border-radius:50%;
  transform:rotate(-17deg);
  background:rgba(4,43,127,.22);
}
.invite-card::after {
  top:-55%;
  right:-48%;
  width:95%;
  height:80%;
  border:1px solid rgba(142,198,255,.27);
  border-radius:50%;
  box-shadow:0 0 0 28px rgba(90,166,255,.04);
}
.invite-card > * { position:relative; z-index:1; }
.invite-card > span:first-child {
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border:1px solid #5db0ff;
  border-radius:12px;
  background:linear-gradient(145deg,#1679e7,#0b367f);
  box-shadow:0 7px 18px rgba(2,27,81,.25);
  font-size:23px;
}
.invite-card h2 {
  margin:20px 0 7px;
  color:#fff;
  font-size:19px;
  line-height:1.15;
  letter-spacing:-.02em;
}
.invite-card p {
  margin:0;
  color:#dceaff;
  font-size:13px;
  line-height:1.45;
}
.invite-card .invite-cta {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  min-height:39px;
  box-sizing:border-box;
  margin-top:18px;
  padding:8px 12px;
  border-radius:10px;
  color:#102e6b;
  background:linear-gradient(115deg,#ffe348,#ffca13);
  box-shadow:0 6px 14px rgba(255,194,0,.18);
  font-size:13px;
  font-weight:800;
}
.invite-card:hover {
  transform:translateY(-3px);
  border-color:#b7ddff;
  background:radial-gradient(ellipse 115% 75% at 105% 0%,rgba(79,163,255,.68),transparent 72%),linear-gradient(145deg,#164895,#1370d0);
  box-shadow:0 17px 32px rgba(9,53,128,.24);
}
.invite-card:focus-visible { outline:3px solid #ffda32; outline-offset:3px; }
body.home-theme-light .invite-card {
  border-color:#bad5ff;
  color:#102b72;
  background:radial-gradient(ellipse 115% 75% at 105% 0%,#d6eaff,transparent 72%),linear-gradient(145deg,#fff,#e8f3ff);
  box-shadow:0 12px 28px rgba(37,94,174,.14);
}
body.home-theme-light .invite-card::before { border-color:rgba(81,145,235,.2); background:rgba(151,199,255,.14); }
body.home-theme-light .invite-card::after { border-color:rgba(81,145,235,.19); }
body.home-theme-light .invite-card h2 { color:#1042a0; }
body.home-theme-light .invite-card p { color:#36558f; }
body.home-theme-light .invite-card .invite-cta { color:#fff; background:linear-gradient(115deg,#2678ff,#0649d2); box-shadow:0 6px 14px rgba(14,80,199,.16); }
body.home-theme-light .invite-card:hover { border-color:#6da8ff; background:radial-gradient(ellipse 115% 75% at 105% 0%,#c9e2ff,transparent 72%),linear-gradient(145deg,#fff,#dcecff); }
@media(max-width:760px) {
  .invite-card { min-height:275px; padding:18px; }
}

/* ===== Seção da colmeia: efeitos discretos ===== */
.story-photo { transition: transform .45s cubic-bezier(.2,.7,.2,1), filter .45s ease; will-change: transform; }
.story-pattern { transition: opacity .5s ease, filter .5s ease; }
/* Reflexo de luz: mesma posição da foto, recortado no formato do hexágono (máscara com a própria imagem). */
.story-shine { position: relative; z-index: 3; display: block; grid-column: 1; grid-row: 1; justify-self: center; width: min(100%, 540px); aspect-ratio: 1; pointer-events: none; opacity: 0;
  background: linear-gradient(115deg, transparent 38%, rgba(255,255,255,.55) 49%, rgba(255,236,160,.35) 53%, transparent 62%) 160% 0 / 260% 100% no-repeat;
  -webkit-mask: var(--story-img) center / contain no-repeat; mask: var(--story-img) center / contain no-repeat;
  transition: transform .45s cubic-bezier(.2,.7,.2,1), opacity .3s ease; }
.story-row:nth-child(even) .story-shine { grid-column: 2; }
@keyframes story-shine-sweep { from { background-position: 160% 0; } to { background-position: -60% 0; } }
@media (hover: hover) and (min-width: 851px) {
  .story-row:hover .story-photo { transform: translateY(-8px) scale(1.015);
    filter: drop-shadow(0 18px 22px rgba(4,18,52,.32)) drop-shadow(0 0 16px rgba(255,222,89,.42)); }
  .story-row:hover .story-shine { opacity: 1; transform: translateY(-8px) scale(1.015); animation: story-shine-sweep 1.1s ease-out .1s both; }
  .story-row:hover .story-pattern { opacity: .52; filter: drop-shadow(0 0 8px rgba(255,222,89,.55)); }
}
/* Celular/tablet: sem mouse, o efeito acontece quando a imagem entra na tela */
@keyframes story-glow { 0% { filter: drop-shadow(0 0 0 rgba(255,222,89,0)); } 45% { filter: drop-shadow(0 10px 16px rgba(4,18,52,.28)) drop-shadow(0 0 14px rgba(255,222,89,.5)); } 100% { filter: drop-shadow(0 8px 14px rgba(4,18,52,.22)) drop-shadow(0 0 6px rgba(255,222,89,.22)); } }
@media (max-width: 850px) {
  .story-shine { position: absolute; top: 0; left: 50%; width: min(100%, 540px); transform: translateX(-50%); }
  .story-row.is-visible .story-photo { animation: story-glow 1.6s ease .35s both; }
  .story-row.is-visible .story-shine { opacity: 1; animation: story-shine-sweep 1.3s ease-out .5s both; }
}
/* Entrada suave ao rolar a página (a classe só é colocada pelo script, então sem script nada fica escondido). */
.story-row.story-reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1); }
.story-row.story-reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .story-photo, .story-pattern, .story-shine, .story-row.story-reveal { transition: none; animation: none; }
  .story-row.story-reveal { opacity: 1; transform: none; }
}

/* Slide: cada banner é um <picture>; no celular usa a arte mobile (4:3), no computador a larga (30:7) */
.hero-track picture { display: block; flex: 0 0 100%; width: 100%; min-width: 0; }
.hero-track picture img { height: auto; }
@media (max-width: 760px) { .hero-track img, .hero-track picture img { aspect-ratio: 4 / 3; object-fit: cover; } }
@media (prefers-reduced-motion: reduce) { .story-shine { display: none !important; } }
/* Celular: só 2 cards "Anuncie aqui" (os demais só aparecem na grade do computador), para não alongar a página */
@media (max-width: 760px) { .showcase > a.invite-card:nth-of-type(n+3) { display: none; } }