/* "Busca con IA": the search bar that drops from the header (desktop) / full-screen sheet (<= 768px), and the results UI (chips, tabs, suggestions, skeleton). */

/* ---- the header button: hidden until js/aiSearch.js says the flag allows it */
[data-ai-search-li][hidden] { display: none !important; }
html.ais-lock, html.ais-lock body { overflow: hidden; }
.ais-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ---- the bar */
.ais-backdrop { position: fixed; inset: 0; z-index: 1059; background: rgba(0, 0, 0, .45); opacity: 0; transition: opacity .2s ease; pointer-events: none; visibility: hidden; }
.ais-backdrop.ais-open { opacity: 1; pointer-events: auto; visibility: visible; }
.ais-panel {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1060; background: #fff; color: #000;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .25); transform: translateY(-105%); transition: transform .25s ease; visibility: hidden;
}
.ais-panel.ais-open { transform: translateY(0); visibility: visible; }
.ais-inner { max-width: 880px; margin: 0 auto; padding: 28px 24px 22px; position: relative; }
.ais-title { font-size: 15px; font-weight: 500; letter-spacing: .02em; margin: 0 0 12px; display: flex; align-items: center; gap: 8px; }
.ais-title img { width: 22px; height: 22px; background: #000; border-radius: 50%; padding: 3px; }
.ais-close { position: absolute; top: 14px; right: 14px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: transparent; font-size: 26px; line-height: 1; cursor: pointer; color: #000; }
.ais-close:hover { background: #f1f1f1; }
.ais-form { display: flex; gap: 10px; }
.ais-input { flex: 1 1 auto; min-width: 0; height: 58px; padding: 0 20px; font-size: 18px; border: 2px solid #000; border-radius: 30px; outline: none; background: #fff; color: #000; }
.ais-input:focus { border-color: #ff6725; box-shadow: 0 0 0 3px rgba(255, 103, 37, .25); }
.ais-submit { flex: 0 0 auto; height: 58px; padding: 0 28px; border: 0; border-radius: 30px; background: #000; color: #fff; font-weight: 500; font-size: 16px; cursor: pointer; transition: background .2s; }
.ais-submit:hover:not([disabled]) { background: #ff6725; }
.ais-submit[disabled] { opacity: .7; cursor: progress; }
.ais-examples { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; }
.ais-examples .ais-hint { font-size: 14px; color: #666; margin-right: 4px; }
.ais-example { border: 1px solid #d6d6d6; border-radius: 20px; background: #fff; padding: 7px 14px; font-size: 14px; cursor: pointer; color: #000; text-align: left; }
.ais-example:hover, .ais-example:focus-visible { border-color: #ff6725; color: #ff6725; }
.ais-note { margin: 14px 0 0; font-size: 13px; color: #666; }
.ais-msg { margin: 10px 0 0; min-height: 20px; font-size: 14px; color: #555; }
.ais-msg.ais-bad { color: #b42318; }
.ais-dots::after { content: ""; display: inline-block; width: 1.2em; text-align: left; animation: ais-dots 1.1s steps(4, end) infinite; }
@keyframes ais-dots { 0% { content: ""; } 25% { content: "."; } 50% { content: ".."; } 75% { content: "..."; } }

@media (max-width: 768px) {
  .ais-panel { top: 0; bottom: 0; height: 100%; overflow-y: auto; }
  .ais-inner { padding: 64px 16px 24px; max-width: none; }
  .ais-close { top: 10px; right: 10px; }
  .ais-form { flex-direction: column; }
  .ais-input, .ais-submit { width: 100%; height: 54px; font-size: 17px; }
  .ais-examples .ais-example { width: 100%; padding: 11px 14px; border-radius: 12px; }
  .ais-examples .ais-hint { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .ais-panel, .ais-backdrop { transition: none; } .ais-dots::after { animation: none; content: "..."; } }

/* ---- results: what we understood */
.ais-context { margin: 0 0 24px; }
.ais-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ais-label { font-weight: 500; margin-right: 2px; }
.ais-chip { display: inline-flex; align-items: center; background: #fff3ed; border: 1px solid #ffcdb6; border-radius: 20px; font-size: 14px; color: #000; }
.ais-chip button { border: 0; background: transparent; cursor: pointer; color: inherit; font: inherit; padding: 6px 8px; }
.ais-chip .ais-chip-edit { padding-left: 12px; border-radius: 20px 0 0 20px; }
.ais-chip .ais-chip-edit:hover { color: #ff6725; text-decoration: underline; }
.ais-chip .ais-chip-x { padding-right: 12px; font-size: 17px; line-height: 1; border-radius: 0 20px 20px 0; }
.ais-chip .ais-chip-x:hover { color: #b42318; }
.ais-chip.ais-chip-plain .ais-chip-edit { cursor: default; text-decoration: none; color: inherit; }
.ais-edit { margin: 12px 0 0; padding: 12px 14px; border: 1px solid #e3e3e3; border-radius: 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; background: #fafafa; }
.ais-edit select, .ais-edit input { height: 40px; border: 1px solid #bdbdbd; border-radius: 8px; padding: 0 10px; font-size: 15px; background: #fff; }
.ais-edit button { height: 40px; padding: 0 16px; border-radius: 8px; border: 1px solid #000; background: #000; color: #fff; cursor: pointer; }
.ais-edit button.ais-ghost { background: #fff; color: #000; }
.ais-notes { margin: 10px 0 0; font-size: 14px; color: #555; }
.ais-notes + .ais-notes { margin-top: 4px; }
.ais-tabs { display: flex; gap: 6px; margin: 16px 0 0; border-bottom: 1px solid #e3e3e3; }
.ais-tab { border: 0; background: transparent; padding: 10px 16px; font-size: 16px; cursor: pointer; border-bottom: 3px solid transparent; color: #444; }
.ais-tab[aria-selected="true"] { color: #000; font-weight: 500; border-bottom-color: #ff6725; }
.ais-tab:hover { color: #ff6725; }

/* ---- zero / few results: real alternatives */
.ais-relax { margin: 0 0 24px; padding: 16px 18px; border: 1px solid #ffcdb6; border-radius: 14px; background: #fff8f4; }
.ais-relax p { margin: 0 0 10px; font-weight: 500; }
.ais-relax-list { display: flex; flex-wrap: wrap; gap: 8px; }
.ais-relax-btn { border: 1px solid #000; background: #fff; border-radius: 22px; padding: 9px 16px; cursor: pointer; font-size: 15px; color: #000; text-align: left; }
.ais-relax-btn:hover, .ais-relax-btn:focus-visible { background: #000; color: #fff; }
.ais-relax-btn b { font-weight: 500; margin-left: 6px; opacity: .75; }

/* ---- loading and errors */
.ais-skeleton { display: grid; gap: 20px; margin: 0 0 24px; }
.ais-skel-card { display: flex; gap: 16px; border: 1px solid #ececec; border-radius: 14px; padding: 14px; }
.ais-skel-img, .ais-skel-line { background: linear-gradient(90deg, #efefef 25%, #f8f8f8 37%, #efefef 63%); background-size: 400% 100%; animation: ais-shimmer 1.3s ease infinite; border-radius: 10px; }
.ais-skel-img { flex: 0 0 38%; min-height: 150px; }
.ais-skel-body { flex: 1 1 auto; display: grid; gap: 10px; align-content: center; }
.ais-skel-line { height: 14px; }
.ais-skel-line.ais-w60 { width: 60%; } .ais-skel-line.ais-w40 { width: 40%; } .ais-skel-line.ais-w80 { width: 80%; }
@keyframes ais-shimmer { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }
@media (prefers-reduced-motion: reduce) { .ais-skel-img, .ais-skel-line { animation: none; } }
.ais-hide { display: none !important; }
.ais-err { margin: 0 0 24px; padding: 16px 18px; border: 1px solid #f1b5ae; border-radius: 14px; background: #fff5f4; color: #7a1f16; }
.ais-err button { margin-left: 10px; border: 1px solid #7a1f16; background: #fff; color: #7a1f16; border-radius: 8px; padding: 6px 14px; cursor: pointer; }

/* ---- the projects tab */
.ais-projects { display: grid; gap: 20px; margin: 0 0 24px; }
.ais-pcard { display: flex; gap: 16px; border: 1px solid #ececec; border-radius: 14px; padding: 14px; text-decoration: none; color: inherit; background: #fff; }
.ais-pcard:hover { border-color: #ff6725; }
.ais-pcard img { flex: 0 0 38%; width: 38%; min-height: 150px; max-height: 220px; object-fit: cover; border-radius: 10px; background: #f1f1f1; }
.ais-pcard .ais-pbody { flex: 1 1 auto; display: grid; align-content: center; gap: 6px; min-width: 0; }
.ais-pcard h3 { font-size: 20px; margin: 0; }
.ais-pcard .ais-pmeta { color: #666; font-size: 14px; }
.ais-badge { display: inline-block; justify-self: start; background: #000; color: #fff; border-radius: 14px; padding: 3px 10px; font-size: 12px; letter-spacing: .03em; text-transform: uppercase; }
.ais-pager { display: flex; justify-content: center; gap: 12px; align-items: center; margin: 8px 0 24px; }
.ais-pager button { border: 1px solid #000; background: #fff; border-radius: 20px; padding: 8px 18px; cursor: pointer; }
.ais-pager button[disabled] { opacity: .4; cursor: default; }
@media (max-width: 575px) { .ais-skel-card, .ais-pcard { flex-direction: column; } .ais-skel-img, .ais-pcard img { flex-basis: auto; width: 100%; } }

/* ---- the home hero: two slim bars (filters, then AI) in one card. Both are 52 px high (48 on a phone), same width, same radius, same button. */
.hero-slim { display: flex; flex-direction: column; gap: 8px; padding: 10px; background: #fff; border-radius: 36px; box-shadow: 0 18px 50px rgba(0, 0, 0, .12); }
.hero-slim .hero-bar { display: flex; align-items: center; box-sizing: border-box; width: 100%; height: 52px; margin: 0; padding: 0 5px 0 0; border: 1px solid #e2e2e2; border-radius: 26px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.hero-slim .hero-bar:focus-within { border-color: #ff6725; box-shadow: 0 0 0 3px rgba(255, 103, 37, .2); }
.hero-slim .hero-bar-label { flex: 0 0 auto; display: flex; align-items: center; gap: 9px; box-sizing: border-box; width: 160px; height: 30px; margin: 0 6px 0 0; padding: 0 14px 0 20px; border: 0; border-right: 1px solid #e2e2e2; border-radius: 0; background: none; color: #000; font-size: 15px; font-weight: 600; line-height: 1; white-space: nowrap; text-align: left; cursor: default; }
.hero-slim .hero-ico { flex: 0 0 auto; width: 20px; height: 20px; }
.hero-slim .hero-label-short { display: none; }
.hero-slim .hero-fields { flex: 1 1 auto; display: flex; align-items: center; min-width: 0; height: 100%; }
.hero-slim .hero-sheet-head { display: none; }
.hero-slim .hero-fields .input-box-one { position: relative; flex: 1 1 0; min-width: 0; height: 100%; display: flex; align-items: center; margin: 0; padding: 0; border: 0; border-radius: 22px; background: transparent; }
.hero-slim .hero-fields .input-box-one + .input-box-one::before { content: ""; position: absolute; left: 0; top: 13px; bottom: 13px; width: 1px; background: #e2e2e2; }
.hero-slim .hero-fields .input-box-one .label { position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hero-slim .hero-fields .nice-select { float: none; display: block; width: 100%; height: 50px; margin: 0; padding: 0 30px 0 18px; border: 0; background: transparent; line-height: 50px; font-size: 15px; font-weight: 500; color: #000; }
.hero-slim .hero-fields .nice-select .current { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hero-slim .hero-fields .nice-select:after { right: 14px; }
.hero-slim .hero-fields .nice-select.location:after { right: 12px; }
.hero-slim .hero-fields .nice-select .list { min-width: 100%; max-height: 300px; overflow-y: auto; margin-top: 8px; border-radius: 14px; }
.hero-slim .hero-fields .nice-select .option { white-space: nowrap; }
.hero-slim .hero-budget input { width: 100%; height: 50px; padding: 0 50px 0 18px; border: 0; border-radius: 0; background: transparent; box-shadow: none; font-size: 15px; font-weight: 500; color: #000; -moz-appearance: textfield; appearance: textfield; }
.hero-slim .hero-budget input::-webkit-outer-spin-button, .hero-slim .hero-budget input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.hero-slim .hero-budget input { text-overflow: ellipsis; }
.hero-slim .hero-budget input::placeholder { opacity: 1; }
.hero-slim .hero-budget .hero-cur { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); font-size: 12px; font-weight: 600; color: #666; pointer-events: none; }
.hero-slim .hero-bar-btn { flex: 0 0 auto; box-sizing: border-box; min-width: 120px; height: 42px; margin: 0 0 0 6px; padding: 0 26px; border: 0; border-radius: 21px; background: #ff6725; color: #fff; font-size: 15px; font-weight: 600; line-height: 1; text-transform: none; letter-spacing: 0; cursor: pointer; transition: background .2s; }
.hero-slim .hero-bar-btn:hover:not([disabled]), .hero-slim .hero-bar-btn:focus-visible { background: #000; color: #fff; }
.hero-slim .hero-bar-btn[disabled] { opacity: .7; cursor: progress; }
.hero-slim .hero-fields .nice-select, .hero-slim .hero-fields .nice-select .current { text-transform: none; color: rgba(0, 0, 0, .72); }
.hero-slim .hero-budget input, .hero-slim .hero-budget input::placeholder { color: rgba(0, 0, 0, .72); }
.hero-slim .hero-ai-form input:focus::placeholder, .hero-slim .hero-budget input:focus::placeholder { color: #8a8a8a; opacity: 1; }
/* row 2 */
.hero-slim .hero-ai { position: relative; margin: 0; padding: 0; background: transparent; border: 0; }
.hero-slim .hero-ai[hidden] { display: none !important; }
.hero-slim .hero-ai-form { display: flex; }
.hero-slim .hero-ai-form .hero-bar-label { cursor: text; }
.hero-slim .hero-ai-form input { flex: 1 1 auto; min-width: 0; height: 50px; padding: 0 14px; border: 0; border-radius: 0; background: transparent; box-shadow: none; outline: none; font-size: 15px; color: #000; }
.hero-slim .hero-ai-form input:focus { border: 0; box-shadow: none; }
.hero-slim .hero-ai-form input::placeholder { color: #777; opacity: 1; }
/* the dropdown: examples, the notice and every message */
.hero-slim .hero-ai-pop { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 40; box-sizing: border-box; padding: 10px 12px 10px; background: #fff; border: 1px solid #e2e2e2; border-radius: 20px; box-shadow: 0 16px 44px rgba(0, 0, 0, .18); }
.hero-slim .hero-ai-pop[hidden] { display: none; }
.hero-slim .hero-ai-msg { margin: 0 0 6px; padding: 4px 8px; min-height: 0; font-size: 14px; color: #555; }
.hero-slim .hero-ai-msg[hidden] { display: none; }
.hero-ai-msg.ais-bad { color: #b42318; }
.hero-ai-msg.ais-dots::after { content: ""; display: inline-block; width: 1.2em; text-align: left; animation: ais-dots 1.1s steps(4, end) infinite; }
.hero-slim .hero-ai-examples { display: block; margin: 0; padding: 0; list-style: none; }
.hero-slim .hero-ai-examples li { margin: 0; }
.hero-slim .hero-ai-example { display: block; width: 100%; padding: 8px 10px; border: 0; border-radius: 10px; background: transparent; font-size: 14.5px; line-height: 1.3; text-align: left; color: #000; cursor: pointer; }
.hero-slim .hero-ai-example:hover, .hero-slim .hero-ai-example:focus-visible { background: #fff3ed; color: #ff6725; }
.hero-slim .hero-ai-note { margin: 8px 0 0; padding: 8px 8px 0; border-top: 1px solid #efefef; font-size: 12px; line-height: 1.35; color: #777; }
/* the hero's own controls, shown filled from the sentence */
.hero-slim .input-box-one.ais-filled { background: #fff3ed; box-shadow: inset 0 0 0 2px #ff6725; transition: background .3s, box-shadow .3s; }
@media (prefers-reduced-motion: reduce) { .hero-slim .input-box-one.ais-filled, .hero-slim .hero-bar { transition: none; } }
/* tablet: the labels shrink so the five fields keep their room */
@media (max-width: 1199px) and (min-width: 769px) {
  .hero-slim .hero-bar-label { width: 92px; gap: 7px; padding: 0 8px 0 14px; margin-right: 2px; }
  .hero-slim .hero-label-full { display: none; }
  .hero-slim .hero-label-short { display: inline; }
  .hero-slim .hero-fields .nice-select { padding: 0 22px 0 10px; font-size: 13.5px; }
  .hero-slim .hero-fields .nice-select:after { right: 9px; }
  .hero-slim .hero-fields .nice-select.location:after { display: none; }
  .hero-slim .hero-budget input { padding: 0 40px 0 10px; font-size: 13.5px; }
  .hero-slim .hero-budget .hero-cur { right: 9px; font-size: 11px; }
  .hero-slim .hero-bar-btn { min-width: 88px; padding: 0 14px; margin-left: 2px; }
  .hero-slim .hero-fields .input-box-one.hero-empty .nice-select .current { color: transparent; }
  .hero-slim .hero-fields .input-box-one.hero-empty .nice-select::before { content: attr(data-short); position: absolute; left: 10px; top: 0; line-height: 50px; font-size: 13.5px; font-weight: 500; color: rgba(0, 0, 0, .72); pointer-events: none; }
}

/* narrow tablet (769-1023 px): the labels are icon-only so the short words and the budget fit. Their text stays for screen readers. */
@media (max-width: 1023px) and (min-width: 769px) {
  .hero-slim .hero-bar-label { width: 50px; padding: 0 0 0 15px; gap: 0; }
  .hero-slim .hero-bar-label > span:not(.ais-sr) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .hero-slim .hero-fields .nice-select { padding: 0 18px 0 8px; font-size: 13px; }
  .hero-slim .hero-fields .nice-select:after { right: 6px; }
  .hero-slim .hero-fields .input-box-one.hero-empty .nice-select::before { left: 8px; font-size: 13px; }
  .hero-slim .hero-fields .hero-budget { flex: 1.45 1 0; }
  .hero-slim .hero-budget input { padding: 0 34px 0 8px; font-size: 13px; }
  .hero-slim .hero-budget .hero-cur { right: 7px; font-size: 10.5px; }
  .hero-slim .hero-bar-btn { min-width: 76px; padding: 0 10px; }
}

/* ---- the public header at 1200-1325 px: with the lock and the AI button its content needs 1322 px, so the page scrolled sideways by up to 42 px.
   The menu text is 15 px instead of 18 px ONLY in that range; at every other width the header is untouched. */
@media (min-width: 1200px) and (max-width: 1325px) {
  .theme-main-menu .navbar-nav .nav-link { font-size: 15px; }
}
/* phone: row 1 is ONE «Filtros» button that opens the same selects as a sheet; row 2 stays one line */
@media (max-width: 768px) {
  .hero-slim { padding: 8px; gap: 8px; border-radius: 30px; }
  .hero-slim .hero-bar { height: 48px; border-radius: 24px; }
  .hero-slim .hero-bar-btn { min-width: 84px; height: 38px; padding: 0 16px; border-radius: 19px; font-size: 14px; }
  .hero-slim .hero-ai-form .hero-bar-label { width: 74px; padding: 0 8px 0 14px; margin-right: 2px; }
  .hero-slim .hero-label-full { display: none; }
  .hero-slim .hero-label-short { display: inline; }
  .hero-slim .hero-ai-form input { font-size: 16px; height: 46px; padding: 0 8px; }
  .hero-slim .hero-filters:not(.hero-open) .hero-fields, .hero-slim .hero-filters:not(.hero-open) .hero-bar-btn { display: none; }
  .hero-slim .hero-filters:not(.hero-open) { padding: 0; }
  .hero-slim .hero-filters:not(.hero-open) .hero-bar-label { flex: 1 1 auto; width: 100%; height: 100%; margin: 0; padding: 0 20px; border: 0; border-radius: 24px; cursor: pointer; }
  html.hero-sheet-lock, html.hero-sheet-lock body { overflow: hidden; }
  html.hero-sheet-lock .theme-main-menu, html.hero-sheet-lock .scroll-top { display: none !important; }   /* the sheet is a full-screen layer: the fixed header and the scroll button must not sit on top of it */
  .hero-slim .hero-filters.hero-open { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1060; display: flex; flex-direction: column; align-items: stretch; height: auto; padding: 0; border: 0; border-radius: 0; overflow-y: auto; background: #fff; }
  .hero-slim .hero-filters.hero-open .hero-bar-label { display: none; }
  .hero-slim .hero-filters.hero-open .hero-fields { flex: 0 0 auto; display: flex; flex-direction: column; align-items: stretch; height: auto; padding: 8px 16px 0; gap: 12px; }
  .hero-slim .hero-filters.hero-open .hero-sheet-head { display: flex; align-items: center; justify-content: space-between; padding: 6px 0 4px; font-size: 20px; }
  .hero-slim .hero-filters.hero-open .hero-sheet-close { border: 0; background: none; font-size: 34px; line-height: 1; color: #000; padding: 0 6px; cursor: pointer; }
  .hero-slim .hero-filters.hero-open .input-box-one { flex: none; display: block; height: auto; border-radius: 14px; }
  .hero-slim .hero-filters.hero-open .input-box-one + .input-box-one::before { display: none; }
  .hero-slim .hero-filters.hero-open .input-box-one .label { position: static; width: auto; height: auto; margin: 0 0 4px; overflow: visible; clip: auto; font-size: 13px; color: #666; }
  .hero-slim .hero-filters.hero-open .nice-select, .hero-slim .hero-filters.hero-open .hero-budget input { height: 50px; line-height: 50px; border: 1px solid #ddd; border-radius: 14px; font-size: 16px; }
  .hero-slim .hero-filters.hero-open .hero-budget { position: relative; }
  .hero-slim .hero-filters.hero-open .hero-budget .hero-cur { top: auto; bottom: 25px; transform: translateY(50%); }
  .hero-slim .hero-filters.hero-open .hero-bar-btn { display: block; flex: none; width: calc(100% - 32px); height: 50px; margin: 16px; border-radius: 25px; font-size: 16px; }
  .hero-slim .hero-ai-pop { border-radius: 18px; }
}

/* ---- the budget whose currency was not named: «¿USD o COP?» */
.ais-pend { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0 0; padding: 10px 14px; border: 1px solid #ffcdb6; border-radius: 12px; background: #fff8f4; font-size: 15px; }
.ais-pend-text { font-weight: 500; margin-right: 4px; }
.ais-pend-btn { border: 1px solid #000; background: #fff; color: #000; border-radius: 20px; padding: 6px 18px; font-size: 15px; cursor: pointer; }
.ais-pend-btn:hover, .ais-pend-btn:focus-visible { background: #000; color: #fff; }
.ais-pend-x { border: 0; background: transparent; cursor: pointer; font-size: 18px; color: #666; }
.ais-pend-x:hover { color: #b42318; }

/* ---- the hero's slim AI bar (and the blog's search bar) reused under the filter bar of the public list pages: js/pageAiBar.js.
   Same classes as the hero; only the card around it goes (the page already has its own background), so every size comes from the rules above. */
.hero-slim.page-ai-slim { padding: 0; gap: 0; background: transparent; border-radius: 0; box-shadow: none; position: relative; z-index: 6; margin: -14px 0 30px; }
.hero-slim.page-ai-slim[hidden] { display: none !important; }
.hero-slim.page-ai-slim[data-page-ai="blog"] { margin: 0 0 30px; }
.hero-slim.page-ai-slim[data-page-ai="blog"] .hero-bar-label { width: 196px; }
.hero-slim.page-ai-slim .hero-ai-pop { z-index: 70; }
.page-ai-chips { margin: -12px 0 28px; }
.page-ai-count { margin: -14px 0 24px; font-size: 15px; color: #555; }
.search-wrapper-three .input-box-one.ais-filled { box-shadow: inset 0 0 0 2px #ff6725; transition: box-shadow .3s; }   /* an outline only: the bar is dark, a light fill made the white text unreadable */
@media (max-width: 768px) {
  .hero-slim.page-ai-slim { padding: 0; margin: -10px 0 24px; }
  .hero-slim.page-ai-slim[data-page-ai="blog"] { margin: 0 0 24px; }
  .hero-slim.page-ai-slim[data-page-ai="blog"] .hero-bar-label { width: 74px; }
}

/* ---- the public header on a tablet (992-1199 px): with the lock and the AI button its menu needs up to 168 px more than the screen, so every public page scrolled
   sideways (136 px at 1024). The menu text and the gaps between entries shrink ONLY in this range; 1200 px and up use the rules above and the phone menu is untouched. */
@media (min-width: 992px) and (max-width: 1099px) {
  .theme-main-menu .navbar-nav .nav-link { font-size: 14px; margin-left: 6px; margin-right: 6px; }
}
@media (min-width: 1100px) and (max-width: 1199px) {
  .theme-main-menu .navbar-nav .nav-link { font-size: 15px; margin-left: 11px; margin-right: 11px; }
}