/* =========================
   SupAI V2 UI stylesheet
   Responsive, mobile menu, auth, finder, footer
   ========================= */

/* ---------- Theme tokens ---------- */
:root {
  --v2-bg-start: #11b0b8;            /* teal */
  --v2-bg-end: #0b2a4a;              /* deep blue */
  --v2-fg: #ffffff;
  --v2-muted: rgb(88 88 88 / 70%);
  --v2-card: rgb(255 255 255 / 28%);
  --v2-border: rgba(255,255,255,.15);
  --v2-accent: #00657f;
}

/* ---------- Base ---------- */
body.homev2 {
  background: radial-gradient(1500px 900px at 50% -100px, #ffffff 10%, #0ab6b452 100%);
}
.homev2 a { color: var(--v2-accent); text-decoration: none; }
.homev2 a:hover { text-decoration: underline; }

.v2-wrap { min-height: 74dvh; display: grid; grid-template-rows: auto 1fr auto; }
.v2-container { width: min(1450px, 92vw); margin-inline: auto; margin-top: 85px; gap:16px;}

.all-tools-header section h2 {
    margin: 0;
    font-size: 22px;
    letter-spacing: .2px;
    color: rgb(0, 0, 0);
    line-height: 45px;
    text-align: center;
    margin-bottom: 32px;
}
.main-menu .navigation li a{
      font-size: 14px;
    line-height: 22px;
    font-weight: 500;
    gap: 10px;
    display: flex;
    align-items: center;
}

/* =======================================================================
   NAV
   Markup:
   <header class="v2-container v2-nav"> ... <button class="menu-toggle">☰</button> ... <nav id="mainNav" class="main-menu">...</nav>
   ======================================================================= */
.v2-nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  position:relative;
  z-index:200;
  top:40px;
  margin:0 auto;
  width:min(1450px,96vw);
  padding:10px 14px;
  border-radius:9999px;
  background:#fff;
  border:1px solid #ffffff52;
  box-shadow:0 20px 60px rgba(0,0,0,.15);
  backdrop-filter:blur(7px);
  flex-wrap:wrap;
}
.v2-nav .left,
.v2-nav .right{
  display:flex;
  align-items:center;
  gap:18px;
  flex:1 1 auto;
  min-width:220px;
}
.v2-nav .brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.2px;color:#2b2b2b;text-decoration:none;}
.v2-nav .brand img{height:clamp(32px,5.2vh,48px);width:auto;border-radius:6px;}
.v2-nav a{color:#353535;opacity:.9;white-space:nowrap;text-decoration:none;}
.v2-nav a:hover{text-decoration:underline;}
.v2-nav .cta{
  background:#000;
  color:#fff;
  padding:10px 14px;
  border-radius:9999px;
  font-weight:600;
  display:inline-block;
}

/* top level ul */
.main-menu{display:block;}
.navigation{list-style:none;display:flex;gap:16px;margin:0;padding:0;align-items:center;flex-wrap:wrap;}
.navigation>li{position:relative;}
.navigation a{display:inline-block;padding:8px 6px;}

/* dropdown on desktop */
.submenu{
  position:absolute;
  left:0;
  top:calc(100% + 8px);
  min-width:220px;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:10px;
  padding:8px;
  display:none;
  box-shadow:0 12px 32px rgba(0,0,0,.12);
  z-index:10;
}
.submenu li a{display:block;padding:8px 10px;white-space:nowrap;}
.has-child:hover>.submenu,
.has-child:focus-within>.submenu{display:block;}

/* hamburger button */
.menu-toggle{
  display:none;
  border:1px solid rgba(0,0,0,.1);
  background:#fff;
  border-radius:10px;
  padding:8px 12px;
  font-size:18px;
  line-height:1;
  cursor:pointer;
}

/* do not rely on .hide-mobile, but keep it harmless if present */
.hide-mobile{display:block !important;}

/* -----------------------------------------------------------------------
   Dashboard history & billing shared layout
   ----------------------------------------------------------------------- */
.wp-history-page{
  padding:60px 0 0;
  /* background:radial-gradient(circle at top right, rgba(59,130,246,.12), transparent 45%), #f8fafc; */
  min-height:calc(100vh - 160px);
}
.wp-history-page .v2-content{
  display:flex;
  flex-direction:column;
  gap:20px;
}
.wp-history-page table,
.wp-history-page th,
.wp-history-page td{
  border:1px solid #e6e6e6;
  border-collapse:collapse;
}
.wp-history-page #pageInfo{
  display:flex;
  justify-content:center;
  margin:20px 0 0;
}
.wp-history-hero{
  background:#fff;
  border-radius:28px;
  padding:32px;
  color:#0f172a;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 20px 60px rgba(15,23,42,.08);
  position:relative;
  overflow:hidden;
}
.wp-history-hero::after{
  content:'';
  position:absolute;
  inset:0;
  /* background:radial-gradient(circle at 80% 20%, rgba(129,140,248,0.18), transparent 45%); */
  pointer-events:none;
}
.wp-hero-text,
.wp-summary-grid{
  position:relative;
  z-index:1;
}
.wp-hero-text h1{
  color:#0f172a;
  margin-bottom:6px;
}
.wp-hero-meta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:16px;
}
.wp-pill{
  padding:6px 14px;
  border-radius:999px;
  background:rgba(15,23,42,0.05);
  border:1px solid rgba(15,23,42,0.12);
  font-size:13px;
  backdrop-filter:blur(6px);
  color:#0f172a;
}
.wp-summary-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;
  margin-top:24px;
}
.wp-stat-card{
  background:rgba(255,255,255,0.92);
  border-radius:20px;
  padding:20px;
  border:1px solid rgba(15,23,42,0.08);
  /* box-shadow:0 10px 30px rgba(15,23,42,0.08); */
  min-height:136px;
}
.wp-stat-primary{
  border-color:rgba(16,185,129,0.35);
  box-shadow:0 15px 35px rgba(16,185,129,0.15);
}
.wp-stat-label{
  margin:0;
  font-size:14px;
  opacity:.85;
}
.wp-stat-value{
  margin:8px 0 4px;
  font-size:32px;
  font-weight:700;
  letter-spacing:-.02em;
}
.wp-stat-value span{
  font-size:16px;
  font-weight:500;
  opacity:.8;
  margin-left:4px;
}
.wp-stat-subtext{
  font-size:13px;
  opacity:.85;
}
.wp-stat-card-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}

.card-in-card {
    border: 1px solid #dcdcdc;
    border-radius: 10px;
    padding: 10px;
    background: #f0f8ff69;
}

.wp-stat-action{
  font-size:13px;
  font-weight:600;
  color:#4c51bf;
  text-decoration:none;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(76,81,191,0.1);
  border:1px solid rgba(76,81,191,0.2);
  transition:all .2s ease;
  cursor:pointer;
  border-width:1px;
  border-style:solid;
}
.wp-stat-action:hover{
  background:rgba(76,81,191,0.18);
}
.wp-credit{color:#10B981;font-weight:600;}
.wp-debit{color:#EF4444;font-weight:600;}
.v2-badge-credit{background:#D1FAE5;color:#065F46;}
.v2-badge-debit{background:#FEE2E2;color:#991B1B;}
.homev2 .wp-history-hero{
  background:#ffffff59;
  border-radius:28px;
  padding:32px;
  color:#000;
  border:1px solid rgb(255 255 255);
  position:relative;
  overflow:hidden;
  backdrop-filter:blur(11px);
}
.homev2 .usage-card{
  background:#ffffff59;
  border-radius:28px;
  padding:32px;
  color:#000;
  border:1px solid rgb(255 255 255);
  position:relative;
  overflow:hidden;
  backdrop-filter:blur(11px);
  box-shadow:0 20px 50px rgba(15,23,42,0.08);
}
.homev2 .wp-history-page .v2-card,
.homev2 .billing-page .v2-card,
.homev2 .v2-card{
  background:#ffffff59;
  border-radius:28px;
  padding:32px;
  color:#000;
  border:1px solid rgb(255 255 255);
  position:relative;
  overflow:hidden;
  backdrop-filter:blur(11px);
  text-align:left;
  text-decoration:none;
  box-shadow:0 20px 50px rgba(15,23,42,0.08);
}
.wp-history-page .v2-card-header{
  border-bottom:none;
  padding-bottom:0;
}
.wp-history-page .v2-card-body{
  padding-top:8px;
}
.wp-history-page .v2-table{
  border-radius:20px;
  overflow:hidden;
  border:1px solid #e5e7eb;
}
.wp-history-page .v2-pagination{
  margin-top:24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.wp-history-page .wp-page-controls{
  display:flex;
  align-items:center;
  gap:12px;
}
.wp-history-page .wp-page-size{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  color:#475467;
}
.wp-history-page .wp-page-size select{
  border:1px solid #D0D5DD;
  border-radius:12px;
  padding:6px 32px 6px 12px;
  background:#fff;
  font-weight:600;
  color:#0F172A;
}
.wp-history-page .v2-filter-form{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.wp-history-page .v2-filter-row{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:16px;
  align-items:flex-end;
}
.wp-history-page .v2-filter-group{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.wp-history-page .v2-filter-group label{
  font-weight:500;
  font-size:14px;
  color:#374151;
}
.wp-history-page .v2-filter-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.wp-history-page .v2-table-date{
  font-weight:500;
  color:#111827;
}
.wp-history-page .v2-table-time-ago{
  font-size:12px;
  color:#6B7280;
  margin-top:2px;
}
.wp-history-page .v2-table-loading,
.wp-history-page .v2-table-empty{
  text-align:center;
  padding:60px 20px;
}
.wp-history-page .v2-empty-state{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  color:#6B7280;
}
.wp-history-page .v2-empty-icon{
  font-size:48px;
  opacity:.5;
}
.wp-history-page .v2-empty-state h3{
  margin:0;
  color:#374151;
  font-weight:600;
}
.wp-history-page .v2-empty-state p{
  margin:0;
  font-size:14px;
}
.billing-page .billing-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:20px;
}
.account-shell{
  display:grid;
  grid-template-columns:280px 1fr;
  gap:20px;
  align-items:start;
}
.account-sidebar{
  position:sticky;
  top:120px;
  background:rgba(255,255,255,0.76);
  border:1px solid #ffffff;
  border-radius:20px;
  padding:18px 16px;
  box-shadow:0 20px 40px rgba(15,23,42,0.08);
  backdrop-filter:blur(10px);
  display:flex;
  flex-direction:column;
  gap:14px;
}
.account-sidebar__header h3{
  margin:2px 0 4px;
  font-size:20px;
}
.account-sidebar__eyebrow{
  margin:0;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#6b7280;
}
.account-sidebar__nav{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.account-nav-btn{
  width:100%;
  text-align:left;
  border:1px solid rgba(15,23,42,0.08);
  border-radius:12px;
  padding:12px 14px;
  font-weight:700;
  background:#fff;
  color:#0f172a;
  cursor:pointer;
  transition:all .18s ease;
}
.account-nav-btn:hover{
  border-color:rgba(11,42,74,0.3);
  box-shadow:0 10px 24px rgba(15,23,42,0.08);
}
.account-nav-btn.is-active{
  border-color:#0b2a4a;
  color:#0b2a4a;
  box-shadow:0 16px 38px rgba(11,42,74,0.22);
  background:linear-gradient(135deg,#ffffff,#e7f2ff);
}
.account-sidebar__hint{
  border:1px dashed rgba(15,23,42,0.12);
  border-radius:12px;
  padding:10px 12px;
  background:rgba(255,255,255,0.55);
}
.account-sidebar__hint p{
  margin:0;
}
.account-panels{
  display:grid;
  gap:18px;
}
.account-panel{
  display:none;
}
.account-panel.is-active{
  display:block;
}
.billing-page .section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.billing-page .section-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:4px;
}
section h2 {
    margin: 0 0 8px;
    font-size: 22px;
    letter-spacing: .2px;
    color: rgb(0, 0, 0);
}
.billing-page .section-actions .small-link,
.billing-page .section-actions .cta{
  margin-top:0;
}
button.small-link{
  border:0;
  background:none;
  color:#4c51bf;
  font-weight:600;
  cursor:pointer;
  padding:4px 0;
}
button.small-link:hover{
  text-decoration:underline;
}
.billing-page .details-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
}
.billing-page .details-grid dt{
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:11px;
  color:#6b7280;
  margin-bottom:4px;
}
.billing-page .details-grid dd{
  margin:0;
  font-weight:600;
  color:#111827;
}
.billing-page .topup-options{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.billing-page .topup-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 16px;
  border-radius:16px;
  border:1px solid rgba(15,23,42,0.08);
  background:rgba(248,250,252,0.95);
}
.billing-page .topup-card h3{
  margin:0;
  font-size:16px;
}
.billing-page .topup-price{
  font-weight:700;
  font-size:18px;
  color:#0f172a;
}
.billing-page .cancel-form{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.billing-page .cta.danger {
    background: #fee2e2;
    color: #b91c1c;
    border: 1px solid rgba(185, 28, 28, 0.2);
    padding: 10px;
    border-radius: 10px;
}
.billing-page .cta.danger:hover{
  background:#fecaca;
  
}
button.cta.soft {
    background: black;
    padding: 10px;
    color: white;
    border-radius: 10px;
}
.billing-page .alert{
  padding:14px 18px;
  border-radius:12px;
  font-weight:600;
}
.billing-page .alert-success{background:#dcfce7;color:#166534;border:1px solid rgba(22,101,52,0.2);}
.billing-page .alert-error{background:#fee2e2;color:#b91c1c;border:1px solid rgba(185,28,28,0.2);}
.billing-page .alert-info{background:#dbeafe;color:#1d4ed8;border:1px solid rgba(29,78,216,0.2);}
.account-modal{backdrop-filter:blur(2px);}
.account-modal .v2-modal__dialog{
  box-shadow:0 30px 80px rgba(15,23,42,.25);
  background:#ffffff;
}
.account-modal .account-form{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:16px 20px 24px;
}
.account-modal label{
  font-size:14px;
  font-weight:600;
  color:#111827;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.account-modal input,
.account-modal textarea,
.account-modal select{
  border:1px solid rgba(15,23,42,0.15);
  border-radius:12px;
  padding:10px 12px;
  font-size:14px;
  font-family:inherit;
  width:100%;
  box-sizing:border-box;
  background:#fff;
  color:#0f172a;
}
.account-modal textarea{resize:vertical;min-height:100px;}
.account-modal .form-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
}
.account-modal .checkbox-row{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:500;
}
.account-modal .modal-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:4px;
}
.account-modal .security-extra{
  border-top:1px solid rgba(15,23,42,0.08);
  margin-top:12px;
  padding-top:12px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.account-sidebar__nav .account-nav-btn:focus-visible{
  outline:2px solid #0b2a4a;
  outline-offset:3px;
}
@media (max-width:1024px){
  .account-shell{
    grid-template-columns:1fr;
  }
  .account-sidebar{
    position:relative;
    top:0;
  }
  .account-sidebar__nav{
    flex-direction:row;
    flex-wrap:wrap;
  }
  .account-nav-btn{
    flex:1 1 calc(50% - 10px);
  }
}
@media (max-width:640px){
  .account-sidebar__nav{
    flex-direction:column;
  }
  .account-nav-btn{
    flex:1 1 auto;
  }
}

@media (max-width:768px){
  .wp-history-page{
    padding:16px;
  }
  .wp-history-hero{
    padding:24px;
  }
  .wp-summary-grid{
    grid-template-columns:1fr;
  }
  .wp-history-page .v2-pagination{
    flex-direction:column;
    align-items:flex-start;
  }
  .wp-history-page .wp-page-controls{
    width:100%;
    justify-content:space-between;
  }
  .wp-history-page .v2-filter-row{
    grid-template-columns:1fr;
  }
  .wp-history-page .v2-filter-actions{
    flex-direction:column;
  }
  .billing-page .billing-grid{
    grid-template-columns:1fr;
  }
}

/* =======================================================================
   HERO
   ======================================================================= */
.v2-hero {
    display: grid;
    place-items: center;
    padding: 4em 0 7em;
    text-align: center;
}
.v2-eyebrow{font-size:23px;letter-spacing:.4px;color:rgb(0 0 0 / 70%);margin-bottom:10px;}
.v2-title{font-size:clamp(28px,6vw,46px);font-weight:800;margin:0 0 16px;}
.v2-sub{font-size:clamp(15px,2.2vw,18px);color:var(--v2-muted);margin:0 0 28px;}

/* =======================================================================
   FINDER SEARCH
   ======================================================================= */
.v2-search{
  background:var(--v2-card);
  border:1px solid var(--v2-border);
  backdrop-filter:blur(8px);
  border-radius:18px;
  padding:18px;
  display:grid;
  gap:12px;
  width:100%;
  max-width:1200px;
  margin-inline:auto;
}
.v2-row{display:flex;gap:10px;height:40px;}
.v2-sel,.v2-inp{flex:1;}
.v2-inp-wrap{position:relative;}
.v2-inp textarea,
.v2-sel select{
  box-sizing: border-box;
    width: 100%;
    padding: 14px 16px 34px 14px;
    border-radius: 12px;
    border: 1px solid var(--v2-border);
    background: rgb(255 255 255 / 64%);
    color: #2c2c2c;
    font-size: 14px;
    line-height: 20px;
    font-family: inherit;
    text-align: left;
}
.v2-inp textarea#q{background:#fff;height:20vh;min-height:160px;resize:vertical;overflow:auto;}
.v2-typeghost{
  position:absolute;top:10px;left:14px;right:100px;pointer-events:none;user-select:none;
  color:#6d6d6d;font-size:14px;line-height:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;
}

/* input icon buttons */
.v2-icbtn{
  position:absolute;bottom:8px;width:36px;height:36px;border:0;border-radius:10px;background:transparent;
  display:grid;place-items:center;cursor:pointer;
}
.v2-icbtn svg{width:22px;height:22px;}
.v2-icbtn--send{right:8px;}
.v2-icbtn--mic{right:48px;}
.v2-icbtn:hover{background:rgba(0,0,0,.06);}

/* chips */
.v2-chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;}
.v2-chip{
  border:1px solid var(--v2-border);
  color:#000;
  padding:8px 12px;
  border-radius:999px;
  background:rgb(0 0 0 / 5%);
  cursor:pointer;
}
.v2-toggle{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  color:#1f2937;
}
.v2-toggle input{
  width:16px;
  height:16px;
}


.cta_footer_tool svg {
    width: 25px;
}
/* =======================================================================
   PREVIEW CARDS
   ======================================================================= */
.v2-previews{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin:8px auto 0;
  width:min(1450px,96vw);
}
.v2-card{
  position:relative;border-radius:16px;padding:16px;background:var(--v2-card);
  border:1px solid var(--v2-border);min-height:160px;text-align:left;text-decoration:none;backdrop-filter:blur(9px);
}
.v2-card h3{font-size:16px;margin:0 0 6px;color:#616161;line-height:30px;}
.v2-card p{font-size:14px;color:#000000;margin:0;}
.v2-blur::after{content:'';position:absolute;inset:0;backdrop-filter:blur(6px);border-radius:16px;background:linear-gradient(to bottom, rgba(11,42,74,.10), rgba(11,42,74,.30));}
.v2-lock{position:absolute;inset:auto 12px 12px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;z-index:2;}
.v2-lock .lock-note{font-size:13px;color:#fff;}
.v2-lock .signup{background:#fff;color:#0b254a;border:0;border-radius:10px;padding:8px 12px;font-weight:700;}

/* slim links row */
.v2-links{display:flex;gap:18px;justify-content:center;align-items:center;margin:26px auto 10px;color:var(--v2-muted);flex-wrap:wrap;}
.v2-links a{color:#000;opacity:.9;background:#fff;padding:7px 20px;border-radius:70px;text-decoration:none;}
.v2-links a:hover{text-decoration:underline;}

/* =======================================================================
   FINDER RESULTS
   ======================================================================= */
.v2-results{
  margin:27px auto 0;
  width:min(1150px,96vw);
  display:grid;
  gap:14px;
  align-items:stretch;
}

.v2-status{
  margin:16px auto 0;
  width:min(1150px,96vw);
}
.v2-status[hidden]{display:none;}
.v2-status-card{
  padding:16px 18px;
  border-radius:16px;
  background:#ffffff;
  border:1px solid rgba(15,23,42,0.12);
  box-shadow:0 14px 38px rgba(15,23,42,0.12);
  text-align:center;
  font-weight:700;
  color:#0f172a;
  line-height:1.5;
}
.v2-status-card.v2-status-error {
    background: #ffffff66;
    /* border-color: rgba(248, 113, 113, 0.35); */
    color: #000000;
    max-width: 370px;
    padding: 10px;
    margin: 0 auto;
}
.v2-status-card.v2-status-info{
  background:rgba(37,99,235,0.08);
  border-color:rgba(37,99,235,0.2);
  color:#0b254a;
}
.v2-status-actions{
  margin-top:12px;
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}
.v2-status-actions .cta,
.v2-status-actions .ghost{
  padding:10px 14px;
  border-radius:12px;
  font-weight:700;
  text-decoration:none;
}
.v2-status-actions .cta{
  background:linear-gradient(135deg,#0b254a,#18a09d);
  color:#fff;
  box-shadow:0 12px 28px rgba(24,160,157,0.3);
}
.v2-status-actions .ghost{
  background:#fff;
  border:1px solid rgba(15,23,42,0.12);
  color:#0f172a;
}

/* Default grid layout */
.v2-results {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* Responsive grid based on result count */
.v2-results.results-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.v2-results.results-4,
.v2-results.results-5 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.v2-results.results-6 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.v2-result,
.v2-result-error,
.v2-result-empty{
  background:var(--v2-card);
  border:1px solid var(--v2-border);
  border-radius:16px;
  padding:16px;
  color:#1c1c1c;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
article.v2-ai-card, article.v2-ai-card-v2 {
    display: flex;
    background: var(--v2-card);
    border: 1px solid rgb(255 255 255);
    backdrop-filter: blur(8px);
    border-radius: 24px;
    padding: 18px;
    flex-direction: row;
    justify-content: flex-start;
    min-height: 360px;
    width: 100%;
    align-content: center;
    flex-wrap: wrap;
    align-items: center;
}
.v2-ai-card-v2{
  align-items:stretch;
  text-align:left;
  gap:18px;
}
.v2-ai-card-top {
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    flex-direction: column;
}
.v2-ai-card-heading{
  display:flex;
  flex-direction:column;
  gap:8px;
  flex:1;
}
.v2-favicon{
  width:20px;
  height:20px;
  border-radius:6px;
  object-fit:cover;
  background:#fff;
  box-shadow:0 0 0 1px rgba(15,23,42,.12);
}
.v2-favicon--fallback{
  display:flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  border-radius:6px;
  background:#e2e8f0;
  color:#0b1220;
  font-weight:700;
  box-shadow:0 0 0 1px rgba(15,23,42,.12);
}
.v2-card-thumb{
  width:68px;
  height:68px;
  border-radius:18px;
  background:#fff;
  object-fit:cover;
  box-shadow:0 6px 12px rgba(15,23,42,.08);
}
.v2-card-thumb--fallback{
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:24px;
  color:#0b1220;
  background:rgba(11,18,32,.08);
}
.v2-ai-card-body{
  display:flex;
  flex-direction:column;
  gap:14px;
  width:100%;
}
.v2-ai-card-summary{
  margin:0;
  color:#1f2937;
  line-height:1.5;
}
.v2-ai-card-section{
  background:rgba(11,18,32,.04);
  border-radius:14px;
  padding:12px 14px;
  width: 100%;
}
.v2-ai-card-section h4{
  margin:0 0 6px;
  font-size:14px;
  color:#0b254a;
  font-weight:700;
}
.v2-ai-card-section p{
  margin:0;
  color:#334155;
  line-height:1.5;
}
.v2-ai-card-section--gap{
  background:rgba(239,68,68,.08);
  border:1px solid rgba(239,68,68,.3);
}
.v2-ai-card-foot{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:6px;
}
.v2-ai-card-rank{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border-radius:999px;
  background:rgba(11,18,32,.08);
  font-weight:700;
  font-size:14px;
  color:#0b1220;
  margin-bottom:10px;
}
.v2-result-note{
  margin-top:16px;
  padding:14px 18px;
  border-radius:16px;
  background:rgba(11,18,32,.08);
  font-weight:600;
  color:#0b1220;
}
.v2-course-card{
  align-items:stretch;
  text-align:left;
  gap:18px;
}
.v2-course-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    flex-direction: column;
}
.v2-course-heading{
  display:flex;
  flex-direction:column;
  gap:8px;
  flex:1;
}
.v2-course-meta{
  font-size:13px;
  color:#475569;
}
.v2-course-summary{
  margin:0;
  color:#1f2937;
  line-height:1.5;
}
.v2-course-why{
  margin:8px 0 0;
  color:#475569;
  line-height:1.5;
  font-size:14px;
}
.v2-course-badges {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    gap: 8px;
}
.v2-course-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(11,18,32,.08);
  font-weight:600;
  font-size:12px;
  color:#0b1220;
  white-space:nowrap;
}
.v2-course-badge--partner{
  background:rgba(245,158,11,.2);
  color:#92400e;
}
.v2-course-skills{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.v2-course-skill{
  padding:4px 8px;
  border-radius:999px;
  background:rgba(15,23,42,.08);
  font-size:12px;
  color:#334155;
}
.v2-course-body{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-top:14px;
}
.v2-course-foot{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:16px;
}
.v2-course-partner-note{
  margin-top:8px;
  font-size:12px;
  color:#92400e;
}
.v2-soft-message{
  text-align:left;
}
.v2-guardrail{
  margin-bottom:16px;
}
.v2-guardrail[hidden]{
  display:none;
}
.ai-toggle{
  display:inline-flex;
  align-items:center;
  gap:0.5rem;
  font-size:0.95rem;
  line-height:1.2;
  color:#e2e8f0;
}
.ai-toggle--finder {
    position: absolute;
    right: 50px;
    bottom: 14px;
    display: flex;
    align-items: center;
    gap: 0.45rem;
}
.ai-toggle--form {
    position: absolute;
    right: 49px;
    bottom: 15px;
    display: flex;
    align-items: center;
    gap: 0.45rem;
}
.ai-toggle-text{
  font-weight:500;
  font-size:0.85rem;
  color:#000000;
}
.v2-featured-grid article.v2-ai-card, article.v2-ai-card-v2 {
    display: flex;
    background: var(--v2-card);
    border: 1px solid rgb(255 255 255);
    backdrop-filter: blur(8px);
    border-radius: 24px;
    padding: 18px;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 360px;
    width: 100%;
    align-content: center;
    flex-wrap: wrap;
    align-items: center;
}
.switch{
  font-size:11px;
  position:relative;
  display:inline-block;
  width:3.5em;
  height:2em;
}
.switch input{
  opacity:0;
  width:0;
  height:0;
  position:absolute;
}
.slider{
  position:absolute;
  cursor:pointer;
  inset:0;
  background:#fff;
  border-radius:50px;
  overflow:hidden;
  border:1px solid #b1b1b1;
  transition:all 0.4s cubic-bezier(0.215,0.61,0.355,1);
  box-shadow:0 1px 20px 6px rgba(0,0,0,0.05);
}
.slider:before{
  position:absolute;
  content:"";
  height:1.4em;
  width:1.4em;
  right:0.3em;
  bottom:0.3em;
  transform:translateX(150%);
  background-color:#009087;
  border-radius:inherit;
  transition:all 0.4s cubic-bezier(0.215,0.61,0.355,1);
}
.slider:after{
  position:absolute;
  content:"";
  height:1.4em;
  width:1.4em;
  left:0.3em;
  bottom:0.3em;
  background-color:#cccccc;
  border-radius:inherit;
  transition:all 0.4s cubic-bezier(0.215,0.61,0.355,1);
}
.switch input:focus + .slider{
  box-shadow:0 0 1px #009087;
}
.switch input:checked + .slider:before{
  transform:translateY(0);
}
.switch input:checked + .slider:after{
  transform:translateX(-150%);
}

.tools-page{
  padding:140px 0 96px;
  display:flex;
  flex-direction:column;
  gap:72px;
  /* background:#f8fafc; */
  color:#0f172a;
  border-radius:24px;
}
.tools-page .ai-toggle{
  font-size:1.25rem;
  color:#0f172a;
}
.tools-page .ai-toggle-text{
  font-size:1.25rem;
  color:#0f172a;
}
.tools-page .switch{
  font-size:1.05rem;
  width:3.75em;
  height:2.1em;
}
.tools-page .slider{
  border:1px solid rgba(148,163,184,0.3);
  box-shadow:0 0.15em rgba(15,23,42,0.15);
}
.tools-page .slider:before{
  background-color:#59d102;
}
.tools-page .slider:after{
  background-color:#cbd5f5;
}
.tools-page .switch input:focus + .slider{
  box-shadow:0 0 1px #59d102;
}
.tools-hero{
  /* max-width:780px; */
  margin:0 auto;
  text-align:center;
  display:flex;
  flex-direction:column;
  gap:18px;
}
.tools-hero h1 {
    color: #0f172a;
    font-size: clamp(28px, 6vw, 56px);
    line-height: 1.05;
    font-weight: 800;
    margin: 0 0 16px;
}
.tools-hero p {
    font-size: clamp(15px, 2.2vw, 18px);
    color: var(--v2-muted);
    margin: 0 0 28px;
}
.tools-empty{
  max-width:520px;
  margin:0 auto;
  padding:24px 28px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,0.35);
  background:#ffffff;
  color:#1f2937;
  text-align:center;
  font-size:1.25rem;
}
.tools-hero-badge{
  display:inline-flex;
  align-self:center;
  padding:10px 18px;
  border-radius:999px;
  background:#dbeafe;
  color:#1d4ed8;
  text-transform:uppercase;
  font-size:1.25rem;
  letter-spacing:0.08em;
  font-weight:600;
}
.tools-section{
  display:flex;
  flex-direction:column;
  gap:28px;
}
.tools-section-head{
  display:flex;
  flex-direction:column;
  /* gap:18px; */
  align-items:flex-start;
}
.tools-section-head h2{
  margin:0;
  font-size:2.4rem;
  color:#0f172a;
}
.tools-section-copy{
  max-width:540px;
  color:#475569;
  font-size:1.25rem;
}
.tools-section-foot{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:12px;
  margin-top:16px;
}
.tools-section-foot .ghost{
  color:#1d4ed8;
  border-color:rgba(59,130,246,0.3);
}
.tools-section-foot .ghost:hover{
  color:#1e40af;
  border-color:rgba(37,99,235,0.6);
}
.tools-chip{
  display:inline-flex;
  align-items:center;
  padding:8px 16px;
  border-radius:999px;
  background:#e0f2fe;
  color:#0369a1;
  text-transform:uppercase;
  font-size:1.25rem;
  letter-spacing:0.08em;
  font-weight:600;
}
.tools-grid{
  display:grid;
  gap:22px;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.tools-card {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-height: 100%;
    box-shadow: 0 22px 45px -32px rgba(15, 23, 42, 0.35);
    color: #0f172a;
    background: var(--v2-card);
    border: 1px solid rgb(255 255 255);
    backdrop-filter: blur(8px);
    border-radius: 24px;
}
.tools-card-top {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-direction: column;
}
.tools-card-titlewrap{
  flex:1;
  min-width:0;
  flex-direction:column;
  gap:6px;
}
.tools-card-logo {
    width: 320px;
    height: 175px;
    border-radius: 16px;
    overflow: hidden;
    background: #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.tools-card-logo img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.tools-card-title{
  margin:0;
  font-size:1.5rem;
  color:#0f172a;
}
.tools-card-subtitle{
  margin:6px 0 0;
  color:#1e293b;
  font-size:1.25rem;
}
.tools-card-summary{
  margin:0;
  color:#334155;
  font-size:1.25rem;
}
.tools-card-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.tools-card-tags span{
  padding:8px 16px;
  border-radius:999px;
  background:#eef2ff;
  color:#3730a3;
  font-size:1.25rem;
  letter-spacing:0.05em;
  text-transform:uppercase;
}
.tools-card-meta {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    flex-direction: column;
}
.tools-card-meta li{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:#1e293b;
  font-size:1.25rem;
}
.tools-card-meta li span{
  text-transform:uppercase;
  letter-spacing:0.06em;
  font-size:1.25rem;
  color:#475569;
}
.tools-card-meta li strong {
    font-weight: 500;
    color: #0f172a;
    line-height: 23px;
}
.tools-card-link{
  margin-top:auto;
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#1d4ed8;
  font-weight:600;
  font-size:1.25rem;
  text-decoration:none;
}
.tools-card-link:hover{
  color:#1e40af;
}
.tools-view-all{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:600;
  font-size:1.25rem;
  color:#1d4ed8;
  text-decoration:none;
}
.tools-view-all span{
  font-size:1.4rem;
}

.supai-loader-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:36px 0;
  margin:0 auto;
}
.supai-loader{
  --color-one:#ffbf48;
  --color-two:#be4a1d;
  --color-three:#ffbf4780;
  --color-four:#bf4a1d80;
  --color-five:#ffbf4740;
  --time-animation:2s;
  --size:1;
  --loader-size:100px;
  display:inline-block;
  position:relative;
  width:var(--loader-size);
  height:var(--loader-size);
  border-radius:50%;
  transform:scale(var(--size));
  transform-origin:center;
  box-shadow:
    0 0 25px 0 var(--color-three),
    0 20px 50px 0 var(--color-four);
  animation:colorize calc(var(--time-animation) * 3) ease-in-out infinite;
}
.supai-loader::before{
  content:"";
  position:absolute;
  inset:0;
  width:var(--loader-size);
  height:var(--loader-size);
  border-radius:50%;
  border-top:solid 1px var(--color-one);
  border-bottom:solid 1px var(--color-two);
  background:linear-gradient(180deg,var(--color-five),var(--color-four));
  box-shadow:
    inset 0 10px 10px 0 var(--color-three),
    inset 0 -10px 10px 0 var(--color-four);
}
.supai-loader__box{
  width:var(--loader-size);
  height:var(--loader-size);
  background:linear-gradient(180deg,var(--color-one) 30%,var(--color-two) 70%);
  display:block;
  mask:url(#supaiLoaderMask);
  -webkit-mask:url(#supaiLoaderMask);
}
.supai-loader svg{
  position:absolute;
  inset:0;
  width:var(--loader-size);
  height:var(--loader-size);
  pointer-events:none;
}
.supai-loader svg #supaiLoaderMask{
  filter:contrast(15);
  animation:roundness calc(var(--time-animation) / 2) linear infinite;
}
.supai-loader svg #supaiLoaderMask polygon{
  filter:blur(7px);
}
.supai-loader svg #supaiLoaderMask polygon:nth-child(1){
  transform-origin:75% 25%;
  transform:rotate(90deg);
}
.supai-loader svg #supaiLoaderMask polygon:nth-child(2){
  transform-origin:50% 50%;
  animation:rotation var(--time-animation) linear infinite reverse;
}
.supai-loader svg #supaiLoaderMask polygon:nth-child(3){
  transform-origin:50% 60%;
  animation:rotation var(--time-animation) linear infinite;
  animation-delay:calc(var(--time-animation) / -3);
}
.supai-loader svg #supaiLoaderMask polygon:nth-child(4){
  transform-origin:40% 40%;
  animation:rotation var(--time-animation) linear infinite reverse;
}
.supai-loader svg #supaiLoaderMask polygon:nth-child(5){
  transform-origin:40% 40%;
  animation:rotation var(--time-animation) linear infinite reverse;
  animation-delay:calc(var(--time-animation) / -2);
}
.supai-loader svg #supaiLoaderMask polygon:nth-child(6){
  transform-origin:60% 40%;
  animation:rotation var(--time-animation) linear infinite;
}
.supai-loader svg #supaiLoaderMask polygon:nth-child(7){
  transform-origin:60% 40%;
  animation:rotation var(--time-animation) linear infinite;
  animation-delay:calc(var(--time-animation) / -1.5);
}
.supai-loader--mini{
  --loader-size:40px;
  --time-animation:1.6s;
}
@keyframes rotation{
  from{ transform:rotate(0deg); }
  to{ transform:rotate(360deg); }
}
@keyframes roundness{
  0%{ filter:contrast(15); }
  20%{ filter:contrast(3); }
  40%{ filter:contrast(3); }
  60%{ filter:contrast(15); }
  100%{ filter:contrast(15); }
}
@keyframes colorize{
  0%{ filter:hue-rotate(0deg); }
  20%{ filter:hue-rotate(-30deg); }
  40%{ filter:hue-rotate(-60deg); }
  60%{ filter:hue-rotate(-90deg); }
  80%{ filter:hue-rotate(-45deg); }
  100%{ filter:hue-rotate(0deg); }
}
@media (min-width: 900px){
    .tools-section-head {
        align-items: flex-start;
        justify-content: space-between;
        display: flex;
        flex-direction: column;
    }
    .tools-section-copy {
        max-width: 850px;
        font-size: 19px;
        margin-top: 0;
    }
}
@media (max-width: 767px){
  .tools-page{
    padding:120px 0 80px;
    gap:116px;
  }
  .tools-hero h1{
    font-size:2.2rem;
  }
  .tools-section-foot{
    justify-content:flex-start;
  }
}
section.v2-featured{margin:80px 0;}
.v2-featured-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px;}

/* =======================================================================
   HOME V2 SEO SECTIONS (Scout / Courses / Business)
   ======================================================================= */
.v2-seo-feature{width:min(1450px,92vw);margin-inline:auto;}
.v2-seo--scout{--seo-accent:#11b0b8;--seo-accent2:#22c55e;--seo-spot1:rgba(17,176,184,.35);--seo-spot2:rgba(34,197,94,.22);}
.v2-seo--courses{--seo-accent:#6366f1;--seo-accent2:#a855f7;--seo-spot1:rgba(99,102,241,.30);--seo-spot2:rgba(168,85,247,.22);}
.v2-seo--business{--seo-accent:#f59e0b;--seo-accent2:#ef4444;--seo-spot1:rgba(245,158,11,.30);--seo-spot2:rgba(239,68,68,.22);}

/* Small layout differences so sections don't feel cloned */
.v2-seo--courses .v2-seo-panel{grid-template-columns:.95fr 1.45fr;}
.v2-seo--courses .v2-seo-main{order:2;}
.v2-seo--courses .v2-seo-aside{order:1;}
.v2-seo--business .v2-seo-panel::after{left:auto;right:0;}

.v2-seo-feature .v2-featured-head{max-width:980px;margin-inline:auto;}
.v2-seo-feature .v2-eyebrow{
  font-weight:900;
  letter-spacing:.2px;
  margin-bottom:8px;
  background:linear-gradient(90deg,var(--seo-accent),var(--seo-accent2));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.v2-seo-feature .v2-sub{color:rgba(15,23,42,.72);max-width:70ch;margin-inline:auto;}

.v2-seo-panel{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,.24));
  border:1px solid rgba(255,255,255,.38);
  backdrop-filter:blur(10px);
  border-radius:24px;
  padding:22px;
  display:grid;
  grid-template-columns:1.45fr .95fr;
  gap:18px;
  text-align:left;
  box-shadow:0 22px 60px rgba(15,23,42,.10);
}
.v2-seo-panel::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 340px at 10% 0%, var(--seo-spot1), transparent 60%),
    radial-gradient(700px 320px at 90% 30%, var(--seo-spot2), transparent 55%);
  pointer-events:none;
}
.v2-seo-panel::after{
  content:'';
  position:absolute;
  left:0;
  top:16px;
  bottom:16px;
  width:4px;
  background:linear-gradient(180deg,var(--seo-accent),var(--seo-accent2));
  opacity:.9;
  border-radius:999px;
}
.v2-seo-main,
.v2-seo-aside{position:relative;z-index:1;}

.v2-seo-title{
  margin:0 0 8px 0;
  font-size:clamp(18px,2.2vw,24px);
  line-height:1.2;
  color:#0f172a;
  font-weight:900;
  letter-spacing:-.02em;
}
.v2-seo-h3{
  margin:14px 0 8px;
  font-size:14px;
  font-weight:900;
  letter-spacing:.2px;
  text-transform:uppercase;
  color:rgba(15,23,42,.80);
}
.v2-seo-text{margin:0 0 14px 0;color:#0b1220;opacity:.86;max-width:72ch;}
.v2-seo-text--muted{opacity:.78;margin-top:-6px;}
.v2-seo-list{margin:0 0 16px 18px;color:#0b1220;opacity:.86;}
.v2-seo-list li{margin:6px 0;line-height:1.35;}
.v2-seo-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;}
.v2-seo-actions .v2-result-link,
.v2-seo-actions .v2-result-compare{margin-top:0;transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;}
.v2-seo-actions .v2-result-link:hover,
.v2-seo-actions .v2-result-compare:hover{transform:translateY(-1px);}

.v2-seo-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px 14px;
  margin-top:14px;
  font-size:13px;
}
.v2-seo-links a{
  color:rgba(15,23,42,.78);
  text-decoration:none;
  border-bottom:1px dotted rgba(15,23,42,.30);
}
.v2-seo-links a:hover{color:rgba(15,23,42,.92);text-decoration:none;border-bottom-color:rgba(15,23,42,.55);}

.v2-seo-faq{margin-top:14px;display:grid;gap:10px;}
.v2-seo-faq details{
  border:1px solid rgba(0,0,0,.08);
  border-radius:16px;
  background:rgba(255,255,255,.55);
  overflow:hidden;
}
.v2-seo-faq summary{
  cursor:pointer;
  list-style:none;
  padding:12px 14px;
  font-weight:800;
  color:#0b1220;
  position:relative;
}
.v2-seo-faq summary::-webkit-details-marker{display:none;}
.v2-seo-faq summary::after{
  content:'+';
  position:absolute;
  right:12px;
  top:10px;
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:rgba(15,23,42,.06);
  color:rgba(15,23,42,.85);
}
.v2-seo-faq details[open] summary::after{content:'-';}
.v2-seo-faq details p{margin:0;padding:0 14px 14px;color:rgba(15,23,42,.82);line-height:1.45;}

.v2-seo-feature .v2-result-link{
  background:linear-gradient(135deg,var(--seo-accent),var(--seo-accent2));
  color:#fff;
  border:1px solid rgba(255,255,255,.35);
  box-shadow:0 16px 35px rgba(15,23,42,.14);
}
.v2-seo-feature .v2-result-link:hover{text-decoration:none;filter:brightness(1.02);}
.v2-seo-feature .v2-result-compare{
  background:rgba(255,255,255,.72);
  border:1px solid rgba(0,0,0,.10);
  color:#0b254a;
}
.v2-seo-aside{
  background:linear-gradient(180deg, rgba(255,255,255,0.92), rgba(255,255,255,0.75));
  border:1px solid rgba(0,0,0,.10);
  border-radius:18px;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.v2-seo-aside .v2-badge{
  background:rgba(255,255,255,0.65);
  border:1px solid rgba(0,0,0,.10);
  color:#0b1220;
  width:fit-content;
}
.v2-seo-example{
  font-size:14px;
  line-height:1.45;
  color:#0b1220;
  padding:12px 12px;
  border-radius:14px;
  background:rgba(15,23,42,.03);
  border:1px solid rgba(0,0,0,.08);
  border-left:3px solid var(--seo-accent);
}
.v2-seo--scout .v2-seo-example{background:rgba(17,176,184,.06);}
.v2-seo--courses .v2-seo-example{background:rgba(99,102,241,.06);}
.v2-seo--business .v2-seo-example{background:rgba(245,158,11,.06);border-left-width:1px;border-right:3px solid var(--seo-accent);}

.v2-result-top{display:flex;align-items:center;justify-content:space-between;gap:12px;}
img.v2-logo{height:200px;width:350px;border-radius:30px;background:#fff;object-fit:cover;}
img.v2-logo-res{height:40px;width:auto;border-radius:12px;background:#fff;}
.v2-result-title {
    font-size: 18px;
    /* margin: 30px 0 0 10px; */
    color: #1f2937;
    line-height: 22px;
}
.v2-tags {
    margin: 10px;
    color: #7a7a7a;
}
.v2-badge{display:inline-block;padding:4px 8px;border-radius:999px;background:rgba(0,0,0,.06);color:#0b254a;font-weight:600;font-size:12px;}
.v2-result-why{margin:10px 0 8px;color:#333;}
.v2-result-uses{margin:0 0 8px 18px;}
.v2-result-uses li{margin:2px 0;}
.v2-result-foot{display:flex;gap:12px;align-items:center;margin-top:6px;flex-wrap:wrap;}
.v2-result-link,
.v2-result-compare{
  display:inline-block;padding:8px 12px;border-radius:10px;text-decoration:none;background:#fff;color:#0b254a;font-weight:700;border:1px solid rgba(0,0,0,.08); margin-top:20px;
}
.v2-result-compare{background:rgba(255,255,255,.7);}

/* thinking loader */
.v2-loader{display:grid;place-items:center;padding:20px;}
.v2-thinking{display:flex;align-items:center;gap:10px;color:#0b254a;font-weight:600;}
.v2-thinking .dot{width:8px;height:8px;border-radius:50%;background:#18a09d;display:inline-block;animation:v2-bounce 1s infinite ease-in-out;}
.v2-thinking .dot:nth-child(2){animation-delay:.15s;}
.v2-thinking .dot:nth-child(3){animation-delay:.3s;}
@keyframes v2-bounce{0%,80%,100%{transform:translateY(0);opacity:.5;}40%{transform:translateY(-6px);opacity:1;}}

/* From Uiverse.io by Quezaquo */ 
.loader {
  position: absolute;
}

.loader:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 5em;
  height: 0.5em;
  border-radius: 0.5em;
  transform: translate(-50%, -50%);
  animation: slide 2.5s infinite;
}

@keyframes slide {
  0% {
    width: 5em;
    box-shadow:
      1em -0.5em #2b546b,
      -1em 0.5em #aabbc4;
  }

  35% {
    width: 0.5em;
    box-shadow:
      0 -0.5em #2b546b,
      0 0.5em #aabbc4;
  }

  70% {
    width: 0.5em;
    box-shadow:
      -1em -0.5em #2b546b,
      1em 0.5em #aabbc4;
  }

  100% {
    width: 5em;
    box-shadow:
      1em -0.5em #2b546b,
      -1em 0.5em #aabbc4;
  }
}

.loader-text {
  margin-top: 4em;
  text-align: center;
  font-weight: 600;
  color: #0b254a;
}

/* =======================================================================
   AUTH PAGES
   ======================================================================= */
.v2-auth{margin-top:clamp(24px,4vw,40px);}
.v2-auth-grid{display:grid;grid-template-columns:1.15fr 0.85fr;gap:clamp(16px,3vw,28px);}
.v2-card-auth{padding:clamp(18px,2.8vw,28px);}
.v2-card-aside{padding:clamp(16px,2.4vw,24px);}

/* field styles used on signup */
.v2-field{margin-bottom:14px;}
.v2-label{display:block;font-weight:700;color:#0c0c0c;margin:0 0 6px;}
.v2-input{width:100%;border-radius:12px;padding:.9rem 1rem;background:rgba(8,18,28,.6);border:1px solid rgba(148,163,184,.28);color:#f7fbff;}
.v2-input:focus{outline:none;border-color:rgba(79,70,229,.55);box-shadow:0 0 0 3px rgba(79,70,229,.18);}
.v2-help{font-size:.92rem;color:#a9b7d1;margin-top:6px;}
.v2-invalid{color:#ffd7d7;font-size:.92rem;margin-top:6px;}
.v2-btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;width:100%;border:0;border-radius:12px;padding:1rem 1.2rem;font-weight:800;font-size:1.05rem;letter-spacing:.01em;}
.v2-btn-primary{background:linear-gradient(135deg,#3cbef9,#6c63ff);color:#061028;}
.v2-btn-primary:hover{filter:brightness(1.05);transform:translateY(-1px);}
.v2-btn-google{background:#fff;color:#0b162b;border:1px solid rgba(148,163,184,.28);}

/* alerts */
.v2-alert{border:1px solid rgba(148,163,184,.28);border-radius:14px;padding:.9rem 1rem;margin:0 0 14px;}
.v2-alert-info{background:rgba(60,190,249,0.10);color:#e6f7ff;}
.v2-alert-danger{background:rgba(239,68,68,0.10);color:#ffe2e2;}

/* =======================================================================
   MODAL
   ======================================================================= */
.v2-modal,
.v2-backdrop{position:fixed;inset:0;pointer-events:none;opacity:0;transition:opacity .18s ease;z-index:80;}
.v2-backdrop{background:rgba(0,16,32,.55);backdrop-filter:blur(2px);}
.v2-modal{display:grid;place-items:center;}
.v2-modal-overlay{
  position:absolute;
  inset:0;
  background:rgba(4,9,20,0.55);
  backdrop-filter:blur(10px);
  transition:opacity .2s ease;
  pointer-events:none;
  opacity:0;
  z-index:80;
}
.v2-modal.is-open .v2-modal-overlay,
#signupModal[aria-hidden="false"] .v2-modal-overlay{
  opacity:1;
  pointer-events:auto;
}
.v2-modal__dialog,
.v2-modal > [role="document"]{
  width:min(560px,92vw);
  background:rgba(255,255,255,0.9);
  backdrop-filter:blur(16px);
  border-radius:16px;
  box-shadow:0 26px 70px rgba(15,23,42,0.28);
  border:1px solid rgba(0,0,0,.06);
  transform:translateY(10px) scale(.98);
  transition:transform .22s cubic-bezier(.2,.65,.2,1), opacity .22s ease;
  opacity:0;
  z-index:81;
}
.v2-modal.is-open,
#signupModal.is-open,
#signupModal[aria-hidden="false"]{pointer-events:auto;opacity:1;}
.v2-modal.is-open .v2-modal__dialog,
.v2-modal.is-open > [role="document"],
#signupModal[aria-hidden="false"] .v2-modal__dialog{opacity:1;transform:translateY(0) scale(1);}
body.modal-open{overflow:hidden;}
.v2-modal__header{display:flex;align-items:center;justify-content:space-between;padding:16px 18px 10px;border-bottom:1px solid rgba(0,0,0,.06);}
.v2-modal__title{font-size:18px;font-weight:700;margin:0;}
.v2-modal__close{border:0;background:transparent;cursor:pointer;width:36px;height:36px;border-radius:8px;display:grid;place-items:center;}
.v2-modal__close:hover{background:rgba(0,0,0,.05);}
.v2-modal__body{padding:16px 18px 8px;color:#333;}
.v2-modal__list{display:grid;gap:10px;margin:10px 0 6px;padding:0;list-style:none;}
.v2-modal__list li{display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:start;font-size:14.5px;color:#444;}
.v2-modal__actions{display:flex;gap:10px;justify-content:flex-end;padding:12px 18px 16px;}
.btn{appearance:none;border:0;cursor:pointer;border-radius:10px;padding:10px 14px;font-weight:700;font-size:14px;}
.btn-primary{background:#0b254a;color:#fff;}
.btn-primary:hover{filter:brightness(1.05);}
.btn-secondary{background:#eef3f7;color:#0b254a;}
.btn-secondary:hover{background:#e6edf3;}
.signup-modal{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(15,23,42,0.08);
  background:linear-gradient(145deg, rgba(255,255,255,0.96), rgba(236,244,255,0.94));
}
.signup-modal::before{
  content:'';
  position:absolute;
  inset:-20% 40% auto -30%;
  height:240px;
  background:radial-gradient(circle at center, rgba(79,70,229,0.12), transparent 60%);
  pointer-events:none;
}
.signup-modal::after{
  content:'';
  position:absolute;
  inset:auto -10% -30% 30%;
  height:200px;
  background:radial-gradient(circle at center, rgba(16,185,129,0.12), transparent 60%);
  pointer-events:none;
}
.signup-modal__header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:18px 20px 6px;
}
.signup-modal__eyebrow{
  margin:0;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#475569;
}
.signup-modal__sub{
  margin:6px 0 0;
  color:#334155;
}
.signup-modal__badge{
  background:#0f172a;
  color:#fff;
  border-radius:999px;
  padding:8px 12px;
  font-weight:700;
  font-size:13px;
  box-shadow:0 10px 30px rgba(15,23,42,0.25);
}
.signup-modal__body{padding:4px 20px 2px;}
.signup-modal__list{
  margin:0;
}
.signup-modal__list li span:first-child{
  width:22px;
  height:22px;
  border-radius:50%;
  background:rgba(16,185,129,0.15);
  color:#0f766e;
  display:grid;
  place-items:center;
  font-weight:800;
  font-size:12px;
}
.signup-modal__list li span:last-child{
  font-weight:600;
  color:#0f172a;
}
.signup-modal__actions{
  padding:12px 20px 18px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.signup-modal__actions .cta{
  display:block;
  width:100%;
  text-align:center;
  border-radius:12px;
  font-weight:800;
  padding:12px 14px;
  background:linear-gradient(135deg,#0b254a,#18a09d);
  color:#fff;
  box-shadow:0 16px 36px rgba(24,160,157,0.35);
}
.signup-modal__actions .ghost{
  display:block;
  width:100%;
  text-align:center;
  padding:11px 14px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,0.15);
  color:#0f172a;
  font-weight:700;
  background:#fff;
}

/* =======================================================================
   FOOTER
   ======================================================================= */
.site-footer{color:#2e2e2e;background:#fff;margin-top:56px;box-shadow:-5px -6px 60px rgb(48 48 48 / 15%);}
.sf-shell{width:min(1120px,92vw);margin-inline:auto;padding:38px 0 16px;}
.sf-grid{display:grid;grid-template-columns:1.2fr repeat(3,.9fr) 1.2fr;gap:28px;}
.sf-col{min-width:0;}
.sf-brand{display:inline-flex;align-items:center;gap:10px;font-weight:800;color:#2e2e2e;text-decoration:none;}
.sf-brand img{border-radius:8px;}
.sf-lead{margin:12px 0 0;color:#2e2e2e;font-size:14.5px;line-height:1.5;}
.sf-ttl{font-size:13px;text-transform:uppercase;letter-spacing:.4px;color:#2e2e2e;margin:2px 0 10px;}
.sf-list{list-style:none;padding:0;margin:0;display:grid;gap:8px;}
.sf-list a{color:#2e2e2e;text-decoration:none;opacity:.9;}
.sf-list a:hover{text-decoration:underline;opacity:1;}
.sf-form{display:grid;grid-template-columns:1fr auto;gap:10px;margin:6px 0 10px;}
.sf-form input{height:40px;border-radius:10px;border:1px solid rgba(0,0,0,.12);background:rgba(0,0,0,.03);color:#2e2e2e;padding:0 12px;}
.sf-form button{height:40px;border:0;border-radius:10px;padding:0 14px;cursor:pointer;background:#34d6ff;color:#002538;font-weight:800;}
.sf-form button:hover{filter:brightness(1.06);}
.sf-social{display:flex;gap:10px;margin-top:6px;}
.sf-social a{color:#2e2e2e;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;text-decoration:none;background:rgba(0,0,0,.04);border:1px solid rgba(0,0,0,.08);}
.sf-social a:hover{background:rgba(0,0,0,.08);}
.sf-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid rgba(0,0,0,.08);margin-top:26px;padding-top:12px;color:#2e2e2e;font-size:13px;}
.sf-mini{list-style:none;display:flex;gap:14px;margin:0;padding:0;}
.sf-mini a{color:#2e2e2e;text-decoration:none;}
.sf-mini a:hover{text-decoration:underline;}

.profile-pop {
    position: absolute;
    right: 0;
    top: 100%;
    margin-top: 8px;
    min-width: 220px;
    background: #ffffff;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 12px;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .35);
    padding: 6px 0;
    z-index: 100;
}
.profile-trigger-mobile{display:none!important;}
.profile-trigger-btn{width:100%;text-align:left;border:1px solid var(--v2-border);background:#fff;padding:10px 12px;border-radius:10px;font-weight:700;color:#0f172a;}
.profile-trigger-btn:hover{background:rgba(0,0,0,.04);}

.profile-modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:999;}
.profile-modal.is-open{display:flex;}
.profile-modal__overlay{position:absolute;inset:0;background:rgba(0,0,0,.65);backdrop-filter:blur(4px);}
.profile-modal__panel{position:relative;z-index:1;background:#fff;border-radius:16px;border:1px solid rgba(0,0,0,.08);box-shadow:0 18px 48px rgba(0,0,0,.22);max-width:420px;width:90%;padding:16px;display:flex;flex-direction:column;gap:14px;}
.profile-modal__head{display:flex;align-items:center;gap:12px;}
.profile-modal__meta strong{display:block;font-size:16px;}
.profile-modal__meta small{display:block;font-size:13px;color:#475569;}
.profile-modal__close{margin-left:auto;border:none;background:none;font-size:20px;cursor:pointer;color:#475569;}
.profile-modal__close:hover{color:#0f172a;}
.profile-modal__links{display:flex;flex-direction:column;gap:8px;}
.profile-modal__links a{display:block;padding:10px 12px;border-radius:10px;border:1px solid rgba(0,0,0,.06);text-decoration:none;font-weight:700;color:#0f172a;}
.profile-modal__links a:hover{background:rgba(0,0,0,.04);}
.desktop-only{display:flex;}

.test{
    margin: 20px 0;
    padding: 4px 12px;
    background: #161515;
    color: white;
    border: 1px solid #ffffff;
    overflow-x: auto;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    hyphens: none;
    border-radius: 11px;
    height: auto;
}

button#send-link-btn {
    width: 100%;
    max-width: 250px;
    background: #000000;
    border: none;
    color: #ffffff;
    gap:20px;
    font-size: 13px;
}
.v2-field.email-signup-group {
    display: flex;
    gap: 10px;
    align-items: baseline;
    align-content: space-between;
    flex-direction: row;
}

.email-signup-group svg {
    width: 25px;
    padding: 0;
}
.v2-ai-card-meta {
    margin-top: 20px;
}

.v2-card .search-history-list li {
    line-height: 20px;
    background: white;
    padding: 20px;
    border-radius: 15px;
    display: flex;
    gap: 30px;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.dash-modal__actions .cta {
    text-align: left;
}
/* =======================================================================
   BREAKPOINTS
   ======================================================================= */

/* large containers */
@media (max-width:1200px){
  .v2-container,.sf-shell{width:min(1450px,94vw);}
  .v2-previews,.v2-results{width:min(1000px,94vw);}
}

/* tablet landscape */
@media (max-width:1024px){
  .v2-previews{grid-template-columns:repeat(2,1fr);}
  .v2-results{grid-template-columns:repeat(2,1fr);}
  .v2-featured-grid{grid-template-columns:repeat(2,1fr);}
  .v2-inp textarea#q{min-height:140px;}
}

/* generic stack changes */
@media (max-width:900px){
  .v2-row{flex-direction:column;height:auto;}
  .v2-icbtn{bottom:10px;}
  section.v2-featured{margin:60px 0;}
  .v2-seo-panel{grid-template-columns:1fr;padding:18px;}
  .v2-seo-panel::after{top:12px;bottom:12px;}
  .v2-seo--courses .v2-seo-main{order:0;}
  .v2-seo--courses .v2-seo-aside{order:0;}
}

/* mobile nav and single columns */
@media (max-width:920px){
  .v2-nav{
    display:flex; align-items:center; justify-content:space-between;
  }

  .menu-toggle{display:block;}

  /* hide menu by default; show only when toggled */
  #mainNav{display:none !important;}
  #mainNav.is-open{display:block !important;}

  /* dropdown panel */
  .main-menu{
    position:absolute; left:0; right:0; top:calc(100% + 8px);
    background:#fff; border:1px solid rgba(0,0,0,.08);
    border-radius:14px; padding:8px; box-shadow:0 20px 50px rgba(0,0,0,.15);
    z-index:99;
  }
  #mainNav .navigation{
    display:flex; flex-direction:column; align-items:flex-start;
    gap:8px; margin:0; padding:0;
  }
  #mainNav .navigation > li{width:100%;}
  #mainNav .navigation a{display:block; width:100%; padding:10px 12px;}
  .profile-trigger-mobile{display:block!important;}
  .desktop-only{display:none;}

  /* submenus collapsed */
  .submenu{position:static; display:none; border:0; box-shadow:none; padding:0; margin:6px 0 0 10px;}
  .has-child.is-open > .submenu{display:block;}

  /* auth inside dropdown */
  #mainNav .nav-sep{
    display:flex; gap:10px; padding:8px 6px 4px; margin-top:6px;
    border-top:1px solid rgba(0,0,0,.06); justify-content:space-evenly;
  }

  /* backdrop + scroll lock */
  .nav-backdrop{position:fixed; inset:0; background:rgba(0,0,0,.35); backdrop-filter:blur(1.5px); display:none; z-index:98;}
  .nav-backdrop.is-open{display:block;}
  body.menu-open{overflow:hidden;}
}

/* tablet portrait and down */
@media (max-width:768px){
  .v2-nav{
    border-radius:90px; height:70px;
  }
  .v2-nav .cta{padding:9px 14px;}
  .v2-search{width:100%;max-width:none;}
  .v2-typeghost{right:80px;}
  .v2-previews{grid-template-columns:1fr;}
  .v2-results{grid-template-columns:1fr;}
  .v2-featured-grid{grid-template-columns:1fr;}
  article.v2-ai-card,article.v2-ai-card-v2{min-height:360px;border-radius:20px;}
  .v2-card-thumb{width:56px;height:56px;}
  .v2-ai-card-body{gap:12px;}
  .v2-links{gap:10px;}
  .v2-auth-grid{grid-template-columns:1fr;}
}

/* phones */
@media (max-width:640px){
  .v2-search{padding:14px;border-radius:14px;width:100%;max-width:none;}
  .v2-inp textarea,.v2-sel select{padding-right:80px;}
  .v2-icbtn{width:34px;height:34px;}
  .v2-icbtn svg{width:20px;height:20px;}
  img.v2-logo{height:160px;width:100%;border-radius:18px;}
  img.v2-logo-res{height:32px;border-radius:10px;}
  .v2-card-thumb{width:48px;height:48px;}
  .sf-grid{grid-template-columns:repeat(2,1fr);gap:18px;}
  .sf-form{grid-template-columns:1fr;}
  .sf-bottom{flex-direction:column;align-items:flex-start;gap:8px;}
}

/* small phones */
@media (max-width:480px){
  .v2-eyebrow{font-size:18px;}
  .v2-title{font-size:clamp(24px,9vw,32px);}
  .v2-sub{font-size:14px;}
  .v2-search{gap:10px;}
  .v2-chip{font-size:13px;padding:7px 10px;}
  .v2-result-title{font-size:16px;}
  .v2-result-foot{gap:8px;}
  .v2-result-link,.v2-result-compare{width:100%;text-align:center;}
  .btn{width:100%;}
  .v2-modal__actions{flex-direction:column-reverse;align-items:stretch;}
  .v2-card-thumb{width:44px;height:44px;}
}

/* tiny devices */
@media (max-width:360px){
  .v2-links a{padding:6px 12px;border-radius:40px;}
  .v2-nav{padding:8px 10px;}
  .v2-nav .brand img{height:30px;}
}

/* ----- NAV: desktop layout with 3 children (brand | nav | auth in nav), burger hidden ----- */
@media (min-width:921px){
  .nav-sep {
    margin-left:0;
    display:flex;
    gap:20px;
    flex-direction:row;
    align-items:center;
    justify-content:flex-end;
  }
  .v2-nav{
    display:flex; align-items:center; justify-content:space-between; gap:16px;
  }
  .menu-toggle{display:none;}
  #mainNav{
    position:static;
    display:flex !important;
    align-items:center;
    gap:22px;
    flex:1 1 auto;
    justify-content:center;
  }
  #mainNav .navigation{
    display:flex;
    gap:36px;
    margin:0;
    padding:0;
    align-items:center;
    justify-content:center;
  }
}
.v2-result-banner{margin-bottom:16px;border:1px solid rgba(15,23,42,0.08);background:rgba(248,250,252,0.85);border-radius:14px;padding:12px 16px;font-size:14px;color:#0f172a;display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.v2-result-banner strong{font-weight:600;}
.v2-result-banner__btn{border:none;border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600;background:linear-gradient(135deg,rgba(99,102,241,0.18),rgba(59,130,246,0.18));color:#1e1b4b;cursor:pointer;}
.v2-result-banner__btn:hover{background:linear-gradient(135deg,rgba(99,102,241,0.28),rgba(59,130,246,0.28));}
.sup-results-drawer {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 60;
    font-family: inherit;
}
.sup-results-drawer.is-hidden {
    display: none;
}
.sup-results-drawer__toggle {
    border-radius: 999px;
    border: none;
    background: #0f172a;
    color: #f8fafc;
    padding: 10px 16px;
    font-size: 14px;
    font-weight: 600;
    box-shadow: 0 8px 30px rgba(15, 23, 42, 0.25);
    display: flex;
    align-items: center;
    gap: 6px;
}
.sup-results-drawer__count {
    background: rgba(248, 250, 252, 0.2);
    border-radius: 999px;
    padding: 2px 8px;
    font-size: 12px;
}
.sup-results-drawer__panel {
    position: fixed;
    bottom: 80px;
    right: 24px;
    width: 320px;
    max-height: 70vh;
    overflow: hidden;
    background: #ffffff;
    color: #0f172a;
    border-radius: 20px;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.25);
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    transform: translateY(16px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease, transform 0.25s ease;
}
.sup-results-drawer.is-open .sup-results-drawer__panel {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}
.sup-results-drawer__header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}
.sup-results-drawer__label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #64748b;
    margin: 0;
}
.sup-results-drawer__query {
    font-weight: 600;
    margin: 2px 0 0;
}
.sup-results-drawer__note {
    font-size: 12px;
    margin: 4px 0 0;
    color: #475569;
}
.sup-results-drawer__close {
    border: none;
    background: rgba(15, 23, 42, 0.08);
    color: #0f172a;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    font-size: 18px;
    line-height: 1;
}
.sup-results-drawer__actions {
    display: flex;
    gap: 8px;
}
.sup-results-drawer__actions button {
    flex: 1;
    border-radius: 10px;
    border: 1px solid rgba(15, 23, 42, 0.15);
    background: #f1f5f9;
    font-size: 13px;
    font-weight: 600;
    padding: 8px 10px;
}
.sup-results-drawer__list {
    list-style: none;
    padding: 0;
    margin: 0;
    overflow-y: auto;
    max-height: 45vh;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.sup-results-drawer__item a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    text-decoration: none;
    color: #0f172a;
    font-weight: 600;
    font-size: 14px;
}
.sup-results-drawer__item .sup-results-drawer__chip {
    background: rgba(15, 23, 42, 0.08);
    color: #0f172a;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 999px;
    margin-left: 8px;
}
.sup-results-drawer__item.is-active a {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.15), rgba(59, 130, 246, 0.15));
    border-color: rgba(99, 102, 241, 0.35);
    color: #1e1b4b;
}
@media (max-width: 900px) {
    .sup-results-drawer {
        bottom: 12px;
        right: 12px;
    }
    .sup-results-drawer__panel {
        width: calc(100vw - 24px);
        right: 12px;
        left: 12px;
        bottom: 92px;
        max-height: 65vh;
    }
}

.tool-search-panel {
    position: fixed;
    top: 130px;
    right: 32px;
    width: 320px;
    max-width: calc(100vw - 40px);
    background: #f8fafc;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 20px;
    padding: 16px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.18);
    z-index: 55;
    font-family: inherit;
}
.tool-search-panel__header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.tool-search-panel__eyebrow {
    margin: 0;
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
}
.tool-search-panel__query {
    margin: 2px 0 0;
    font-weight: 700;
    color: #0f172a;
}
.tool-search-panel__note {
    margin: 2px 0 0;
    font-size: 12px;
    color: #475569;
}
.tool-search-panel__count {
    font-size: 13px;
    font-weight: 600;
    color: #475569;
}
.tool-search-panel__empty {
    margin: 0;
    font-size: 13px;
    color: #475569;
}
.tool-search-panel__body {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.tool-search-panel__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 45vh;
    overflow-y: auto;
}
.tool-search-panel__item a {
    display: flex;
    flex-direction: column;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.12);
    text-decoration: none;
    color: #0f172a;
    font-weight: 600;
    gap: 4px;
}
.tool-search-panel__item small {
    font-weight: 500;
    color: #475569;
}
.tool-search-panel__chip {
    display: inline-flex;
    align-items: center;
    background: rgba(15, 23, 42, 0.08);
    color: #0f172a;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 999px;
    margin-left: 8px;
}
.tool-search-panel__item.is-active a {
    border-color: rgba(99, 102, 241, 0.4);
    background: rgba(99, 102, 241, 0.12);
    color: #1e1b4b;
}
.tool-search-panel__nav {
    display: flex;
    gap: 8px;
}
.tool-search-panel__nav button {
    flex: 1;
    border-radius: 12px;
    border: 1px solid rgba(15, 23, 42, 0.12);
    background: #fff;
    font-weight: 600;
    font-size: 13px;
    padding: 8px 10px;
}
@media (max-width: 1200px) {
    .tool-search-panel {
        display: none;
    }
}


#wpEstimateBadge {
    margin: 0;
}