/* CAD BOLT AI & Digital Tools hub (homepage) */
.th-group{margin:0 0 2rem}
.th-gh{display:flex;align-items:baseline;gap:.8rem;margin:0 0 .9rem;font-family:var(--display);font-weight:400;font-size:1.6rem;letter-spacing:.03em;color:#fff}
.th-gh small{font-family:var(--font);font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--orange)}
.th-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}
.th-card{position:relative;display:flex;flex-direction:column;gap:.55rem;padding:1.1rem 1.1rem 1rem;border-radius:var(--radius,18px);background:linear-gradient(160deg,rgba(26,51,72,.85),rgba(18,38,58,.95));border:1px solid var(--line,rgba(255,255,255,.08));color:var(--text,#E8EEF4);text-decoration:none;transition:transform .35s var(--ease),border-color .35s,box-shadow .35s,background .35s;overflow:visible;min-width:0}
.th-card:hover{border-color:rgba(243,112,33,.45);outline:none}
.th-card:focus-visible{outline:none}
.th-top{display:flex;align-items:flex-start;justify-content:space-between;gap:.45rem;min-width:0;max-width:100%}
.th-ic{width:44px;height:44px;border-radius:12px;background:rgba(243,112,33,.12);border:1px solid rgba(243,112,33,.35);color:var(--orange,#F37021);display:grid;place-items:center;flex:none}
.th-ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.th-tag{max-width:calc(100% - 52px);min-width:0;box-sizing:border-box;font-size:.65rem;font-weight:700;letter-spacing:.03em;color:var(--orange,#F37021);border:1px solid rgba(243,112,33,.35);border-radius:999px;padding:.22rem .5rem;line-height:1.25;text-align:center;white-space:normal;overflow-wrap:anywhere;word-break:break-word}
@media (max-width:420px){
  .th-top{flex-wrap:wrap}
  .th-tag{max-width:100%;width:100%;order:2;margin-top:.15rem}
}
.th-card b{font-size:1rem;color:#fff;line-height:1.25}
.th-card p{margin:0;font-size:.85rem;line-height:1.45;color:var(--muted,#8A9BAE);flex:1}
.th-go{font-size:.8rem;font-weight:700;color:var(--orange,#F37021)}
.th-tabs{display:none}
@media (max-width:760px){
  .th-tabs{display:flex;gap:.4rem;margin:0 0 1rem;padding:.3rem;border:1px solid var(--line,rgba(255,255,255,.08));border-radius:999px;background:rgba(11,31,51,.6)}
  .th-tabs button{flex:1;min-height:40px;border:0;border-radius:999px;background:transparent;color:var(--muted,#8A9BAE);font:700 .8rem/1 var(--font,Inter,sans-serif);letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
  .th-tabs button[aria-selected="true"]{background:var(--orange,#F37021);color:#fff}
  .th-hub.th-js .th-group{display:none}.th-hub.th-js .th-group.on{display:block}
  .th-hub.th-js .th-gh{display:none}
  .th-row{grid-template-columns:1fr;gap:.7rem}
}
html,body{overflow-x:clip}
html[dir="rtl"] div[aria-hidden="true"][style*="left:-9999px"],html[dir="rtl"] .cbm-hp{left:0!important;right:auto!important;top:0;clip-path:inset(50%);opacity:0;pointer-events:none}


/* ===== Load-path style activation for tool cards ===== */
.th-hub{--th-glow:rgba(243,112,33,.45)}
.th-row{position:relative;align-items:stretch}
.th-card{
  z-index:1;
  will-change:transform,box-shadow,border-color,background;
}
.th-card > p{
  max-height:0;opacity:0;overflow:hidden;margin:0;padding:0;
  transition:max-height .35s ease,opacity .3s ease,margin .3s ease;
}
.th-card.active > p,
.th-card:hover > p,
.th-card:focus-visible > p{
  max-height:4.5em;opacity:1;margin:.1rem 0 0;
}
.th-card.active,
.th-card:focus-visible{
  border-color:#F37021;
  background:linear-gradient(135deg,rgba(243,112,33,.18),rgba(18,38,58,.95) 55%);
  box-shadow:0 0 0 1px rgba(243,112,33,.35),0 0 28px var(--th-glow),0 16px 40px rgba(7,21,34,.45);
  transform:translateY(-6px) scale(1.02);
  z-index:3;
}
.th-card.active .th-ic{
  background:rgba(243,112,33,.22);
  border-color:#F37021;
  box-shadow:0 0 16px rgba(243,112,33,.35);
}
.th-card.active .th-tag{
  background:rgba(243,112,33,.16);
  border-color:#F37021;
}
/* flowing connector to next card in same row */
.th-card.th-conn{position:relative}
.th-card.th-conn::after{
  content:"";position:absolute;top:50%;right:-.75rem;width:.75rem;height:2px;z-index:4;
  background:linear-gradient(90deg,rgba(243,112,33,.15),#F37021,rgba(243,112,33,.15));
  background-size:200% 100%;
  transform:translateY(-50%);
  pointer-events:none;opacity:.35;
}
.th-card.th-conn.active::after,
.th-card.th-conn.th-flow::after{
  opacity:1;animation:thFlow 1.4s linear infinite;
}
.th-card.th-conn::before{
  content:"";position:absolute;top:50%;right:-.95rem;z-index:5;
  border:5px solid transparent;border-left-color:#F37021;
  transform:translateY(-50%);pointer-events:none;opacity:.35;
}
.th-card.th-conn.active::before,
.th-card.th-conn.th-flow::before{opacity:1}
@keyframes thFlow{
  0%{background-position:100% 0}
  100%{background-position:-100% 0}
}
@media (max-width:760px){
  .th-card.th-conn::after,.th-card.th-conn::before{display:none}
  .th-card.active,.th-card:focus-visible{transform:translateY(-3px) scale(1.01)}
}
@media (prefers-reduced-motion:reduce){
  .th-card,.th-card > p{transition:none!important}
  .th-card.active,.th-card:focus-visible{transform:none}
  .th-card.th-conn::after{animation:none!important}
  .th-card > p{max-height:4.5em;opacity:1;margin:.1rem 0 0}
}


/* ===== Group-wise scroll activation (one .th-group at a time) ===== */
.th-group{
  position:relative;
  border-radius:20px;
  padding:1rem 1rem 1.1rem;
  transition:box-shadow .35s ease, background .35s ease;
}
.th-group.is-active{
  background:linear-gradient(180deg,rgba(243,112,33,.07),transparent 70%);
  box-shadow:inset 0 0 0 1px rgba(243,112,33,.22);
}
.th-group.is-active .th-gh{
  color:#fff;
  text-shadow:0 0 24px rgba(243,112,33,.45);
}
.th-group.is-active .th-gh small,
.th-group.is-active .th-gh{
  /* heading accent */
}
.th-group.is-active .th-gh::after{
  content:"";
  display:inline-block;
  width:2.2rem;height:2px;margin-left:.55rem;vertical-align:middle;
  background:linear-gradient(90deg,#F37021,transparent);
  box-shadow:0 0 10px rgba(243,112,33,.6);
}
/* All cards in active group: soft glow/lift together (not heavy dim on inactive) */
.th-group.is-active .th-card{
  border-color:rgba(243,112,33,.42);
  background:linear-gradient(135deg,rgba(243,112,33,.12),rgba(18,38,58,.95) 55%);
  box-shadow:0 0 0 1px rgba(243,112,33,.2),0 0 22px rgba(243,112,33,.22),0 10px 28px rgba(7,21,34,.35);
  transform:translateY(-4px) scale(1.01);
  z-index:2;
}
.th-group.is-active .th-card .th-ic{
  border-color:rgba(243,112,33,.55);
  box-shadow:0 0 12px rgba(243,112,33,.25);
}
/* Flowing connectors in active group */
.th-group.is-active .th-card.th-conn::after,
.th-group.is-active .th-card.th-conn::before{opacity:1}
.th-group.is-active .th-card.th-conn::after{animation:thFlow 1.4s linear infinite}
/* Per-card hover: stronger + description expand (unchanged intent) */
.th-card:hover,
.th-card:focus-visible,
.th-card.th-hot{
  border-color:#F37021 !important;
  background:linear-gradient(135deg,rgba(243,112,33,.2),rgba(18,38,58,.95) 55%) !important;
  box-shadow:0 0 0 1px rgba(243,112,33,.4),0 0 28px rgba(243,112,33,.4),0 16px 40px rgba(7,21,34,.45) !important;
  transform:translateY(-6px) scale(1.02) !important;
  z-index:4;
}
.th-card:hover > p,
.th-card:focus-visible > p,
.th-card.th-hot > p,
.th-card.active > p{
  max-height:4.5em;opacity:1;margin:.1rem 0 0;
}
@media (max-width:760px){
  .th-group.is-active .th-card{transform:translateY(-2px) scale(1.005)}
  .th-group.is-active{box-shadow:none;background:transparent}
}
@media (prefers-reduced-motion:reduce){
  .th-group.is-active .th-card,
  .th-card:hover,.th-card.th-hot{transform:none!important}
  .th-group.is-active .th-card.th-conn::after{animation:none!important}
  .th-card > p{max-height:4.5em;opacity:1;margin:.1rem 0 0}
}

/* PEB: suppress only the extra hover lift; keep normal active-group positioning. */
.th-card[data-fx="tilt"][href="/tools/peb-takeoff"]:hover {
  transform: none !important;
}
.th-group.is-active .th-card[data-fx="tilt"][href="/tools/peb-takeoff"]:hover {
  transform: translateY(-4px) scale(1.01) !important;
}

/* PEB: stay level with the rest of the row on touch devices.
   cb-fx.css cancels every transform on [data-fx="tilt"] when hover is
   unavailable. PEB is the only hub card with that attribute, so the
   cancellation also removes the active group's shared lift from this one
   card and leaves it sitting ~4px lower. Restore exactly the transform its
   siblings receive, and nothing else. */
@media (hover:none), (pointer:coarse) {
  .th-group.is-active .th-card[data-fx="tilt"][href="/tools/peb-takeoff"] {
    transform: translateY(-4px) scale(1.01) !important;
  }
}
@media (hover:none) and (max-width:760px), (pointer:coarse) and (max-width:760px) {
  .th-group.is-active .th-card[data-fx="tilt"][href="/tools/peb-takeoff"] {
    transform: translateY(-2px) scale(1.005) !important;
  }
}
@media (prefers-reduced-motion:reduce) {
  .th-group.is-active .th-card[data-fx="tilt"][href="/tools/peb-takeoff"] {
    transform: none !important;
  }
}