/* Claude fixes, 2026-09-29. A layer on top of Codex's round 8 (loaded last). Brand tokens only.
   1 menu chevrons · 2 one icon style in every mega menu · 3 AI Data item · 5 tour floating card · 9 industry scenes. */

/* Mega-menu base for pages that don't load refinement.css (pricing.html). Same values as refinement.css. */
.mega{position:static}
.mega summary{list-style:none;cursor:pointer;font-size:14px;color:var(--body);padding:18px 0}
.mega summary::-webkit-details-marker{display:none}
.mega[open] summary{color:var(--ind)}

/* 1. Menu chevrons: an inline SVG centred on the label, same size and gap in every menu, rotates when open */
.nav .mega summary{display:inline-flex;align-items:center;gap:6px;line-height:20px}
.nav__links{align-items:center}
.nav .mega summary,.nav__links>a{white-space:nowrap}
@media(min-width:761px){.nav__links>a{display:inline-flex;align-items:center;line-height:20px;padding-top:10px;padding-bottom:10px}}
.nav-chev{display:block;flex:none;width:12px;height:12px;color:currentColor;opacity:.72;transition:transform .2s cubic-bezier(.22,1,.36,1),opacity .2s}
.nav .mega[open] .nav-chev{transform:rotate(180deg);opacity:1}
.nav .mega summary:hover .nav-chev{opacity:1}

/* 2. One icon style for every menu: indigo line icon on a lavender tile; the tile turns into the brand gradient
   with a white icon on hover (owner rule: icons on purple are white) */
.nav-mega .nm-icon,.nav-mega .nm-icon.purple{flex:0 0 28px;width:28px;height:28px;border-radius:8px;background:var(--lav);color:var(--ind);box-shadow:inset 0 0 0 1px var(--line);transition:background .18s,color .18s,box-shadow .18s}
.nav-mega .nm-icon .ic{width:15px;height:15px;color:inherit}
.nav .nm-item:hover .nm-icon{background:var(--grad);color:#fff;box-shadow:none}
.nav .nm-item.nm-soon:hover .nm-icon{background:var(--lav);color:var(--ind);box-shadow:inset 0 0 0 1px var(--line)}
.nav .nm-item.nm-soon:hover{background:none}
.nm-promo>.ic{box-sizing:border-box;width:40px;height:40px;padding:10px;border-radius:11px;background:var(--grad);color:#fff}

/* 3. AI Data: our moat, so it gets a quiet card of its own under the AJAW AI feature */
.nav .nm-item--data{align-items:flex-start;margin:2px -6px 4px;padding:11px 10px 12px 6px;background:var(--lav2);box-shadow:inset 0 0 0 1px var(--line)}
.nav .nm-item--data .nm-icon{margin-top:1px}
.nav .nm-item--data small{max-width:40ch}
.nm-source{display:block;margin-top:6px;font:500 10.5px/1.4 var(--font-body);font-style:normal;letter-spacing:.01em;color:var(--ind)}

/* 5. Product tour: floating app card, top-right of the screen, one per tab */
.tour-float{top:62px;right:22px;bottom:auto;left:auto;width:278px;padding:14px 15px 15px;background:rgba(255,255,255,.86);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);border:1px solid rgba(201,197,251,.75);border-radius:16px;box-shadow:0 1px 2px rgba(22,19,61,.05),0 26px 50px -20px rgba(37,31,149,.38);animation:none;z-index:2}
.tf__h{display:flex;align-items:center;gap:11px;min-width:0}
.tf__av{flex:none;width:40px;height:40px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px #fff,0 0 0 3px var(--line2)}
.tf__tile{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--grad);color:#fff;box-shadow:0 6px 14px -6px rgba(37,31,149,.55)}
.tf__tile .ic{width:19px;height:19px;color:#fff}
.tf__who{display:flex;flex-direction:column;min-width:0}
.tour-float .tf__who b{display:block;margin:0;font:600 14px/1.25 var(--font-body);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tour-float .tf__st{display:flex;align-items:center;gap:6px;margin-top:3px;font:500 11.5px/1.3 var(--font-body);color:var(--body)}
.tf__st i{flex:none;width:7px;height:7px;border-radius:50%;background:var(--ind)}
.tf__st--ok,.tf__st--live{color:var(--ok)!important}
.tf__st--ok i,.tf__st--live i{background:var(--okdot)}
.tf__st--live{font-variant-numeric:tabular-nums}
.tf__st--live i{animation:tfPulse 1.6s ease-in-out infinite}
.tf__body{margin:11px 0 0;font:12.5px/1.5 var(--font-body);color:var(--body)}
.tf__quote{margin:11px 0 0;padding:8px 11px;background:#fff;border:1px solid var(--line2);border-radius:13px 13px 13px 4px;font:12.5px/1.45 var(--font-body);color:var(--ink)}
.tf__wave{display:flex;align-items:center;gap:3px;height:24px;margin-top:11px}
.tf__wave i{flex:1;min-width:2px;border-radius:2px;background:var(--lilac)}
.tf__wave i:nth-child(-n+10){background:var(--ind)}
.tf__act{display:inline-flex;align-items:center;gap:6px;margin-top:12px;padding:6px 11px 6px 9px;border-radius:999px;background:var(--lav);box-shadow:inset 0 0 0 1px var(--line);font:600 11.5px/1.2 var(--font-body);color:var(--ind)}
.tf__act .ic{width:13px;height:13px}
@keyframes tfPulse{50%{opacity:.35}}
@media(max-width:700px){
  .tour-float{top:10px;right:10px;width:214px;padding:10px 11px 11px;border-radius:13px}
  .tf__av,.tf__tile{width:32px;height:32px}.tf__tile{border-radius:10px}.tf__tile .ic{width:16px;height:16px}
  .tour-float .tf__who b{font-size:12px}.tour-float .tf__st{font-size:10.5px}
  .tf__body,.tf__quote,.tf__wave{display:none}
  .tf__act{margin-top:9px;font-size:10.5px;padding:5px 9px 5px 8px}
}

/* 9. "¿Qué conversación quieres empezar?": clean tab icons + an app-style scene per tab */
.tq__tabs button{display:inline-flex;align-items:center;gap:9px}
.tq__ti{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:8px;background:var(--lav);color:var(--ind);box-shadow:inset 0 0 0 1px var(--line);transition:background .2s,color .2s}
.tq__ti .ic{width:14px;height:14px;color:inherit}
.tq__tabs button[aria-selected=true] .tq__ti{background:var(--grad);color:#fff;box-shadow:0 6px 12px -6px rgba(37,31,149,.6)}
.tq__tabs button:hover .tq__ti{color:var(--ind)}
.tq__tabs button[aria-selected=true]:hover .tq__ti{color:#fff}

.tqs{position:relative;min-height:530px;padding:48px 28px 26px;overflow:hidden;background:radial-gradient(120% 90% at 100% 0%,#ecebff 0%,var(--lav2) 46%,#fff 100%);border-left:1px solid var(--line2)}
.tqs__label{position:absolute;top:17px;right:22px;font:500 11px/1 var(--font-body);color:var(--body)}
.tqs__chat{position:relative;width:min(80%,400px);background:#fff;border-radius:16px;box-shadow:0 0 0 1px var(--line2),0 20px 44px -26px rgba(37,31,149,.38);overflow:hidden}
.tqs__head{display:flex;align-items:center;gap:10px;padding:11px 13px;border-bottom:1px solid var(--line)}
.tqs__head img{flex:none;width:32px;height:32px;border-radius:50%;object-fit:cover}
.tqs__who{display:flex;flex-direction:column;min-width:0;flex:1}
.tqs__who b{font:600 13px/1.25 var(--font-body);color:var(--ink)}
.tqs__who small{font:11px/1.3 var(--font-body);color:var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tqs__ch{flex:none;display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 3px;border-radius:999px;background:var(--lav);font:600 11px/1 var(--font-body);color:var(--ind)}
.tqs__ch .ic{box-sizing:border-box;width:20px;height:20px;padding:4px;border-radius:50%;background:var(--grad);color:#fff}
.tqs__msgs{display:flex;flex-direction:column;gap:7px;padding:13px 13px 15px;background:#fafafe}
.tqs__b{max-width:84%;margin:0;padding:8px 11px;border-radius:14px;font:12.5px/1.45 var(--font-body)}
.tqs__b time{display:block;margin-top:3px;font-size:10px;color:var(--body)}
.tqs__b--in{align-self:flex-start;background:#fff;border:1px solid var(--line2);border-bottom-left-radius:4px;color:var(--ink)}
.tqs__b--out{align-self:flex-end;background:var(--grad);color:#fff;border-bottom-right-radius:4px}
.tqs__b--out time{color:rgba(255,255,255,.75);text-align:right}
.tqs__by{align-self:flex-end;display:inline-flex;align-items:center;gap:4px;margin-top:-2px;font:600 10.5px/1 var(--font-body);color:var(--acc)}
.tqs__by .ic{width:12px;height:12px}
.tqs__crm{position:absolute;right:22px;bottom:84px;width:min(60%,318px);padding:12px;background:#fff;border-radius:14px;box-shadow:0 0 0 1px var(--line2),0 26px 52px -22px rgba(37,31,149,.45)}
.tqs__crmh{display:flex;align-items:center;gap:7px}
.tqs__crmh .ic{width:15px;height:15px;color:var(--ind)}
.tqs__crmh b{font:600 12px/1 var(--font-body);color:var(--ink)}
.tqs__crmh small{margin-left:auto;padding:3px 8px;border-radius:999px;background:var(--okbg);font:600 10px/1.2 var(--font-body);color:var(--ok)}
.tqs__stages{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:11px 0 12px}
.tqs__stage{padding:6px 4px;border-radius:8px;background:var(--lav2);font:600 10.5px/1.2 var(--font-body);color:var(--body);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tqs__stage.is-to{background:var(--lav);color:var(--ind);box-shadow:inset 0 0 0 1px var(--lilac)}
.tqs__stages::after{content:"";position:absolute;left:0;bottom:-5px;width:calc((100% - 12px)/3);height:2px;border-radius:2px;background:var(--ind);transform:translateX(calc(100% + 6px))}
.tqs__deal{display:flex;align-items:center;gap:9px;padding:9px 10px;border:1px solid var(--line2);border-radius:10px;background:#fff}
.tqs__deal img{flex:none;width:24px;height:24px;border-radius:50%;object-fit:cover}
.tqs__deal span{display:flex;flex-direction:column;min-width:0}
.tqs__deal b{font:600 12.5px/1.25 var(--font-body);color:var(--ink)}
.tqs__deal small{font:11px/1.3 var(--font-body);color:var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tqs__deal em{margin-left:auto;flex:none;padding:3px 8px;border-radius:999px;background:var(--lav);font:600 10.5px/1.2 var(--font-body);font-style:normal;color:var(--ind)}
.tqs__next{position:absolute;left:28px;bottom:26px;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;background:#fff;border-radius:12px;box-shadow:0 0 0 1px var(--line2),0 14px 30px -18px rgba(37,31,149,.4)}
.tqs__nic{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:9px;background:var(--grad);color:#fff}
.tqs__nic .ic{width:16px;height:16px;color:#fff}
.tqs__next span:not(.tqs__nic){display:flex;flex-direction:column}
.tqs__next small{font:600 9.5px/1.2 var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--body)}
.tqs__next b{font:600 12.5px/1.3 var(--font-body);color:var(--ink)}
.tqs__next time{margin-left:8px;font:600 11px/1 var(--font-body);color:var(--ind);white-space:nowrap}

/* the scene plays each time its tab opens: messages arrive, the deal moves one stage, the next step appears */
@media(prefers-reduced-motion:no-preference){
  .tq__p.is-on .tqs__chat{animation:tqsIn .45s cubic-bezier(.22,1,.36,1) both}
  .tq__p.is-on .tqs__b,.tq__p.is-on .tqs__by{animation:tqsIn .4s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--d) * .38s + .2s)}
  .tq__p.is-on .tqs__crm{animation:tqsIn .5s cubic-bezier(.22,1,.36,1) both 1.25s}
  .tq__p.is-on .tqs__stages::after{animation:tqsSlide .7s cubic-bezier(.22,1,.36,1) both 1.75s}
  .tq__p.is-on .tqs__stage.is-from{animation:tqsFrom .5s both 1.75s}
  .tq__p.is-on .tqs__stage.is-to{animation:tqsTo .5s both 1.9s}
  .tq__p.is-on .tqs__deal em{animation:tqsPop .45s cubic-bezier(.22,1,.36,1) both 2.05s}
  .tq__p.is-on .tqs__next{animation:tqsIn .5s cubic-bezier(.22,1,.36,1) both 2.3s}
}
@keyframes tqsIn{from{opacity:0;transform:translateY(8px)}}
@keyframes tqsSlide{from{transform:translateX(0)}}
@keyframes tqsFrom{from{background:var(--lav);color:var(--ind);box-shadow:inset 0 0 0 1px var(--lilac)}}
@keyframes tqsTo{from{background:var(--lav2);color:var(--body);box-shadow:none}}
@keyframes tqsPop{from{opacity:0;transform:scale(.8)}}
@media(max-width:860px){
  .tqs{min-height:0;padding:40px 16px 18px;border-left:0;border-top:1px solid var(--line2);display:flex;flex-direction:column;gap:12px}
  .tqs__label{top:14px;right:16px}
  .tqs__chat{width:100%}
  .tqs__crm{position:relative;right:auto;bottom:auto;width:auto;margin:-26px 0 0 18%}
  .tqs__next{position:relative;left:auto;bottom:auto;align-self:flex-start;max-width:100%}
}
@media(max-width:420px){.tqs__crm{margin-left:8%}.tqs__next time{display:none}}