/* Citrus Pro detail page */
/* The JPG is painted directly on the hero element for reliable Safari/file:// rendering. */
.pro-page .features-page-hero {
  background-color: #0e1215;
  background-image: url('https://citruslibrary.app/SiteImg/pro-page-hero-v25.jpg');
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}
.pro-page .features-page-hero::before {
  /* Keep the copy side dark, but let the product artwork remain clearly visible. */
  background: linear-gradient(90deg,
    rgba(7, 9, 10, .80) 0%,
    rgba(7, 9, 10, .72) 34%,
    rgba(7, 9, 10, .58) 58%,
    rgba(7, 9, 10, .42) 100%);
  filter: none;
  transform: none;
}
.pro-page .features-page-hero::after {
  /* No large yellow fog over the artwork. */
  background: linear-gradient(90deg,
    rgba(0,0,0,.12) 0%,
    rgba(0,0,0,.04) 48%,
    rgba(0,0,0,0) 76%);
}
.pro-page .feature-story-media.dark-media {
  background: #10161b;
  border-color: rgba(255,255,255,.12);
  box-shadow: 0 30px 78px rgba(18,20,22,.20);
}
.pro-page .feature-story-media.dark-media img { background:#10161b; }
.pro-page .compare-heading { max-width: 800px; }

.compare-tabs {
  display: flex;
  width: max-content;
  max-width: 100%;
  gap: 6px;
  margin: 0 auto 14px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.62);
  box-shadow: 0 14px 34px rgba(30,26,14,.055);
  backdrop-filter: blur(16px);
}
.compare-tab {
  appearance:none; border:0; border-radius:999px; background:transparent; color:var(--muted-strong);
  padding:12px 22px; font:inherit; font-size:.86rem; font-weight:850; cursor:pointer;
  transition:background .18s ease,color .18s ease,box-shadow .18s ease;
}
.compare-tab:hover { color:var(--ink); }
.compare-tab.is-active { background:var(--ink); color:#fff; box-shadow:0 8px 20px rgba(0,0,0,.12); }
.compare-tab:focus-visible { outline:3px solid rgba(243,196,0,.45); outline-offset:2px; }
.compare-legend { display:flex; justify-content:center; align-items:center; gap:10px 20px; margin:0 auto 28px; color:var(--muted); font-size:.77rem; font-weight:650; }
.compare-legend span { display:inline-flex; align-items:center; gap:7px; }
.legend-symbol { display:inline-grid; place-items:center; width:24px; height:24px; border-radius:50%; font-size:.9rem; line-height:1; }
.legend-yes { background:rgba(243,196,0,.18); color:#6f5900; }
.legend-no { color:#aaa79f; }
.compare-panel[hidden] { display:none; }
.compare-panel { animation:compare-in .22s ease both; }
@keyframes compare-in { from{opacity:.2;transform:translateY(5px)} to{opacity:1;transform:none} }

.pro-competitor-table { min-width: 1060px; table-layout:fixed; }
.pro-competitor-table thead th:first-child { width:32%; }
.pro-competitor-table thead th:not(:first-child) { width:13.6%; }
.pro-competitor-table tbody td:first-child { color:var(--ink); font-size:.9rem; font-weight:690; line-height:1.35; }
.pro-competitor-table tbody td:not(:first-child) { text-align:center; font-weight:800; }
.pro-competitor-table .citrus-column,
.master-compare-table .citrus-column { background:linear-gradient(180deg,rgba(243,196,0,.11),rgba(243,196,0,.035)); box-shadow:inset 1px 0 rgba(243,196,0,.13),inset -1px 0 rgba(243,196,0,.13); }
.pro-competitor-table thead .citrus-column,
.master-compare-table thead .citrus-column { background:rgba(243,196,0,.18); }
.feature-state { display:inline-grid; place-items:center; width:34px; height:34px; border-radius:50%; font-size:1.05rem; font-weight:950; line-height:1; }
.state-yes { color:#6d5700; background:rgba(243,196,0,.18); box-shadow:inset 0 0 0 1px rgba(243,196,0,.12); }
.state-no { color:#aaa79f; background:rgba(80,76,67,.035); font-weight:700; }
.master-compare-table { min-width:940px; table-layout:fixed; }
.master-compare-table thead th:first-child { width:36%; }
.master-compare-table thead th:not(:first-child) { width:16%; }
.master-compare-table tbody td:first-child { font-size:.9rem; font-weight:690; }
.master-compare-table tbody td:not(:first-child) { text-align:center; }
.compare-product-price { display:block; margin-top:4px; color:var(--muted); font-size:.72rem; line-height:1.3; font-weight:650; }
.compare-product-price.included { color:#806700; font-weight:850; }
.comparison-sources { margin:14px 2px 0; color:var(--muted); font-size:.72rem; line-height:1.45; text-align:center; }
.comparison-sources a { color:inherit; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }

@media (max-width: 860px) {
  .compare-tabs { display:grid; grid-template-columns:1fr; width:100%; border-radius:20px; }
  .compare-tab { border-radius:14px; }
}


/* Unified table pricing footer */
.compare-table .pricing-group td { background: rgba(18,18,16,.055); color: var(--muted-strong); }
.compare-table .pricing-row td { padding-top: 21px; padding-bottom: 21px; font-weight: 900; background: rgba(255,255,255,.55); }
.compare-table .pricing-row td:not(:first-child) { text-align: center; font-size: .96rem; }
.compare-table .pricing-row td:nth-child(2) { background: rgba(243,196,0,.10); }


/* V26 layout correction: full-bleed backgrounds, normal centred content shell. */
.pro-page .feature-story-list { padding:0; background:#0b0e12; }
.pro-page .feature-story-list .feature-story {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  width:100%;
  min-height:clamp(580px,78svh,900px);
  margin:0;
  padding:0;
  display:flex;
  align-items:stretch;
  border:0;
  border-radius:0;
  color:#fff;
  background:#10151a;
}
.pro-page .feature-story-list .feature-story::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background-image:var(--story-image);
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}
.pro-page .feature-story-list .feature-story::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,rgba(6,8,11,.91) 0%,rgba(6,8,11,.78) 38%,rgba(6,8,11,.48) 67%,rgba(6,8,11,.24) 100%);
}
.pro-page .feature-story-list .feature-story.reverse::after {
  background:linear-gradient(270deg,rgba(6,8,11,.91) 0%,rgba(6,8,11,.78) 38%,rgba(6,8,11,.48) 67%,rgba(6,8,11,.24) 100%);
}
.pro-page .feature-story-list .story-section-shell {
  min-height:inherit;
  display:flex;
  align-items:center;
  padding-block:clamp(70px,9vw,140px);
}
.pro-page .feature-story-list .feature-story.reverse .story-section-shell { justify-content:flex-end; }
.pro-page .feature-story-list .feature-story-copy {
  width:min(650px,100%);
  max-width:650px;
  position:relative;
  z-index:1;
}
.pro-page .feature-story-list .feature-story-copy h2 { color:#fff; text-shadow:0 2px 28px rgba(0,0,0,.22); }
.pro-page .feature-story-list .feature-story-copy p,
.pro-page .feature-story-list .story-points li { color:rgba(255,255,255,.88); }
.pro-page .feature-story-list .feature-story-kicker { color:#f3c400; }
.pro-page .feature-story-list .story-points li::before { color:#f3c400; }
.pro-page .feature-story-list .feature-story-media { display:none!important; }
@media(max-width:760px){
  .pro-page .feature-story-list .feature-story { min-height:620px; }
  .pro-page .feature-story-list .story-section-shell,
  .pro-page .feature-story-list .feature-story.reverse .story-section-shell {
    justify-content:flex-start;
    padding-block:74px;
  }
  .pro-page .feature-story-list .feature-story::after,
  .pro-page .feature-story-list .feature-story.reverse::after {
    background:linear-gradient(180deg,rgba(6,8,11,.45) 0%,rgba(6,8,11,.80) 46%,rgba(6,8,11,.94) 100%);
  }
}
