/* dp-card-stable v3 - tool cards (favorites, home, hubs): no vibration at the card's lower edge.
   tools-header.css lifted the card itself by 3px on hover. With the pointer on its last 3px the card moved out from
   under the pointer, lost :hover, dropped back, regained :hover ... and vibrated. The card box now stays still;
   the hover feedback is the border colour + a slightly stronger shadow. */
:root body .hexagon-item.hexagon-item:hover,
:root body .hexagon-item.hexagon-item:focus-visible{transform:none!important}
/* /tools cards: same lift problem */
.tl-card:hover,.tl-card:focus-visible{transform:none!important}
/* dp-favorites-pager v3 - ONE layout for /tools, /favorites and every category (hub) page:
   same width (1320), same title + subtitle, same card grid (auto-fill 200px, gap 14), same card look and the same spacing above/below the cards.
   /favorites additionally keeps ONE fixed height (title + 5 rows of cards + page buttons) so the footer never moves. */
/* ---- shared card grid (favorites + category pages) ---- */
.favorites-container{--dp-gap:14px;max-width:1320px!important;margin-left:auto!important;margin-right:auto!important;box-sizing:border-box}
.favorites-container .hexagon-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))!important;gap:var(--dp-gap)!important;align-content:start;margin:0!important;padding:0!important;max-width:none!important;width:auto!important}
.favorites-container .hexagon-grid>.tool-card{box-sizing:border-box;padding:16px!important;border:1px solid var(--border-soft,#e5e8f0)!important;border-radius:14px!important;background:var(--surface,#fff);min-width:0}
.favorites-container .hexagon-grid>.tool-card:hover{border-color:var(--primary-color,#00008b)!important;box-shadow:0 6px 16px rgba(20,24,40,.08)!important}
.favorites-container .hexagon-title{font-size:.98rem!important;font-weight:650!important;line-height:1.3;margin:6px 0 0!important}
.favorites-container .hexagon-desc{font-size:.84rem!important;line-height:1.45;margin:6px 0 0!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* ---- category (hub) pages: title block like /tools, small gap, cards, then the footer ---- */
.main-content1:has(.tools-hero){background:none!important;padding-bottom:0!important;margin-bottom:0!important}
.tools-hero{padding:6px 20px 8px!important}
.tools-hero h1{font-size:2.2rem!important;font-weight:800!important;letter-spacing:-.3px;margin:0 0 10px!important;color:var(--text-strong,#171a23)!important}
.tools-hero .hero-desc{font-size:1.05rem!important;line-height:1.5!important;max-width:760px!important;color:var(--text-muted,#7a7f8e)!important}
.favorites-container:not(:has(>h1)){margin-top:28px!important;margin-bottom:0!important;padding:0 20px 60px!important}
/* ---- /favorites only ---- */
.favorites-container:has(>h1){padding:110px 20px 60px!important;--dp-fav-rows:5;--dp-fav-h:164px}
.favorites-container>h1{font-size:2.2rem!important;font-weight:800!important;letter-spacing:-.3px;margin:0 0 10px!important;text-align:center;color:var(--text-strong,#171a23)}
.favorites-container .dp-fav-sub{text-align:center;max-width:760px;margin:0 auto 28px;color:var(--text-muted,#7a7f8e);font-size:1.05rem}
.favorites-container:has(>h1) .hexagon-grid{grid-auto-rows:var(--dp-fav-h);min-height:calc(var(--dp-fav-rows) * var(--dp-fav-h) + (var(--dp-fav-rows) - 1) * var(--dp-gap))}
.favorites-container:has(>h1) .hexagon-grid>.tool-card{height:var(--dp-fav-h)!important;min-height:0!important;max-height:var(--dp-fav-h)!important;overflow:hidden}
.favorites-container .hexagon-grid>.tool-card.dp-fav-hide{display:none!important}
.favorites-container .no-favorites{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:0!important;font-size:1.05rem;color:var(--text-muted,#7a7f8e);min-height:calc(var(--dp-fav-rows) * var(--dp-fav-h) + (var(--dp-fav-rows) - 1) * var(--dp-gap))}
.favorites-container .no-favorites i{font-size:2.4rem}
.favorites-container .no-favorites br{display:none}
.favorites-container .hexagon-grid>.no-favorites{grid-column:1/-1}
.dp-fav-pager{display:flex;justify-content:center;align-items:center;gap:8px;height:44px;margin:24px 0 0;flex-wrap:wrap}
.dp-fav-pb{min-width:40px;height:40px;padding:0 10px;border:1px solid var(--border-soft,#e5e8f0);border-radius:10px;background:var(--surface,#fff);color:var(--text-strong,#171a23);font:600 15px/1 inherit;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .2s,border-color .2s,color .2s}
.dp-fav-pb:hover:not(:disabled){border-color:var(--primary-color,#00008b);color:var(--primary-color,#00008b)}
.dp-fav-pb.is-on{background:var(--primary-color,#00008b);border-color:var(--primary-color,#00008b);color:#fff}
.dp-fav-pb:disabled{opacity:.4;cursor:default}
@media (max-width:768px){
 .favorites-container{--dp-gap:10px}
 .favorites-container .hexagon-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .favorites-container:has(>h1){padding-top:86px!important;--dp-fav-h:156px}
 .favorites-container>h1,.tools-hero h1{font-size:1.7rem!important}
}
@media (max-width:420px){.favorites-container .hexagon-grid{grid-template-columns:1fr!important}}

/* dp-cards v1: hub cards match homepage cards */
.favorites-container .hexagon-grid{gap:16px!important}
.favorites-container .hexagon-grid>.hexagon-item.tool-card{box-sizing:content-box!important;padding:18px!important;min-height:128px!important}
.favorites-container .hexagon-grid .hexagon-item .hexagon-title{font-size:.95rem!important;font-weight:600!important;line-height:1.3!important}
.favorites-container .hexagon-grid .hexagon-item .hexagon-desc{font-size:.82rem!important;line-height:1.4!important}
@media (max-width:768px){.favorites-container .hexagon-grid{gap:12px!important}.favorites-container .hexagon-grid>.hexagon-item.tool-card{min-height:118px!important;padding:16px!important}}
@media (max-width:576px){.favorites-container .hexagon-grid{gap:10px!important}.favorites-container .hexagon-grid>.hexagon-item.tool-card{min-height:108px!important;padding:14px!important}.favorites-container .hexagon-grid .hexagon-item .hexagon-title{font-size:.88rem!important}.favorites-container .hexagon-grid .hexagon-item .hexagon-desc{font-size:.78rem!important}}
@media (max-width:480px){.favorites-container .hexagon-grid{gap:8px!important}.favorites-container .hexagon-grid>.hexagon-item.tool-card{min-height:auto!important;padding:12px 14px!important}.favorites-container .hexagon-grid .hexagon-item .hexagon-title{font-size:.85rem!important}.favorites-container .hexagon-grid .hexagon-item .hexagon-desc{font-size:.76rem!important;-webkit-line-clamp:1!important}.favorites-container .hexagon-grid>.hexagon-item.tool-card{border-radius:10px!important}}

/* dp-cards v2: hub grid width/columns match homepage */
.favorites-container:has(> .hexagon-grid){max-width:1632px!important;padding-left:16px!important;padding-right:16px!important;box-sizing:border-box!important}
.favorites-container .hexagon-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important}
@media (max-width:1200px){.favorites-container .hexagon-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media (max-width:992px){.favorites-container .hexagon-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media (max-width:768px){.favorites-container .hexagon-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.favorites-container:has(> .hexagon-grid){padding-left:12px!important;padding-right:12px!important}}
@media (max-width:480px){.favorites-container .hexagon-grid{grid-template-columns:1fr!important}.favorites-container:has(> .hexagon-grid){padding-left:22px!important;padding-right:22px!important}}

/* dp-ux v1: readability + contrast (light mode only) */
html[data-theme="light"] .dpb{--dpb-muted:#596170!important}
html[data-theme="light"] .tools-hero .hero-desc{color:#596170!important}
@media (prefers-color-scheme: light){html:not([data-theme^="dark"]) .dpb{--dpb-muted:#596170!important}html:not([data-theme^="dark"]) .tools-hero .hero-desc{color:#596170!important}}
@media (max-width:768px){.faq-item p{font-size:15px!important}}
