/* =========================================================
   PRICING V5 — ClickUp V4 inspired (NOT copied)
   ✅ clean, airy, high-CTR
   ✅ lightweight (no heavy animations)
========================================================= */

.prV5{
  background:#fff;
  color: rgb(13,15,18);
}

/* =========================
   V6 CTA (consistent with your theme)
========================= */
.prV6Cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top: 22px;
  height: 50px;
  padding: 0 26px;
  border-radius: 12px;
  text-decoration:none;

  font-family:"Inter",sans-serif;
  font-weight: 700;
  font-size: 15px;

  color: #fff;
  background: linear-gradient(90deg,
    rgba(59,130,246,.95),
    rgba(124,58,237,.85),
    rgba(236,72,153,.70)
  );
  border: 1px solid rgba(59,130,246,.25);
  box-shadow: 0 18px 46px rgba(59,130,246,.18);

  transition: transform .12s ease, box-shadow .18s ease, filter .18s ease;
}

.prV6Cta:hover{
  transform: translateY(-1px);
  box-shadow: 0 24px 62px rgba(124,58,237,.20);
  filter: brightness(1.02);
}

.prV6Cta:active{ transform: translateY(0); }

.prV6Note{
  margin-top: 10px;
  font-family:"Inter",sans-serif;
  font-size: 13px;
  color: rgba(13,15,18,.55);
}

/* Responsive: CTA width on mobile */
@media (max-width: 520px){
  .prV6Cta{ width: 100%; max-width: 320px; }
}

/* =========================================================
   PRICING HERO (V6)
   ✅ Eyebrow = plain text (NOT chip)
   ✅ Title gradient only when section is-active (scroll)
   ✅ Points row = not chips (clean line items)
========================================================= */

.prV6Hero{
 padding-top: 20vh;
 padding-bottom: 10vh;


  /* light premium bg (same family as your site) */
  background:
    radial-gradient(900px 420px at 150% 0%,
      rgba(59,130,246,0.10) 0%,
      rgba(124,58,237,0.06) 38%,
      rgba(255,255,255,1) 74%
    );
}

.prV6Hero__inner{
  max-width: 1400px;
  margin: 0 auto;
  text-align: center;
}

/* ✅ Eyebrow — plain, like your COMPARE label */
.prV6Eyebrow{
  font-family:"Sometype Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-weight: 500;
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(13,15,18,.55);
  margin-bottom: 10px;
}

/* Title base */
.prV6Title{
  margin: 0 0 10px;
  font-family:"Plus Jakarta Sans","Inter",sans-serif;
  font-weight: 700;
  font-size: 46px;
  line-height: 52px;
  letter-spacing:-0.03em;
  color: rgb(13,15,18);
}

/* ✅ Scroll active: gradient title (your exact theme) */
.prV6Hero.is-active .prV6Title{
  background: linear-gradient(90deg,
    rgba(59,130,246,.95),
    rgba(124,58,237,.85),
    rgba(236,72,153,.70),
    rgba(59,130,246,.95)
  );
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: prV6TitleFlow 1.35s ease-in-out infinite;
}

@keyframes prV6TitleFlow{
  0%{ background-position:0% 50%; }
  50%{ background-position:100% 50%; }
  100%{ background-position:0% 50%; }
}

/* Sub */
.prV6Sub{
  margin: 0 auto;
  max-width: 860px;
  font-family:"Inter",sans-serif;
  font-size: 16px;
  line-height: 26px;
  color: rgba(13,15,18,.68);
}

/* ✅ Points row (not chips) */
.prV6Points{
  margin-top: 16px;
  display:flex;
  justify-content:center;
  gap: 18px;
  flex-wrap: wrap;
}

.prV6Point{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  font-family:"Inter",sans-serif;
  font-size: 13px;
  color: rgba(13,15,18,.70);
}

/* small gradient dot */
.prV6Dot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: linear-gradient(90deg,
    rgba(59,130,246,.95),
    rgba(124,58,237,.85),
    rgba(236,72,153,.70)
  );
  box-shadow: 0 10px 22px rgba(13,15,18,.10);
}

/* Responsive */
@media (max-width: 980px){
  .prV6Hero{ padding: 96px 16px 38px; }
  .prV6Title{ font-size: 34px; line-height: 40px; }
  .prV6Points{ gap: 12px; }
}

@media (max-width: 520px){
  .prV6Title{ font-size: 30px; line-height: 36px; }
  .prV6Sub{ font-size: 15px; line-height: 24px; }
}




/* =========================
   HERO CTA width control
   ✅ Uses mkCard button
   ✅ Not full width
========================= */
.mkBtn--hero{
  width: auto !important;          /* stop full width */
  display: inline-flex !important; /* keep centered */
  min-width: 240px;                /* reference like */
  max-width: 320px;
  padding-left: 22px;
  padding-right: 22px;
  margin-left: auto;
  margin-right: auto;
}

/* mobile: still controlled (not edge-to-edge) */
@media (max-width: 520px){
  .mkBtn--hero{
    min-width: 0;
    width: 100% !important;
    max-width: 320px;
  }
}









/* =========================
   BILLING TOGGLE (ClickUp-like)
========================= */
.mkBillRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  padding: 10px 0 18px;
}

.mkGuarantee{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  font-family:"Inter",sans-serif;
  font-size: 13px;
  color: rgba(13,15,18,.70);
}

.mkGDot{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  font-size: 12px;
  font-weight: 800;
  color: #18794E;
  background: rgba(24,121,78,.10);
  border: 1px solid rgba(24,121,78,.18);
}

/* right side */
.mkToggleWrap{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap: 8px;
}

.mkSave{
  font-family:"Inter",sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: rgba(59,130,246,.95);
}

/* toggle container */
.mkToggle{
  position:relative;
  display:inline-grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  padding: 4px;
  border-radius: 999px;
  border: 1px solid rgba(13,15,18,.10);
  background: rgba(13,15,18,.04);
  overflow:hidden;
  min-width: 210px;
}

.mkTbtn{
  position:relative;
  z-index:2;
  height: 34px;
  padding: 0 16px;
  border: 0;
  background: transparent;
  cursor:pointer;
  font-family:"Inter",sans-serif;
  font-weight: 700;
  font-size: 13px;
  color: rgba(13,15,18,.65);
  transition: color .15s ease;
}

.mkTbtn.is-active{
  color: rgba(13,15,18,.92);
}

/* moving pill */
.mkTPill{
  position:absolute;
  top: 4px;
  left: 4px;
  width: calc(50% - 4px);
  height: 34px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(13,15,18,.10);
  box-shadow: 0 10px 26px rgba(13,15,18,.10);
  transform: translateX(0%);
  transition: transform .22s ease;
}

/* when yearly active => move right */
.mkToggle[data-active="yearly"] .mkTPill{
  transform: translateX(100%);
}

/* Responsive */
@media (max-width: 900px){
  .mkBillRow{
    flex-direction:column;
    align-items:flex-start;
  }
  .mkToggleWrap{
    align-items:flex-start;
    width:100%;
  }
}









/* Default: Black text for light cards */
[data-limit] {
  font-weight: 700;
  color: #000; 
  transition: opacity 0.2s ease;
}

/* ✅ FIX: White text for the BLACK card */
.mkCard--dark [data-limit] {
  color: #fff; 
}

/* Price Sub-text (/mo) */
.jsPrice span {
  font-size: 0.8em;
  font-weight: normal;
  color: #666; /* Dark grey for light cards */
}

/* ✅ FIX: Light grey sub-text for BLACK card */
.mkCard--dark .jsPrice span {
  color: #bbb; 
}


/* =========================
   PRICING GRID (ClickUp-like)
========================= */
.mkPrice{
  padding: 60px 20px 90px;
  background:#fff;
}
.mkPrice__inner{
  max-width: 1400px;
  margin: 0 auto;
}
.mkPrice__grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  align-items: stretch;
}

/* =========================
   CARD BASE
========================= */
.mkCard{
  border-radius: 14px;
  border: 1px solid rgba(13,15,18,.10);
  background:#fff;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height: 560px;
}

.mkCard__head{
  padding: 18px 18px 16px;
}
.mkCard__name{
  margin:0;
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 22px;
  letter-spacing: -0.02em;
  color: rgba(13,15,18,.92);
}

/* TopRow (only for popular card) */
.mkCard__topRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
}

.mkCard__pill{
  font-family: "Inter", sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: rgba(13,15,18,.85);
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(255,255,255,.70);
  padding: 4px 10px;
  border-radius: 999px;
}

/* Price block */
.mkCard__priceLine{
  margin-top: 3px;
}
.mkCard__amount{
  font-family: "Inter", sans-serif;
  font-weight: 800;
  font-size: 34px;
  line-height: 40px;
  letter-spacing: -0.03em;
  color: rgba(13,15,18,.92);
}
.mkCard__period{
  margin-top: 4px;
  font-family: "Inter", sans-serif;
  font-size: 12px;
  color: rgba(13,15,18,.55);
}

/* Button (same shape like screenshot) */
.mkCard__btn{
  display:flex;
  align-items:center;
  justify-content:center;
  height: 42px;
  border-radius: 10px;
  margin-top: 14px;
  text-decoration:none;
  font-family:"Inter",sans-serif;
  font-weight: 700;
  font-size: 16px;
  border: 1px solid transparent;
  transition: transform .12s ease;
}
.mkCard__btn:active{ transform: scale(.98); }

.mkCard__btn--dark{
  background: rgba(13,15,18,.92);
  color:#fff;
}
.mkCard__btn--muted{
  background: rgba(13,15,18,.06);
  color: rgba(13,15,18,.82);
  border-color: rgba(13,15,18,.08);
}
.mkCard__btn--light{
  background: rgba(255,255,255,.92);
  color: rgba(13,15,18,.92);
}

/* Divider line */
.mkCard__divider{
  height: 1px;
  background: rgba(13,15,18,.10);
}
.mkCard__divider--dark{
  background: rgba(255,255,255,.14);
}

/* Body */
.mkCard__body{
  padding: 16px 18px 18px;
  flex: 1;
}
.mkCard__listTitle{
  font-family: "Sometype Mono", ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: .14em;
  color: rgba(13,15,18,.55);
  margin-bottom: 12px;
}

/* List */
.mkCard__list{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap: 11px;
}
.mkCard__list li{
  position:relative;
  padding-left: 22px;
  font-family: "Inter", sans-serif;
  font-size: 13px;
  color: rgba(13,15,18,.62);
  line-height: 18px;
}
.mkCard__list li::before{
  content:"";
  position:absolute;
  left:0;
  top: 4px;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  border: 2px solid rgba(13,15,18,.28);
  background: transparent;
}
.mkCard__list li::after{
  content:"";
  position:absolute;
  left: 4px;
  top: 8px;
  width: 6px;
  height: 3px;
  border-left: 2px solid rgba(13,15,18,.68);
  border-bottom: 2px solid rgba(13,15,18,.68);
  transform: rotate(-45deg);
}

/* =========================
   BLACK (Growth) CARD
========================= */
.mkCard--dark{
  background: rgba(13,15,18,.92);
  border-color: rgba(13,15,18,.92);
}
.mkCard--dark .mkCard__name{ color: rgba(255,255,255,.96); }
.mkCard--dark .mkCard__amount{ color: rgba(255,255,255,.96); }
.mkCard--dark .mkCard__period{ color: rgba(255,255,255,.62); }
.mkCard--dark .mkCard__listTitle{ color: rgba(255,255,255,.52); }
.mkCard__list--dark li{ color: rgba(255,255,255,.78); }

.mkCard__list--dark li::before{
  border-color: rgba(255,255,255,.30);
}
.mkCard__list--dark li::after{
  border-left-color: rgba(255,255,255,.86);
  border-bottom-color: rgba(255,255,255,.86);
}

/* Popular slight emphasis same card only */
.mkCard--popular{
  box-shadow: 0 26px 70px rgba(13,15,18,.16);
}

/* =========================
   Responsive
========================= */
@media (max-width: 1200px){
  .mkPrice__grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px){
  .mkPrice__grid{ grid-template-columns: 1fr; }
  .mkCard{ min-height: auto; }
}


/* =========================
   PRICING CARDS — Hover React (Lightweight)
========================= */

/* base card */
.mkCard{
  position: relative;
  border-radius: 18px;
  border: 1px solid rgba(13,15,18,.10);
  background: #fff;
  box-shadow: 0 18px 60px rgba(13,15,18,.06);
  transform: translateY(0);
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease,
    filter .18s ease;
  will-change: transform;
}

/* subtle top highlight line */
.mkCard::before{
  content:"";
  position:absolute;
  left:14px; right:14px; top:10px;
  height:1px;
  border-radius: 999px;
  background: linear-gradient(90deg,
    rgba(59,130,246,0),
    rgba(124,58,237,.22),
    rgba(236,72,153,.18),
    rgba(59,130,246,0)
  );
  opacity:.35;
  transition: opacity .18s ease;
  pointer-events:none;
}

/* hover react */
.mkCard:hover{
  transform: translateY(-6px);
  border-color: rgba(13,15,18,.18);
  box-shadow:
    0 26px 80px rgba(13,15,18,.10),
    0 10px 30px rgba(13,15,18,.06);
}

.mkCard:hover::before{
  opacity:.75;
}

/* focus (keyboard) */
.mkCard:focus-within{
  border-color: rgba(59,130,246,.38);
  box-shadow:
    0 26px 80px rgba(13,15,18,.10),
    0 0 0 4px rgba(59,130,246,.12);
}

/* =========================
   BUTTON react inside card
========================= */
.mkCard .mkCta{
  transition: transform .16s ease, filter .16s ease;
}
.mkCard:hover .mkCta{
  transform: translateY(-1px);
  filter: brightness(1.02);
}

/* =========================
   POPULAR / DARK card hover glow
   (assume you add class: .mkCard--popular)
========================= */
.mkCard--popular{
  background: #16181c;     /* your black card */
  color: rgba(255,255,255,.92);
  border-color: rgba(255,255,255,.10);
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
}

.mkCard--popular:hover{
  transform: translateY(-7px);
  border-color: rgba(255,255,255,.16);
  box-shadow:
    0 30px 90px rgba(0,0,0,.28),
    0 0 0 1px rgba(124,58,237,.10);
}

.mkCard--popular::before{
  opacity:.55;
}

.mkCard--popular:hover::before{
  opacity:.95;
}

/* Popular card CTA hover stronger */
.mkCard--popular:hover .mkCta{
  filter: brightness(1.06);
}

/* =========================
   Reduce motion (accessibility)
========================= */
@media (prefers-reduced-motion: reduce){
  .mkCard,
  .mkCard::before,
  .mkCard .mkCta{
    transition: none !important;
  }
}






/* =========================================================
   PRICING V6 — TABLE STYLE (NO CARDS) + CLEAN
   Max width: 1400
========================================================= */

.prV6{ padding: 28px 20px 34px; }
.prV6__inner{
  max-width: 1400px;
  margin: 0 auto;
}

.prV6Top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  padding: 8px 0 10px;
}
.prV6Top--toggleOnly{
  justify-content:flex-end;
  padding: 0 0 8px;
}

/* Collapse button */
.prV6Collapse{
  border: 1px solid rgba(13,15,18,.10);
  background: rgba(13,15,18,.03);
  padding: 10px 12px;
  border-radius: 12px;
  font-family:"Inter",sans-serif;
  font-weight: 800;
  font-size: 13px;
  color: rgba(13,15,18,.88);
  display:inline-flex;
  align-items:center;
  gap:10px;
  cursor:pointer;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.prV6Collapse:hover{
  background: rgba(13,15,18,.05);
  border-color: rgba(13,15,18,.14);
  transform: translateY(-1px);
}

/* Body collapse */
.prV6Body[hidden]{ display:none !important; }
.prV6.is-collapsed .prV6Body{ display:none !important; }

/* =========================
   Toggle (ClickUp-like)
========================= */
.prV6ToggleWrap{ display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
.prV6Save{
  font-family:"Inter",sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: rgba(59,130,246,.95);
}

.prV6Toggle{
  position:relative;
  display:inline-grid;
  grid-template-columns: 1fr 1fr;
  padding: 4px;
  border-radius: 999px;
  border: 1px solid rgba(13,15,18,.10);
  background: rgba(13,15,18,.04);
  overflow:hidden;
  min-width: 210px;
}
.prV6Tbtn{
  position:relative;
  z-index:2;
  height: 34px;
  padding: 0 16px;
  border: 0;
  background: transparent;
  cursor:pointer;
  font-family:"Inter",sans-serif;
  font-weight: 900;
  font-size: 13px;
  color: rgba(13,15,18,.62);
}
.prV6Tbtn.is-active{ color: rgba(13,15,18,.92); }

.prV6TPill{
  position:absolute;
  top: 4px;
  left: 4px;
  width: calc(50% - 4px);
  height: 34px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(13,15,18,.10);
  box-shadow: 0 10px 26px rgba(13,15,18,.10);
  transform: translateX(100%); /* default yearly */
  transition: transform .22s ease;
}
.prV6Toggle[data-active="monthly"] .prV6TPill{ transform: translateX(0%); }
.prV6Toggle[data-active="yearly"] .prV6TPill{ transform: translateX(100%); }

/* =========================
   Plans Header Row (table)
========================= */
.prV6Head{
  display:grid;
  grid-template-columns: 1.35fr repeat(4, 1fr);
  border-bottom: 1px solid rgba(13,15,18,.10);
  padding: 10px 0 14px;
  gap: 0;
}

.prV6Head__blank{ padding: 0 12px; }

.prV6Plan{
  padding: 0 12px;
  border-left: 1px solid rgba(13,15,18,.06);
  transition: transform .14s ease, background .14s ease;
}
.prV6Plan:first-of-type{ border-left: 0; }
.prV6Plan:hover{ transform: translateY(-2px); }

.prV6Plan__name{
  font-family:"Inter",sans-serif;
  font-weight: 900;
  font-size: 15px;
  color: rgb(13,15,18);
  display:flex;
  align-items:center;
  gap:8px;
}

.prV6Plan__price{
  margin-top: 6px;
  font-family:"Inter",sans-serif;
  font-weight: 900;
  font-size: 16px;
  color: rgba(13,15,18,.88);
}
.prV6Plan__price span{
  font-weight: 800;
  color: rgba(13,15,18,.55);
  font-size: 12px;
  margin-left: 6px;
}

/* Buttons */
.prV6Btn{
  margin-top: 10px;
  height: 34px;
  border-radius: 10px;
  font-family:"Inter",sans-serif;
  font-weight: 900;
  font-size: 13px;
  padding: 0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  border: 1px solid rgba(13,15,18,.12);
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.prV6Btn:hover{ transform: translateY(-1px); }

.prV6Btn--ghost{
  background: rgba(13,15,18,.04);
  color: rgba(13,15,18,.90);
}
.prV6Btn--dark{
  background: rgb(13,15,18);
  border-color: rgb(13,15,18);
  color: #fff;
}
.prV6Btn--light{
  background: rgba(255,255,255,.92);
  border-color: rgba(255,255,255,.22);
  color: rgb(13,15,18);
}

/* Growth black column */
.prV6Plan--growth{
  background: rgb(13,15,18);
  border-radius: 14px;
  padding: 12px;
  margin-top: -6px;
  border-left: 0;
}
.prV6Plan--growth .prV6Plan__name,
.prV6Plan--growth .prV6Plan__price{ color:#fff; }
.prV6Plan--growth .prV6Plan__price span{ color: rgba(255,255,255,.65); }

.prV6Tag{
  font-size: 11px;
  font-weight: 900;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  color: rgba(255,255,255,.92);
  border: 1px solid rgba(255,255,255,.16);
}

/* =========================
   Feature Table
========================= */
.prV6Wrap{ padding-top: 12px; }

.prV6Cat{ padding: 12px 0 2px; }
.prV6Cat__title{
  font-family:"Sometype Mono",ui-monospace,monospace;
  font-size: 12px;
  letter-spacing: .14em;
  color: rgba(13,15,18,.55);
  padding: 12px 0 8px;
}

.prV6Row{
  display:grid;
  grid-template-columns: 1.35fr repeat(4, 1fr);
  border-top: 1px solid rgba(13,15,18,.08);
  min-height: 46px;
  align-items:center;
}

.prV6Label{
  padding: 12px 12px;
  font-family:"Inter",sans-serif;
  font-weight: 700;
  font-size: 13px;
  color: rgba(13,15,18,.88);
}

.prV6Cell{
  padding: 12px 12px;
  font-family:"Inter",sans-serif;
  font-weight: 800;
  font-size: 13px;
  color: rgba(13,15,18,.78);
  border-left: 1px solid rgba(13,15,18,.06);
}


/* ✅ hover react (row + column vibe) */
.prV6Row:hover{
  background: rgba(13,15,18,.02);
}


/* bottom note */
.prV6Note{
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(13,15,18,.08);
  font-family:"Inter",sans-serif;
  font-size: 13px;
  color: rgba(13,15,18,.62);
}

/* =========================
   Responsive
========================= */
@media (max-width: 980px){
  .prV6Top{ flex-direction:column; align-items:flex-start; }
  .prV6Top--toggleOnly{ align-items:flex-start; }
  .prV6ToggleWrap{ align-items:flex-start; }
}

/* Mobile: allow horizontal scroll exactly like reference */
@media (max-width: 860px){
  .prV6__inner{ overflow-x:auto; }
  .prV6Body{ min-width: 860px; }
}















/* =========================================================
  PRICING — INCLUDED IN ALL PLANS (Subtle Premium)
========================================================= */

.prInc{
  padding: 44px 20px;
  margin-top: 22px;

  /* subtle different tone */
  background: radial-gradient(900px 380px at 50% 0%,
    rgba(59,130,246,.06) 0%,
    rgba(124,58,237,.04) 35%,
    rgba(255,255,255,1) 72%
  );
  border-top: 1px solid rgba(13,15,18,.08);
}

.prInc__inner{
  max-width: 1400px;
  margin: 0 auto;
}

.prInc__top{
  text-align:center;
  max-width: 920px;
  margin: 0 auto 14px;
}

.prInc__eyebrow{
  font-family:"Sometype Mono",ui-monospace,monospace;
  font-size:12px;
  letter-spacing:.16em;
  color: rgba(13,15,18,.55);
  margin-bottom: 10px;
}

.prInc__title{
  margin: 0 0 8px 0;
  font-family:"Plus Jakarta Sans","Inter",sans-serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 36px;
  letter-spacing: -0.03em;
  color: rgb(13,15,18);
}

.prInc__sub{
  margin: 0;
  font-family:"Inter",sans-serif;
  font-size: 15px;
  line-height: 24px;
  color: rgba(13,15,18,.62);
}

/* divider with left/right fade */
.prInc__divider{
  display:flex;
  justify-content:center;
  padding: 14px 0 18px;
}

.prInc__line{
  display:block;
  width: min(860px, 92%);
  height: 1px;
  background:
    linear-gradient(to right,
      rgba(13,15,18,0) 0%,
      rgba(13,15,18,.14) 18%,
      rgba(13,15,18,.14) 82%,
      rgba(13,15,18,0) 100%
    );
}

/* grid list */
.prInc__grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}

.prInc__item{
  display:flex;
  gap: 12px;
  padding: 12px 12px;

  /* no “card” feel — just subtle surface */
  border: 1px solid rgba(13,15,18,.06);
  background: rgba(255,255,255,.72);
  border-radius: 14px;

  transition: transform .14s ease, border-color .14s ease, background .14s ease;
}

.prInc__item:hover{
  transform: translateY(-2px);
  border-color: rgba(13,15,18,.12);
  background: rgba(255,255,255,.86);
}

.prInc__dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  margin-top: 5px;
  flex: 0 0 10px;

  background: linear-gradient(90deg,
    rgba(59,130,246,.95),
    rgba(124,58,237,.85),
    rgba(236,72,153,.70)
  );
  box-shadow:
    0 10px 20px rgba(13,15,18,.08),
    0 0 0 6px rgba(59,130,246,.08);
}

.prInc__h{
  font-family:"Inter",sans-serif;
  font-weight: 800;
  font-size: 14px;
  color: rgba(13,15,18,.92);
  margin-bottom: 4px;
}

.prInc__p{
  font-family:"Inter",sans-serif;
  font-size: 13px;
  line-height: 20px;
  color: rgba(13,15,18,.62);
}

.prInc__note{
  margin-top: 14px;
  text-align:center;
  font-family:"Inter",sans-serif;
  font-size: 13px;
  color: rgba(13,15,18,.62);
}

/* responsive */
@media (max-width: 980px){
  .prInc{ padding: 36px 16px; }
  .prInc__title{ font-size: 26px; line-height: 32px; }
  .prInc__grid{ grid-template-columns: 1fr; }
}














/* =========================================================
  PRICING FAQ — LINE STYLE (NO BOX) | NO JS | LIGHTWEIGHT
  ✅ details/summary native (no lag)
  ✅ line separators + subtle bg
  ✅ smooth feel via opacity/translate (height is native)
========================================================= */

.prFaqL{
  padding: 56px 20px;
  border-top: 1px solid rgba(13,15,18,.08);
  background:
    radial-gradient(900px 380px at 50% 0%,
      rgba(59,130,246,.05) 0%,
      rgba(124,58,237,.03) 35%,
      rgba(255,255,255,1) 72%
    );
}

.prFaqL__inner{ max-width: 1400px; margin: 0 auto; }

.prFaqL__top{
  text-align:center;
  max-width: 920px;
  margin: 0 auto 16px;
}

.prFaqL__eyebrow{
  font-family:"Sometype Mono",ui-monospace,monospace;
  font-size: 12px;
  letter-spacing: .16em;
  color: rgba(13,15,18,.55);
  margin-bottom: 10px;
}

.prFaqL__title{
  margin: 0 0 8px 0;
  font-family:"Plus Jakarta Sans","Inter",sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 38px;
  letter-spacing: -0.03em;
  color: rgb(13,15,18);
}

.prFaqL__sub{
  margin: 0;
  font-family:"Inter",sans-serif;
  font-size: 15px;
  line-height: 24px;
  color: rgba(13,15,18,.62);
}

/* list: no box */
.prFaqL__list{
  max-width: 980px;
  margin: 0 auto;
  border-top: 1px solid rgba(13,15,18,.10);
}

/* details row */
.prFaqRow{
  border-bottom: 1px solid rgba(13,15,18,.10);
}

/* remove default marker */
.prFaqRow > summary{
  list-style: none;
}
.prFaqRow > summary::-webkit-details-marker{
  display:none;
}

/* question */
.prFaqRow__q{
  width: 100%;
  cursor: pointer;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 14px;
  padding: 16px 4px;
  text-align:left;

  font-family:"Inter",sans-serif;
  font-weight: 700;
  font-size: 14px;
  color: rgba(13,15,18,.92);
}

.prFaqRow__qTxt{
  transition: color .18s ease;
}

/* gradient only on text hover (not chevron) */
.prFaqRow__q:hover .prFaqRow__qTxt{
  background: linear-gradient(90deg,
    rgba(59,130,246,.95),
    rgba(124,58,237,.85),
    rgba(236,72,153,.70),
    rgba(59,130,246,.95)
  );
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}

/* chevron */
.prFaqRow__chev{
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid rgba(13,15,18,.10);
  background: rgba(255,255,255,.65);
  display:grid;
  place-items:center;
  flex: 0 0 28px;
  transition: transform .22s ease, background .22s ease, border-color .22s ease;
}
.prFaqRow__chev::before{
  content:"▾";
  opacity: .75;
  transform: translateY(-1px);
}

/* answer wrapper (lightweight feel) */
.prFaqRow__a{
  padding: 0 4px 16px;
}

.prFaqRow__aInner{
  font-family:"Inter",sans-serif;
  font-size: 13px;
  line-height: 21px;
  color: rgba(13,15,18,.62);

  opacity: 0;
  transform: translateY(-6px);
  transition: opacity 180ms ease, transform 180ms ease;
}

/* open state */
.prFaqRow[open] .prFaqRow__aInner{
  opacity: 1;
  transform: translateY(0);
}

.prFaqRow[open] .prFaqRow__chev{
  transform: rotate(180deg);
  background: rgba(13,15,18,.04);
  border-color: rgba(13,15,18,.14);
}

/* mobile */
@media (max-width: 980px){
  .prFaqL{ padding: 44px 16px; }
  .prFaqL__title{ font-size: 26px; line-height: 32px; }
  .prFaqRow__q{ padding: 14px 2px; }
  .prFaqRow__a{ padding: 0 2px 14px; }
}
































/* =========================================================
  FINAL CTA — SIMPLE (no extra mentions)
========================================================= */
.ctaSimple{
  position: relative;
  padding: 78px 20px;
  background: #fff;
  border-top: 1px solid rgba(13,15,18,.08);
}

/* subtle taper line (premium but light) */
.ctaSimple::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:1px;
  background: linear-gradient(
    90deg,
    rgba(13,15,18,0) 0%,
    rgba(13,15,18,.10) 18%,
    rgba(13,15,18,.14) 50%,
    rgba(13,15,18,.10) 82%,
    rgba(13,15,18,0) 100%
  );
  pointer-events:none;
}

.ctaSimple__inner{
  max-width: 1400px;
  margin: 0 auto;
  text-align: center;
}

.ctaSimple__tag{
  font-family:"Sometype Mono", ui-monospace, monospace;
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(13,15,18,.55);
  margin-bottom: 12px;
}

.ctaSimple__title{
  margin: 0 0 10px 0;
  font-family:"Plus Jakarta Sans","Inter",sans-serif;
  font-weight: 700;
  font-size: 38px;
  line-height: 44px;
  letter-spacing: -0.03em;
  color: rgba(13,15,18,.92);
}

.ctaSimple__sub{
  margin: 0 auto;
  max-width: 720px;
  font-family:"Inter",sans-serif;
  font-size: 16px;
  line-height: 26px;
  color: rgba(13,15,18,.62);
}

/* bottom buttons */
.ctaSimple__actions{
  margin-top: 18px;
  display:flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

/* responsive */
@media (max-width: 980px){
  .ctaSimple{ padding: 62px 16px; }
  .ctaSimple__title{ font-size: 30px; line-height: 36px; }
}

@media (max-width: 520px){
  .ctaSimple__actions{
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    justify-items: center;
  }
  .ctaSimple__actions .btn{
    width: 100%;
    max-width: 420px;
    justify-content: center;
  }
}