:root {
      --blue:var(--color-accent);
      --blue-dark:var(--color-accent-strong);
      --blue-soft:#eef5ff;
      --ink:var(--color-text);
      --muted:var(--color-text-muted);
      --line:var(--color-line);
      --soft:#f7f9fc;
      --white:#fff;
      --max:1180px;
      --shadow:0 14px 36px rgba(34,58,98,.07);
    }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body {
      margin:0;
      color:var(--ink);
      background:#fff;
      font-family:var(--font-sans);
      font-size:16px;
      line-height:var(--leading-ui);
      -webkit-font-smoothing:antialiased;
    }
    a { color:inherit; text-decoration:none; }
    img { display:block; max-width:100%; }
    button,input { font:inherit; }
    .container { width:min(var(--max),calc(100% - 32px)); margin:auto; }

    /* Header */
    .site-header {
      position:sticky;
      top:0;
      z-index:50;
      background:rgba(255,255,255,.94);
      backdrop-filter:blur(16px);
      border-bottom:1px solid var(--line);
    }
    .header-inner {
      min-height:76px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:26px;
    }
    .logo img { width:174px; }
    .main-nav {
      display:flex;
      align-items:center;
      gap:28px;
      color:#536176;
      font-size:14px;
      font-weight:750;
    }
    .main-nav a:hover,
    .main-nav a:focus-visible { color:var(--blue); }
    .header-actions { display:flex; gap:9px; }
    .icon-button {
      width:42px;
      height:42px;
      display:grid;
      place-items:center;
      border:1px solid var(--line);
      border-radius:50%;
      background:#fff;
      color:var(--ink);
      cursor:pointer;
    }
    .icon-button:hover { color:var(--blue); border-color:#ccd7e5; }
    .menu-button { display:none; }

    /* Hero */
    .category-hero {
      padding:34px 0 42px;
      border-bottom:1px solid var(--line);
      background:
        radial-gradient(circle at 18% 0,rgba(31,115,234,.08),transparent 30%),
        linear-gradient(#fff,#fbfcff);
    }
    .breadcrumb {
      display:flex;
      align-items:center;
      gap:9px;
      margin-bottom:27px;
      color:var(--muted);
      font-size:var(--text-meta);
    }
    .breadcrumb svg { width:12px; opacity:.65; }
    .hero-grid {
      display:grid;
      grid-template-columns:minmax(0,760px) minmax(260px,340px);
      align-items:end;
      justify-content:space-between;
      gap:48px;
    }
    .kicker {
      display:inline-flex;
      align-items:center;
      min-height:30px;
      padding:0 11px;
      border-radius:999px;
      background:var(--blue-soft);
      color:var(--blue);
      font-size:var(--text-label);
      font-weight:900;
      letter-spacing:.07em;
      text-transform:uppercase;
    }
    h1 {
      margin:0;
      max-width:760px;
      font-size:clamp(43px,6vw,66px);
      line-height:1.01;
      letter-spacing:-.052em;
    }
    .hero-copy {
      max-width:720px;
      margin:20px 0 0;
      color:var(--muted);
      font-size:var(--text-lead-desktop);
      line-height:1.6;
    }
    .category-search-wrap {
      align-self:end;
      position:relative;
      min-width:0;
    }
    .category-search {
      padding:8px;
      display:grid;
      grid-template-columns:1fr auto;
      gap:8px;
      border:1px solid #dce5f1;
      border-radius:16px;
      background:#fff;
      box-shadow:0 16px 38px rgba(31,66,120,.08);
    }
    .category-search input {
      min-width:0;
      min-height:48px;
      border:0;
      outline:0;
      padding:0 13px;
      color:var(--ink);
      font-size:14px;
    }
    .category-search button {
      width:48px;
      height:48px;
      border:0;
      border-radius:11px;
      background:linear-gradient(var(--blue),var(--blue-dark));
      color:#fff;
      cursor:pointer;
    }
    .category-live-panel {
      position:absolute;
      z-index:40;
      top:calc(100% + 9px);
      right:0;
      left:0;
      max-height:430px;
      overflow-y:auto;
      padding:10px 11px 11px;
      border:1px solid #dce5f1;
      border-radius:15px;
      background:#fff;
      box-shadow:0 22px 55px rgba(31,66,120,.17);
    }
    .category-live-panel[hidden] { display:none; }
    .category-live-status {
      min-height:34px;
      padding:8px 5px 7px;
      color:var(--muted);
      font-size:var(--text-label);
      font-weight:750;
    }
    .category-live-panel .live-result:first-child { border-top:1px solid #edf1f6; }
    .category-live-panel .view-all { margin-top:8px; }

    /* Shared */
    .section { padding:52px 0 0; }
    .section.alt {
      margin-top:56px;
      padding:48px 0;
      background:var(--soft);
      border-block:1px solid var(--line);
    }
    .section-head {
      margin-bottom:22px;
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:24px;
    }
    .eyebrow {
      margin-bottom:7px;
      color:var(--blue);
      font-size:var(--text-label);
      font-weight:900;
      letter-spacing:.08em;
      text-transform:uppercase;
    }
    h2 {
      margin:0;
      font-size:clamp(30px,4vw,39px);
      line-height:1.08;
      letter-spacing:-.042em;
    }
    .section-head p {
      max-width:680px;
      margin:9px 0 0;
      color:var(--muted);
      font-size:var(--text-card);
    }

    /* Featured */
    .featured-grid {
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:19px;
    }
    .featured-card {
      overflow:hidden;
      border:1px solid var(--line);
      border-radius:22px;
      background:#fff;
      box-shadow:var(--shadow);
      transition:transform .2s ease,box-shadow .2s ease;
    }
    .featured-card:hover {
      transform:translateY(-3px);
      box-shadow:0 18px 42px rgba(34,58,98,.1);
    }
    .featured-cover {
      position:relative;
      height:190px;
      overflow:hidden;
      background:#e9eef5;
    }
    .featured-cover img {
      width:100%;
      height:100%;
      object-fit:cover;
    }
    .featured-cover::after {
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(180deg,transparent 55%,rgba(14,28,48,.12));
      pointer-events:none;
    }
    .illustrated-cover {
      display:grid;
      place-items:center;
      background:
        radial-gradient(circle at 70% 22%,rgba(255,255,255,.6),transparent 23%),
        linear-gradient(145deg,#edf2ff,#a8bdf3);
    }
    .chat-illustration {
      position:relative;
      width:170px;
      height:110px;
    }
    .chat-box {
      position:absolute;
      border-radius:18px;
      box-shadow:0 17px 30px rgba(37,61,101,.14);
    }
    .chat-box.one {
      width:116px;
      height:68px;
      left:0;
      top:12px;
      background:#fff;
    }
    .chat-box.one::after {
      content:"";
      position:absolute;
      left:20px;
      bottom:-12px;
      border:8px solid transparent;
      border-top-color:#fff;
      transform:rotate(20deg);
    }
    .chat-box.two {
      width:105px;
      height:62px;
      right:0;
      bottom:0;
      background:#1f73ea;
    }
    .chat-box.two::after {
      content:"";
      position:absolute;
      right:18px;
      bottom:-11px;
      border:8px solid transparent;
      border-top-color:#1f73ea;
      transform:rotate(-20deg);
    }
    .chat-lines {
      position:absolute;
      inset:18px 20px;
      border-radius:99px;
      background:
        linear-gradient(#aab7c8 0 0) 0 0/65% 6px no-repeat,
        linear-gradient(#d5dde7 0 0) 0 19px/88% 6px no-repeat;
    }
    .chat-box.two .chat-lines {
      background:
        linear-gradient(rgba(255,255,255,.9) 0 0) 0 0/60% 6px no-repeat,
        linear-gradient(rgba(255,255,255,.55) 0 0) 0 19px/82% 6px no-repeat;
    }
    .featured-body { padding:21px; }
    .tag {
      display:inline-flex;
      min-height:27px;
      align-items:center;
      padding:0 10px;
      border-radius:999px;
      background:#f0f6ff;
      color:var(--blue);
      font-size:var(--text-label);
      font-weight:900;
      letter-spacing:.065em;
      text-transform:uppercase;
    }
    .featured-card h3 {
      margin:12px 0 8px;
      font-size:21px;
      line-height:1.2;
      letter-spacing:-.028em;
    }
    .featured-card p {
      margin:0;
      color:var(--muted);
      font-size:var(--text-card);
      line-height:var(--leading-ui);
    }
    .card-meta {
      margin-top:17px;
      padding-top:14px;
      border-top:1px solid var(--line);
      display:flex;
      justify-content:flex-end;
      gap:12px;
      color:var(--muted);
      font-size:var(--text-meta);
    }
    .card-meta a { color:var(--blue); font-weight:850; }

    /* All contents */
    .content-list {
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:15px;
    }
    .content-item {
      min-height:177px;
      padding:22px;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      border:1px solid var(--line);
      border-radius:19px;
      background:#fff;
      transition:border-color .18s ease,transform .18s ease;
    }
    .content-item:hover {
      transform:translateY(-2px);
      border-color:#cdd9e8;
    }
    .content-topic {
      width:max-content;
      margin-bottom:13px;
      padding:4px 9px;
      border-radius:999px;
      background:#f2f5f9;
      color:var(--muted);
      font-size:var(--text-label);
      font-weight:800;
    }
    .content-item h3 {
      margin:0;
      font-size:20px;
      line-height:1.25;
      letter-spacing:-.027em;
    }
    .content-item p {
      margin:8px 0 0;
      color:var(--muted);
      font-size:15px;
      line-height:var(--leading-ui);
    }
    .content-item-bottom {
      margin-top:18px;
      display:flex;
      align-items:center;
      justify-content:flex-end;
      gap:14px;
    }
    .content-type {
      color:var(--muted);
      font-size:var(--text-label);
      font-weight:800;
    }
    .text-link {
      display:inline-flex;
      align-items:center;
      gap:7px;
      color:var(--blue);
      font-size:var(--text-meta);
      font-weight:850;
    }
    .text-link svg { width:14px; }

    /* Pagination */
    .pagination {
      margin-top:27px;
      display:flex;
      align-items:center;
      justify-content:center;
      gap:8px;
    }
    .page-button {
      min-width:42px;
      height:42px;
      padding:0 12px;
      display:grid;
      place-items:center;
      border:1px solid var(--line);
      border-radius:11px;
      background:#fff;
      color:#5d6c80;
      font-size:13px;
      font-weight:800;
    }
    .page-button.active {
      border-color:var(--blue);
      background:var(--blue);
      color:#fff;
    }
    .page-button:hover:not(.active) { border-color:#cbd7e6; color:var(--blue); }

    /* CTA */
    .suggest { padding:58px 0 0; }
    .suggest-box {
      padding:34px 38px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:28px;
      border:1px solid #dde7f5;
      border-radius:25px;
      background:
        radial-gradient(circle at 86% 35%,rgba(31,115,234,.08),transparent 28%),
        linear-gradient(110deg,#f5f9ff,#fff 75%);
    }
    .suggest-box h2 { font-size:clamp(28px,4vw,38px); }
    .suggest-box p {
      max-width:680px;
      margin:9px 0 0;
      color:var(--muted);
    }
    .button {
      min-height:48px;
      padding:0 21px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      flex:0 0 auto;
      border-radius:999px;
      background:linear-gradient(var(--blue),var(--blue-dark));
      color:#fff;
      font-weight:850;
      box-shadow:0 11px 25px rgba(31,115,234,.2);
    }

    /* Footer */
    .site-footer {
      margin-top:60px;
      padding:38px 0 20px;
      background:#16263f;
      color:#d5dfec;
    }
    .footer-grid {
      display:grid;
      grid-template-columns:1.35fr repeat(3,.75fr);
      gap:34px;
    }
    .footer-brand img {
      width:174px;
      filter:brightness(0) invert(1);
      opacity:.94;
    }
    .footer-brand p {
      max-width:340px;
      color:#9fb0c5;
      font-size:14px;
    }
    .footer-col h3 {
      margin:0 0 13px;
      color:#fff;
      font-size:14px;
    }
    .footer-col a {
      display:block;
      margin:8px 0;
      color:#aebcd0;
      font-size:13px;
    }
    .footer-col a:hover { color:#fff; }
    .footer-bottom {
      margin-top:31px;
      padding-top:18px;
      border-top:1px solid rgba(255,255,255,.09);
      color:#8395ac;
      font-size:12px;
    }

    /* Mobile panel */
    .mobile-panel {
      position:fixed;
      z-index:80;
      inset:0 0 0 auto;
      width:min(360px,88vw);
      height:100vh;
      padding:23px;
      background:#fff;
      box-shadow:-20px 0 55px rgba(20,39,70,.18);
      transform:translateX(110%);
      transition:.24s;
    }
    .mobile-panel.open { transform:translateX(0); }
    .mobile-panel-head {
      display:flex;
      align-items:center;
      justify-content:space-between;
    }
    .mobile-panel-head img { width:153px; }
    .mobile-panel nav {
      display:grid;
      margin-top:30px;
    }
    .mobile-panel nav a {
      padding:14px 3px;
      border-bottom:1px solid var(--line);
      color:#425168;
      font-weight:800;
    }
    .backdrop {
      position:fixed;
      z-index:70;
      inset:0;
      background:rgba(16,29,50,.42);
      opacity:0;
      pointer-events:none;
      transition:.2s;
    }
    .backdrop.open { opacity:1; pointer-events:auto; }
    .preview-label {
      position:fixed;
      z-index:60;
      left:14px;
      bottom:14px;
      padding:7px 11px;
      border:1px solid var(--line);
      border-radius:999px;
      background:rgba(255,255,255,.94);
      box-shadow:var(--shadow);
      color:var(--muted);
      font-size:var(--text-label);
    }

    @media(max-width:1000px) {
      .main-nav { display:none; }
      .menu-button { display:grid; }
      .hero-grid { grid-template-columns:1fr; gap:26px; }
      .category-search-wrap { max-width:620px; }
      .featured-grid { grid-template-columns:repeat(2,1fr); }
      .featured-card:last-child {
        grid-column:1/-1;
        display:grid;
        grid-template-columns:.85fr 1.15fr;
      }
      .featured-card:last-child .featured-cover {
        height:100%;
        min-height:230px;
      }
      .footer-grid { grid-template-columns:1.3fr repeat(2,1fr); }
      .footer-col:last-child { grid-column:2/-1; }
    }

    @media(max-width:720px) {
      .container { width:min(var(--max),calc(100% - 36px)); }
      .header-inner { min-height:68px; }
      .logo img { width:150px; }
      .search-button { display:none; }
      .category-hero { padding:25px 0 32px; }
      .breadcrumb { margin-bottom:20px; font-size:var(--text-meta); }
      h1 { font-size:clamp(39px,12vw,54px); }
      .hero-copy { font-size:var(--text-lead-mobile); }
      .category-search-wrap { width:100%; }
      .category-search { grid-template-columns:1fr auto; width:100%; }
      .category-live-panel {
        max-height:min(410px,calc(100vh - 150px));
        padding-inline:9px;
      }
      .category-live-panel .live-result {
        grid-template-columns:36px minmax(0,1fr) auto;
        gap:10px;
        padding-inline:5px;
      }
      .section { padding-top:42px; }
      .section.alt { margin-top:43px; padding:42px 0; }
      .section-head { align-items:flex-start; flex-direction:column; }
      .featured-grid { grid-template-columns:1fr; }
      .featured-card:last-child {
        grid-column:auto;
        display:block;
      }
      .featured-card:last-child .featured-cover {
        height:190px;
        min-height:0;
      }
      .content-list { grid-template-columns:1fr; }
      .content-item { min-height:0; }
      .suggest-box {
        padding:28px 24px;
        align-items:flex-start;
        flex-direction:column;
      }
      .button { width:100%; }
      .footer-grid { grid-template-columns:1fr 1fr; }
      .footer-brand { grid-column:1/-1; }
      .footer-col:last-child { grid-column:auto; }
      .preview-label { display:none; }
    }

    @media(max-width:460px) {
      h1 { font-size:38px; }
      .category-search {
        grid-template-columns:1fr;
      }
      .category-search button {
        width:100%;
      }
      .footer-grid { grid-template-columns:1fr; }
      .footer-brand { grid-column:auto; }
    }

/* Índice público de categorias. */
.category-directory-hero .hero-grid {
  max-width: 780px;
  grid-template-columns: minmax(0, 1fr);
}

.category-directory-section {
  padding-bottom: 8px;
}

.category-directory-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}

.category-directory-card {
  position: relative;
  overflow: hidden;
  min-width: 0;
  border: 1px solid #dfe8f3;
  border-radius: 21px;
  background:
    radial-gradient(circle at 92% 8%, rgba(23, 105, 210, .10), transparent 28%),
    #fff;
  box-shadow: 0 13px 32px rgba(28, 53, 91, .06);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.category-directory-card:nth-child(3n + 2) {
  background:
    radial-gradient(circle at 92% 8%, rgba(239, 142, 45, .12), transparent 28%),
    #fff;
}

.category-directory-card:nth-child(3n) {
  background:
    radial-gradient(circle at 92% 8%, rgba(205, 68, 151, .10), transparent 28%),
    #fff;
}

.category-directory-card:hover {
  transform: translateY(-3px);
  border-color: #bfd3ea;
  box-shadow: 0 18px 40px rgba(28, 53, 91, .10);
}

.category-directory-card > a {
  min-height: 250px;
  padding: 23px;
  display: flex;
  flex-direction: column;
}

.category-directory-card > a:focus-visible {
  outline: 4px solid var(--blue);
  outline-offset: -4px;
  border-radius: 21px;
}

.category-directory-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--blue);
  font-size: var(--text-label);
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.category-directory-card-top span:last-child {
  font-size: 17px;
  letter-spacing: 0;
}

.category-directory-card h3 {
  margin: 21px 0 0;
  color: var(--ink);
  font-size: 24px;
  line-height: 1.2;
  letter-spacing: -.03em;
}

.category-directory-card p {
  margin: 10px 0 23px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.65;
}

.category-directory-card-meta {
  margin-top: auto;
  padding-top: 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-top: 1px solid #e8eef5;
  color: var(--muted);
  font-size: var(--text-meta);
}

.category-directory-card-meta strong {
  color: var(--blue);
  font-weight: 850;
}

.category-directory-empty {
  padding: 35px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #f8fbff;
  text-align: center;
}

.category-directory-empty h2 {
  margin: 0;
  font-size: 27px;
}

.category-directory-empty p {
  margin: 9px 0 0;
  color: var(--muted);
}

@media(max-width:1000px) {
  .category-directory-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media(max-width:640px) {
  .category-directory-grid {
    grid-template-columns: 1fr;
  }

  .category-directory-card > a {
    min-height: 0;
    padding: 21px 20px;
  }
}