/* ============================================================
   Pricing Cards (dashboard) - same design as index_design.php
   All rules are scoped under .pc-zone so nothing else is affected.
   ============================================================ */

/* [Theme Variables] Start */
.pc-zone { --brand:#FF4A17; --secondary:#101C2A; --bg:#f2f2fc; --surface:#ffffff; --surface2:#f1f5f9; --text:#0f172a; --muted:#5b6b82; --border:rgba(15,23,42,.1);
  --shadow:0 10px 30px -12px rgba(15,23,42,.18); --shadow-hover:0 22px 44px -14px rgba(255,74,23,.3);
  font-family:'Plus Jakarta Sans','Manrope',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif; color:var(--text); }
html.dark .pc-zone { --bg:#050b17; --surface:#0e1a2e; --surface2:#15243b; --text:#f1f5f9; --muted:#9fb0c7; --border:rgba(255,255,255,.1);
  --shadow:0 10px 30px -12px rgba(0,0,0,.6); --shadow-hover:0 22px 44px -14px rgba(255,74,23,.35); }
.pc-zone *, .pc-zone *::before, .pc-zone *::after { box-sizing:border-box; }
.pc-zone a { text-decoration:none; }
.pc-zone h3 { margin-top:0; }
.pc-zone .is-hidden { display:none !important; }
/* [Theme Variables] End */

/* [Grid Containers] Start */
.pc-zone .pc-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:22px; width:100%; padding:6px 4px 4px; margin:0; }
.pc-zone .pc-grid-combo { grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); }
.pc-zone .no-result { display:none; grid-column:1/-1; text-align:center; padding:34px 10px; color:var(--muted); font-weight:700; }
.pc-zone .no-result.show { display:block; }
@media (max-width:520px) { .pc-zone .pc-grid, .pc-zone .pc-grid-combo { grid-template-columns:1fr; } }
/* [Grid Containers] End */

/* [Extra Card Rules] Start */
.pc-zone .package-title { text-transform:capitalize; min-width:0; overflow-wrap:anywhere; }
.pc-zone .package-title.pt-lg { font-size:1.4rem; }
.pc-zone .package-title.pt-md { font-size:1.3rem; }
.pc-zone .package-title.pt-sm { font-size:1.1rem; }
.pc-zone .package-title.pt-xs { font-size:.9rem; }
.pc-zone .pc-sub { display:block; margin-top:3px; font-size:.68rem; font-weight:700; color:var(--muted); text-transform:none; letter-spacing:0; }
.pc-zone .modern-card { z-index:0; }
.pc-zone .tk .tk-title { text-transform:capitalize; }
.pc-zone .modern-card.is-out .status-overlay { display:none; }
/* [Extra Card Rules] End */

/* [Scoped Card Rules From Design] Start */
.pc-zone .modern-card { position: relative; border-radius: 28px; transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275); display: flex; flex-direction: column; height: 100%; overflow: hidden; transform: translateY(-5px); }
.pc-zone .modern-card { background: #ffffff; border: 1px solid rgba(0, 0, 0, 0.05); box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.15), 0 10px 15px -10px rgba(0, 0, 0, 0.1); }
.pc-zone .modern-card:hover { transform: translateY(-15px) scale(1.02); box-shadow: 0 45px 70px -20px rgba(0, 0, 0, 0.2), 0 15px 30px -15px rgba(255, 74, 23, 0.1); border-color: var(--brand); }
html.dark .pc-zone .modern-card { background: #111827; border: 1px solid rgba(255, 255, 255, 0.06); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6), 0 10px 20px -5px rgba(0, 0, 0, 0.4); }
html.dark .pc-zone .modern-card:hover { transform: translateY(-15px) scale(1.02); background: #1e293b; box-shadow: 0 40px 80px -25px rgba(0, 0, 0, 0.8), 0 0 30px -10px rgba(255, 74, 23, 0.3); border-color: var(--brand); }
.pc-zone .package-title { font-family: 'Manrope', sans-serif; transition: color 0.4s ease; font-size: 1.65rem; font-weight: 900; line-height: 1.2; letter-spacing: -0.02em; }
.pc-zone .modern-card:hover .package-title { color: var(--brand) !important; }
.pc-zone .price-main { color: #101C2A; font-weight: 950; font-size: 1.60rem; text-shadow: 0 2px 4px rgba(0,0,0,0.03); text-align: right; }
html.dark .pc-zone .price-main { color: #ffffff; }
.pc-zone .price-strike { text-decoration: line-through; color: #ef4444; opacity: 0.8; font-size: 0.85rem; font-weight: 700; }
.pc-zone .tool-list-scroller { height: 144px; overflow-y: auto; margin-bottom: 1.2rem; padding-right: 6px; padding-left: 8px; }
.pc-zone .tool-list-scroller::-webkit-scrollbar { width: 3px; }
.pc-zone .tool-list-scroller::-webkit-scrollbar-thumb { background: var(--brand); border-radius: 10px; }
.pc-zone .tool-list-item { padding: 1px 0; display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; height: 24px; }
.pc-zone .list-item-icon { transition: all 0.4s ease; color: var(--brand); font-size: 0.75rem; }
.pc-zone .modern-card:hover .list-item-icon { transform: scale(1.2); color: #06B6D4 !important; }
.pc-zone .gem-icon { font-size: 1.8rem; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #FF4A17, #101C2A); -webkit-background-clip: text; -webkit-text-fill-color: transparent; transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
.pc-zone .modern-card:hover .gem-icon { transform: rotate(12deg) scale(1.15); }
.pc-zone .tool-logo-background { width: 100%; height: 180px; background-color: #fff; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid rgba(0, 0, 0, 0.05); overflow: hidden; border-radius: 28px 28px 0 0; }
.pc-zone .tool-logo-background img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s ease; }
.pc-zone .details-btn { position: absolute; top: 0; right: 0; background: var(--brand); color: white; font-size: 0.65rem; font-weight: 800; padding: 6px 14px; border-bottom-left-radius: 14px; z-index: 10; text-transform: uppercase; box-shadow: -2px 2px 10px rgba(0,0,0,0.1); transition: all 0.4s ease; }
.pc-zone .details-btn:hover { background: var(--secondary); padding-right: 18px; }
.pc-zone .combo-access-info { display: flex; align-items: center; gap: 6px; margin-bottom: 0.5rem; font-size: 0.75rem; font-weight: 900; color: #64748b; justify-content: center; }
.pc-zone .single-access-info { display: flex; align-items: center; gap: 6px; margin-bottom: 0.20rem; font-size: 0.68rem; font-weight: 900; color: #64748b; justify-content: center; }
html.dark .pc-zone .combo-access-info,html.dark .pc-zone .single-access-info { color: #94a3b8; }
.pc-zone .card-bottom-content { padding: 1.25rem 1.25rem 1.5rem 1.25rem; flex: 1; display: flex; flex-direction: column; }
.pc-zone .package-title { color:var(--text); }
.pc-zone .sc-row { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; }
.pc-zone .sc-price { display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:8px; }
.pc-zone .sc-per { font-size:.75rem; font-weight:700; opacity:.6; margin-left:3px; }
.pc-zone .single-access-info { margin:auto 0 12px; padding-top:6px; }
.pc-zone .single-access-info i { color:var(--brand); }
.pc-zone .tk { position:relative; display:flex; flex-direction:column; border-radius:24px; background:var(--surface); border:1px solid var(--border); box-shadow:var(--shadow); overflow:hidden; transition:transform .3s, box-shadow .3s, border-color .3s; }
.pc-zone .tk:hover { transform:translateY(-6px); border-color:var(--brand); box-shadow:var(--shadow-hover); }
.pc-zone .tk-top { position:relative; overflow:hidden; padding:22px 22px 24px; color:#fff; background:linear-gradient(135deg,#101C2A,#1d3557); }
html.dark .pc-zone .tk-top { background:linear-gradient(135deg,#1b2f55,#0d1a30); }
.pc-zone .tk-top::after { content:""; position:absolute; right:-46px; top:-46px; width:160px; height:160px; border-radius:50%; background:rgba(255,74,23,.3); }
.pc-zone .tk-top > * { position:relative; z-index:1; }
.pc-zone .tk-row { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.pc-zone .tk-chip { display:inline-flex; align-items:center; gap:6px; padding:5px 11px; border-radius:999px; background:rgba(255,255,255,.14); font-size:.68rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.pc-zone .tk-ic { width:42px; height:42px; border-radius:50%; background:var(--brand); display:flex; align-items:center; justify-content:center; box-shadow:0 6px 16px rgba(255,74,23,.5); }
.pc-zone .tk-title { margin:0 0 14px; min-height:2.6em; font-family:'Manrope','Plus Jakarta Sans',sans-serif; font-size:1.3rem; font-weight:800; line-height:1.3; color:#fff; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.pc-zone .tk-price { display:flex; align-items:baseline; gap:6px; }
.pc-zone .tk-now { font-size:2.5rem; font-weight:800; line-height:1; letter-spacing:-.02em; }
.pc-zone .tk-per { font-size:.78rem; font-weight:700; opacity:.7; }
.pc-zone .tk-sub { display:flex; align-items:center; gap:10px; margin-top:10px; min-height:24px; }
.pc-zone .tk-old { text-decoration:line-through; opacity:.6; font-weight:700; }
.pc-zone .tk-off { padding:3px 10px; border-radius:999px; background:#10b981; font-size:.7rem; font-weight:800; }
.pc-zone .tk-cut { position:relative; height:0; margin:0 20px; border-top:2px dashed var(--border); }
.pc-zone .tk-cut::before,.pc-zone .tk-cut::after { content:""; position:absolute; top:-12px; width:22px; height:22px; border-radius:50%; background:var(--bg); border:1px solid var(--border); }
.pc-zone .tk-cut::before { left:-31px; }
.pc-zone .tk-cut::after { right:-31px; }
.pc-zone .tk-body { display:flex; flex-direction:column; flex:1; padding:22px; }
.pc-zone .tk-label { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:12px; font-size:.68rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.pc-zone .tk-label b { color:var(--brand); text-transform:none; letter-spacing:0; }
.pc-zone .tk-tools { display:grid; gap:8px; grid-auto-rows:36px; align-content:start; flex:1; margin-bottom:18px; min-height:calc(var(--rows,4) * 36px + (var(--rows,4) - 1) * 8px); }
.pc-zone .tk-tools.c2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.pc-zone .tk-tools.c3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.pc-zone .tk-tool { display:flex; align-items:center; gap:8px; height:36px; min-width:0; padding:0 11px; border-radius:10px; background:var(--surface2); border:1px solid var(--border); color:var(--text); font-size:.78rem; font-weight:700; text-transform:capitalize; transition:background .2s, border-color .2s, color .2s, transform .2s; }
.pc-zone .tk-tool::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--brand); flex-shrink:0; transition:background .2s; }
.pc-zone .tk-tool span { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pc-zone .tk-tool i { font-size:.55rem; opacity:.5; }
.pc-zone .tk-tool:hover { background:var(--brand); border-color:var(--brand); color:#fff; transform:translateY(-2px); }
.pc-zone .tk-tool:hover::before { background:#fff; }
.pc-zone .tk-tool:hover i { opacity:1; }
.pc-zone .tk-tools.c3 .tk-tool { font-size:.72rem; padding:0 8px; gap:6px; }
.pc-zone .tk-tools.c3 .tk-tool i { display:none; }
.pc-zone .tk-body form { margin:0; }
.pc-zone .access { margin:0 0 12px; }
.pc-zone .is-current { outline:3px solid var(--brand); outline-offset:4px; }
.pc-zone .buy-btn { position:relative; isolation:isolate; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; padding:6px 6px 6px 22px; border:0; border-radius:999px; background:var(--brand); color:#fff; font-family:inherit; font-size:.82rem; font-weight:800; letter-spacing:.07em; text-transform:uppercase; cursor:pointer; box-shadow:0 10px 22px rgba(255,74,23,.35); transition:box-shadow .3s, transform .3s; }
.pc-zone .buy-btn::before { content:""; position:absolute; inset:0; z-index:-1; background:#101C2A; transform:translateX(-101%); transition:transform .45s cubic-bezier(.65,0,.35,1); }
.pc-zone .buy-btn:hover { transform:translateY(-2px); box-shadow:0 14px 28px rgba(16,28,42,.35); }
.pc-zone .buy-btn:hover::before { transform:none; }
.pc-zone .buy-btn:active { transform:scale(.98); }
.pc-zone .bb-text { display:inline-flex; align-items:center; gap:9px; }
.pc-zone .bb-arrow { width:38px; height:38px; flex-shrink:0; border-radius:50%; background:#fff; color:var(--brand); display:flex; align-items:center; justify-content:center; transition:transform .45s cubic-bezier(.65,0,.35,1); }
.pc-zone .buy-btn:hover .bb-arrow { transform:rotate(-45deg) scale(1.08); }
.pc-zone .tk-tools { grid-auto-rows:auto; grid-template-rows:repeat(var(--r,4),minmax(36px,1fr)); align-content:stretch; }
.pc-zone .tk-tools.c1 { grid-template-columns:minmax(0,1fr); }
.pc-zone .tk-tool { position:relative; height:100%; max-height:56px; align-self:center; }
.pc-zone .tk-tool:hover { z-index:20; }
.pc-zone .tk-tool::after { content:"View details for " attr(data-name) " \2197"; position:absolute; bottom:calc(100% + 10px); left:var(--l,50%); right:var(--r2,auto); transform:translate(var(--tx,-50%),6px); padding:7px 12px; border-radius:9px; background:#101C2A; color:#fff; border:1px solid var(--brand); box-shadow:0 10px 24px rgba(0,0,0,.35); font-size:.72rem; font-weight:700; letter-spacing:0; text-transform:none; white-space:nowrap; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .1s, transform .1s; z-index:30; }
.pc-zone .tk-tool:hover::after,.pc-zone .tk-tool:focus-visible::after { opacity:1; visibility:visible; transform:translate(var(--tx,-50%),0); }
.pc-zone .tk-tools.c3 .tk-item:nth-child(3n+1) .tk-tool,.pc-zone .tk-tools.c2 .tk-item:nth-child(odd) .tk-tool { --l:0; --tx:0; }
.pc-zone .tk-tools.c3 .tk-item:nth-child(3n) .tk-tool,.pc-zone .tk-tools.c2 .tk-item:nth-child(even) .tk-tool { --l:auto; --r2:0; --tx:0; }
.pc-zone .out-note { display:block; margin-top:3px; font-size:.65rem; font-weight:700; color:#ef4444; letter-spacing:0; }
.pc-zone .modern-card.is-out .tool-logo-background { filter:grayscale(1); opacity:.65; }
.pc-zone .buy-btn.is-out { background:#94a3b8; box-shadow:none; cursor:not-allowed; justify-content:center; padding:14px 22px; }
.pc-zone .buy-btn.is-out::before { display:none; }
.pc-zone .buy-btn.is-out:hover { transform:none; box-shadow:none; }
.pc-zone .modern-card.is-out { filter:grayscale(1); opacity:.55; pointer-events:none; user-select:none; transform:none; box-shadow:none; }
.pc-zone .modern-card.is-out .price-main,.pc-zone .modern-card.is-out .price-strike,.pc-zone .modern-card.is-out .sc-per { text-decoration:line-through; }
.pc-zone .modern-card.is-out .tool-logo-background { filter:none; opacity:1; }
/* [Scoped Card Rules From Design] End */

/* [Compact Size] Start - smaller cards for home and dashboard */
.pc-zone .pc-grid { grid-template-columns:repeat(auto-fill,minmax(215px,1fr)); gap:16px; }
.pc-zone .pc-grid-combo { grid-template-columns:repeat(auto-fill,minmax(285px,1fr)); }
.pc-zone .modern-card { border-radius:20px; transform:none; }
.pc-zone .modern-card:hover { transform:translateY(-6px); }
.pc-zone .tool-logo-background { height:112px; border-radius:20px 20px 0 0; }
.pc-zone .tool-logo-img { max-height:100%; max-width:100%; object-fit:contain; }
.pc-zone .card-bottom-content { padding:.85rem 1rem 1rem; }
.pc-zone .package-title { font-size:1.15rem; }
.pc-zone .package-title.pt-lg { font-size:1.05rem; }
.pc-zone .package-title.pt-md { font-size:.98rem; }
.pc-zone .package-title.pt-sm { font-size:.88rem; }
.pc-zone .package-title.pt-xs { font-size:.78rem; }
.pc-zone .gem-icon { font-size:1.25rem; }
.pc-zone .sc-row { margin-bottom:6px; gap:8px; }
.pc-zone .sc-price { margin-bottom:4px; }
.pc-zone .price-main { font-size:1.3rem; }
.pc-zone .price-strike { font-size:.76rem; }
.pc-zone .sc-per { font-size:.68rem; }
.pc-zone .single-access-info { margin:auto 0 8px; padding-top:2px; font-size:.64rem; }
.pc-zone .details-btn { padding:4px 11px; font-size:.58rem; border-bottom-left-radius:12px; }
.pc-zone .buy-btn { font-size:.74rem; padding:4px 4px 4px 16px; }
.pc-zone .bb-arrow { width:30px; height:30px; }
.pc-zone .tk { border-radius:18px; }
.pc-zone .tk-top { padding:15px 16px 16px; }
.pc-zone .tk-row { margin-bottom:8px; }
.pc-zone .tk-chip { padding:4px 9px; font-size:.62rem; }
.pc-zone .tk-ic { width:32px; height:32px; font-size:.85rem; }
.pc-zone .tk-title { margin:0 0 8px; min-height:2.4em; font-size:1.05rem; }
.pc-zone .tk-now { font-size:1.9rem; }
.pc-zone .tk-sub { margin-top:6px; min-height:20px; gap:8px; }
.pc-zone .tk-body { padding:14px 16px 16px; }
.pc-zone .tk-label { margin-bottom:8px; font-size:.62rem; }
.pc-zone .tk-tools { gap:6px; margin-bottom:12px; grid-template-rows:repeat(var(--r,4),minmax(30px,1fr)); min-height:calc(var(--rows,4) * 30px + (var(--rows,4) - 1) * 6px); }
.pc-zone .tk-tool { padding:0 9px; font-size:.72rem; max-height:44px; }
.pc-zone .access { margin:0 0 8px; font-size:.7rem; }
@media (max-width:520px) { .pc-zone .pc-grid { grid-template-columns:repeat(2,1fr); gap:12px; } .pc-zone .pc-grid-combo { grid-template-columns:1fr; } .pc-zone .tool-logo-background { height:92px; } .pc-zone .package-title { font-size:1rem; } .pc-zone .price-main { font-size:1.1rem; } .pc-zone .buy-btn .bb-text { font-size:.68rem; } }
/* [Compact Size] End */

/* [Home Page Variables] Start */
.pc-zone.pc-home { --bg:#f3f6fb; }
html.dark .pc-zone.pc-home { --bg:#050b17; }
/* [Home Page Variables] End */

/* [Search Highlight] Start */
.pc-zone mark.hl { background:#ffe14d; color:#111; padding:0 2px; border-radius:4px; box-shadow:0 0 0 1px rgba(0,0,0,.08); }
/* [Search Highlight] End */

/* [Small Phone Card Fit] Start */
@media (max-width:520px) {
  .pc-zone .buy-btn { padding:3px 3px 3px 10px; gap:4px; }
  .pc-zone .buy-btn .bb-text { white-space:nowrap; gap:0; font-size:.7rem; }
  .pc-zone .buy-btn .bb-text i { display:none; }
  .pc-zone .bb-arrow { width:26px; height:26px; }
  .pc-zone .single-access-info { font-size:.58rem; gap:4px; text-align:center; }
  .pc-zone .sc-per { display:none; }
}
/* [Small Phone Card Fit] End */


/* [Single Tool Card - square logo] Start
   Logo area is a square filling the card width (cards are 250px wide = 250x250). Order stays: image, name, price, button. */
.pc-zone .pc-grid:not(.pc-grid-combo) { grid-template-columns:repeat(auto-fill,250px); justify-content:center; }
.pc-zone .modern-card[data-g="tool"] .tool-logo-background { width:100%; height:auto; aspect-ratio:1 / 1; padding:0; background:#fff; }
.pc-zone .modern-card[data-g="tool"] .tool-logo-background img.tool-logo-img { width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.pc-zone .modern-card[data-g="tool"] .card-bottom-content { display:flex; flex-direction:column; flex:1 1 auto; }
.pc-zone .modern-card[data-g="tool"] .card-bottom-content .buy-btn { margin-top:auto; }
.pc-zone .modern-card[data-g="tool"] .sc-price { margin-bottom:12px; }
/* [Single Tool Card - square logo] End */

/* [Combo Card - tool list] Start
   Tools keep one fixed small gap for any count; spare card height goes below the list, not between tools. */
.pc-zone .tk-tools { grid-template-rows:none; grid-auto-rows:36px; align-content:start; flex:0 0 auto; min-height:0; margin-bottom:12px; }
.pc-zone .tk-item { position:relative; min-width:0; height:36px; }
.pc-zone .tk-item .tk-tool { height:100%; max-height:none; width:100%; }
.pc-zone .tk-item.has-note .tk-tool { padding-right:30px; }
.pc-zone .tk-nb { position:absolute; right:5px; top:50%; transform:translateY(-50%); width:22px; height:22px; border:0; border-radius:7px; background:rgba(127,127,127,.18); color:var(--text); display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:.6rem; z-index:3; transition:background .25s, transform .35s, color .25s; }
.pc-zone .tk-nb:hover, .pc-zone .tk-nb[aria-expanded="true"] { background:var(--brand); color:#fff; }
.pc-zone .tk-nb[aria-expanded="true"] { transform:translateY(-50%) rotate(180deg); }
.pc-zone .tk-item:hover .tk-nb { color:#fff; }
.pc-zone .tk-notes { display:grid; grid-template-rows:0fr; opacity:0; margin-bottom:auto; transition:grid-template-rows .5s cubic-bezier(.4,0,.2,1), opacity .4s ease; }
.pc-zone .tk-notes.open { grid-template-rows:1fr; opacity:1; margin-bottom:0; }
.pc-zone .tk-notes-in { overflow:hidden; min-height:0; }
.pc-zone .tk-notes-box { margin:2px 0 14px; padding:11px 13px; border-radius:12px; background:var(--surface2); border:1px solid var(--border); border-left:3px solid var(--brand); font-size:.78rem; line-height:1.55; color:var(--text); }
.pc-zone .tk-notes-head { display:block; margin-bottom:4px; font-size:.78rem; color:var(--brand); }
.pc-zone .tk-body .access { margin-top:auto; }
.pc-zone .tk-notes.open ~ .access { margin-top:0; }
/* [Combo Card - tool list] End */

/* [Single Tool Card - notes dropdown] Start */
.pc-zone .tn-wrap { margin:0 0 12px; }
.pc-zone .tn-toggle { width:100%; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:7px 12px; border-radius:10px; border:1px solid var(--border); background:var(--surface2); color:var(--text); font-size:.74rem; font-weight:700; cursor:pointer; transition:border-color .25s; }
.pc-zone .tn-toggle:hover { border-color:var(--brand); }
.pc-zone .tn-toggle i.fa-circle-info { color:var(--brand); margin-right:5px; }
.pc-zone .tn-caret { font-size:.6rem; transition:transform .4s ease; }
.pc-zone .tn-toggle[aria-expanded="true"] .tn-caret { transform:rotate(180deg); }
.pc-zone .tn-panel { display:grid; grid-template-rows:0fr; opacity:0; transition:grid-template-rows .5s cubic-bezier(.4,0,.2,1), opacity .4s ease; }
.pc-zone .tn-wrap.open .tn-panel { grid-template-rows:1fr; opacity:1; }
.pc-zone .tn-inner { overflow:hidden; min-height:0; }
.pc-zone .tn-box { margin-top:8px; padding:10px 12px; border-radius:10px; background:var(--surface2); border:1px solid var(--border); border-left:3px solid var(--brand); font-size:.76rem; line-height:1.5; color:var(--text); text-align:left; }
/* [Single Tool Card - notes dropdown] End */


/* [Single Tool Card - v3 compact] Start
   Logo box 4.1 / 2.6, full width. No notes row inside the card (notes open in a small floating popup), so every card has the same
   height and there is no empty gap between the price and the Buy button. Light transitions only (fast on big pages). */
.pc-zone .modern-card[data-g="tool"] { border-radius:16px; transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; box-shadow:0 6px 18px -10px rgba(15,23,42,.28); }
.pc-zone .modern-card[data-g="tool"]:hover { transform:translateY(-3px); box-shadow:0 14px 28px -14px rgba(255,74,23,.35); }
.pc-zone .modern-card[data-g="tool"] .tool-logo-background { width:100%; height:auto; aspect-ratio:4.1 / 2.6; padding:0; display:block; background:var(--surface2); border-radius:16px 16px 0 0; border-bottom:0; }
.pc-zone .modern-card[data-g="tool"] .tool-logo-background img.tool-logo-img { width:100%; height:100%; max-width:none; max-height:none; object-fit:cover; object-position:center; display:block; margin:0; transition:none; }
.pc-zone .modern-card[data-g="tool"] .card-bottom-content { padding:.7rem .85rem .85rem; gap:0; }
.pc-zone .modern-card[data-g="tool"] .gem-icon { display:none; }
.pc-zone .modern-card[data-g="tool"] .sc-row { margin:0 0 6px; display:block; }
.pc-zone .modern-card[data-g="tool"] .package-title { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:1.02rem; font-weight:800; letter-spacing:-.01em; line-height:1.25; }
.pc-zone .modern-card[data-g="tool"] .package-title.pt-lg { font-size:.96rem; }
.pc-zone .modern-card[data-g="tool"] .package-title.pt-md { font-size:.9rem; }
.pc-zone .modern-card[data-g="tool"] .package-title.pt-sm { font-size:.82rem; }
.pc-zone .modern-card[data-g="tool"] .package-title.pt-xs { font-size:.74rem; }
.pc-zone .modern-card[data-g="tool"] .pc-sub, .pc-zone .modern-card[data-g="tool"] .out-note { display:inline; margin:0 0 0 6px; font-size:.62rem; }
/* price: big price first, old price after it; button follows right away */
.pc-zone .modern-card[data-g="tool"] .sc-price { display:flex; flex-direction:row-reverse; justify-content:flex-end; align-items:baseline; gap:8px; margin:0 0 10px; }
.pc-zone .modern-card[data-g="tool"] .price-main { text-align:left; font-size:1.3rem; font-weight:800; line-height:1.1; }
.pc-zone .modern-card[data-g="tool"] .price-strike { font-size:.78rem; }
.pc-zone .modern-card[data-g="tool"] .sc-per { font-size:.68rem; opacity:.6; }
.pc-zone .modern-card[data-g="tool"] .card-bottom-content .buy-btn { margin-top:auto; font-size:.72rem; padding:3px 3px 3px 14px; box-shadow:0 8px 16px -8px rgba(255,74,23,.7); }
.pc-zone .modern-card[data-g="tool"] .bb-arrow { width:28px; height:28px; }
.pc-zone .modern-card[data-g="tool"] .details-btn { transition:background .2s; }
/* Combo cards: no heavy animation either */
.pc-zone .tk { transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.pc-zone .tk-tool { transition:background .15s, border-color .15s, color .15s; }
.pc-zone .tk-tool:hover { transform:none; }
/* [Single Tool Card - v3 compact] End */

/* [Notes Button + Floating Popup] Start */
.pc-zone .pc-note-btn { position:absolute; z-index:11; display:inline-flex; align-items:center; gap:5px; border:0; cursor:pointer; font-family:inherit; color:#fff; background:rgba(16,28,42,.82); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); transition:background .15s; }
.pc-zone .pc-note-btn:hover, .pc-zone .pc-note-btn[aria-expanded="true"] { background:var(--brand); }
.pc-zone .pc-note-btn.pc-note-img { top:10px; left:10px; padding:5px 10px 5px 8px; border-radius:999px; font-size:.64rem; font-weight:800; letter-spacing:.03em; text-transform:uppercase; box-shadow:0 4px 12px rgba(0,0,0,.25); }
.pc-zone .pc-note-btn.pc-note-img i { color:#ffb199; font-size:.7rem; }
.pc-zone .pc-note-btn.pc-note-img:hover i, .pc-zone .pc-note-btn.pc-note-img[aria-expanded="true"] i { color:#fff; }
/* combo: small icon button at the right side of the tool chip */
.pc-zone .tk-nb.pc-note-btn { z-index:40; right:5px; top:50%; transform:translateY(-50%); width:22px; height:22px; padding:0; justify-content:center; border-radius:7px; background:rgba(127,127,127,.2); color:var(--brand); font-size:.62rem; backdrop-filter:none; -webkit-backdrop-filter:none; }
.pc-zone .tk-nb.pc-note-btn:hover, .pc-zone .tk-nb.pc-note-btn[aria-expanded="true"] { background:var(--brand); color:#fff; transform:translateY(-50%); }
.pc-zone .tk-item:hover .tk-nb.pc-note-btn { color:#fff; background:rgba(255,255,255,.28); }
.pc-zone .tk-item:hover .tk-nb.pc-note-btn:hover { background:var(--brand); }
.pc-zone .tk-notes { display:none; }

.pc-pop { position:fixed; z-index:2147483200; left:0; top:0; width:min(280px, calc(100vw - 16px)); border-radius:14px; background:#fff; color:#0f172a; border:1px solid rgba(15,23,42,.12); box-shadow:0 18px 40px -12px rgba(15,23,42,.45); font-family:'Plus Jakarta Sans','Manrope',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(4px); transition:opacity .12s ease, transform .12s ease; }
.pc-pop.show { opacity:1; visibility:visible; pointer-events:auto; transform:none; }
.pc-pop.up { transform:translateY(-4px); } .pc-pop.up.show { transform:none; }
.pc-pop-h { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 8px 9px 14px; border-bottom:1px solid rgba(15,23,42,.08); }
.pc-pop-t { font-size:.78rem; font-weight:800; color:#FF4A17; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pc-pop-x { flex-shrink:0; width:24px; height:24px; border:0; border-radius:50%; background:rgba(127,127,127,.15); color:inherit; font-size:1.05rem; line-height:1; cursor:pointer; }
.pc-pop-x:hover { background:#FF4A17; color:#fff; }
.pc-pop-b { padding:11px 14px 13px; font-size:.8rem; line-height:1.55; max-height:min(240px, 50vh); overflow-y:auto; word-break:break-word; }
.pc-pop-ar { position:absolute; left:var(--ax,50%); top:-6px; width:12px; height:12px; margin-left:-6px; background:#fff; border-left:1px solid rgba(15,23,42,.12); border-top:1px solid rgba(15,23,42,.12); transform:rotate(45deg); }
.pc-pop.up .pc-pop-ar { top:auto; bottom:-6px; transform:rotate(225deg); }
html.dark .pc-pop { background:#0e1a2e; color:#f1f5f9; border-color:rgba(255,255,255,.14); }
html.dark .pc-pop-h { border-color:rgba(255,255,255,.1); }
html.dark .pc-pop-ar { background:#0e1a2e; border-color:rgba(255,255,255,.14); }
/* [Combo Note Click Fix] Start - chip link gets z-index 20 on hover; the note button sits above it and swallows the click */
.pc-zone .tk-item .tk-nb { z-index:40; pointer-events:auto; }
/* [Combo Note Click Fix] End */
/* [Auto Note Flash] Start */
@keyframes pcNoteFlash { 0%,100% { box-shadow:0 0 0 0 rgba(255,74,23,.7); transform:scale(1); } 50% { box-shadow:0 0 0 9px rgba(255,74,23,0); transform:scale(1.08); } }
.pc-zone .pc-note-btn.pc-note-flash { background:var(--brand); animation:pcNoteFlash 1s ease-in-out 2; }
/* [Auto Note Flash] End */
/* [Notes Button + Floating Popup] End */

/* [Home Page - 5 single tool cards per line] Start
   Desktop: 5 cards in one row. Tablet / phone step down so cards never get too narrow. */
.pc-zone.pc-home .pc-grid:not(.pc-grid-combo) { grid-template-columns:repeat(5,minmax(0,1fr)); justify-content:stretch; gap:16px; }
@media (max-width:1200px) { .pc-zone.pc-home .pc-grid:not(.pc-grid-combo) { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (max-width:900px)  { .pc-zone.pc-home .pc-grid:not(.pc-grid-combo) { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:600px)  { .pc-zone.pc-home .pc-grid:not(.pc-grid-combo) { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } }
/* [Home Page - 5 single tool cards per line] End */
