/* PassionLabs product sites v0.2 — shared, dependency-free design system */
:root {
  color-scheme: dark;
  --bg:#080d19; --surface:#111a2b; --surface-alt:#15213a;
  --text:#eff5ff; --muted:#a6b5cd; --line:rgba(202,219,255,.15);
  --mint:#72e8cb; --teal:#51dfd3; --blue:#75a3ff; --purple:#b7a5ff;
  --accent:var(--mint); --accent-ink:#051b1b;
  --radius:22px;
}
* {box-sizing:border-box}
html {scroll-behavior:smooth}
body {
  margin:0; min-height:100vh; color:var(--text);
  font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;
  background:
    radial-gradient(ellipse at 75% 5%,rgba(58,79,150,.27),transparent 39%),
    radial-gradient(ellipse at 7% 37%,rgba(32,89,103,.18),transparent 35%),
    var(--bg);
}
body.pagesense {--accent:var(--teal);--accent-ink:#032327}
body.testforge {--accent:var(--blue);--accent-ink:#071b3b}
a {color:inherit}
a:focus-visible,button:focus-visible {outline:3px solid var(--accent);outline-offset:4px}
.wrap {width:min(1140px,calc(100% - 48px));margin-inline:auto}
.skip {position:absolute;top:-100px;left:14px;padding:10px;background:var(--accent);color:var(--accent-ink);z-index:100}
.skip:focus {top:12px}
.site-header {border-bottom:1px solid var(--line);background:rgba(8,13,25,.6)}
.nav {min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand {display:inline-flex;align-items:center;gap:10px;text-decoration:none;white-space:nowrap;font-size:1.28rem;font-weight:800;letter-spacing:-.045em}
.brand-symbol {display:inline-grid;place-items:center;width:35px;height:35px;border-radius:11px;border:1px solid rgba(114,232,203,.4);background:linear-gradient(145deg,#0b544b,#19346c);color:#e9fff8;font-weight:900}
.brand .brand-dot {color:var(--mint)}
.navlinks {display:flex;align-items:center;gap:27px;flex-wrap:wrap}
.navlinks a {color:var(--muted);font-size:.9rem;text-decoration:none}
.navlinks a:hover,.navlinks [aria-current="page"] {color:var(--text)}
.navlinks .nav-cta {border:1px solid var(--line);border-radius:10px;padding:8px 13px;color:var(--text)}
.hero {padding:108px 0 72px;max-width:900px}
.eyebrow {display:inline-flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.16em;font-size:.74rem;font-weight:800;color:var(--accent)}
.eyebrow:before {content:"";display:block;width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 17px var(--accent)}
h1,h2,h3,p {margin-top:0}
h1 {font-size:clamp(3.2rem,7.6vw,6.2rem);letter-spacing:-.075em;line-height:1.07;margin:22px 0 24px;font-weight:820}
h1 .gradient {background:linear-gradient(95deg,var(--mint),var(--blue) 50%,var(--purple));background-clip:text;-webkit-background-clip:text;color:transparent}
h1 .accent-text {color:var(--accent)}
.lede {color:var(--muted);max-width:660px;font-size:clamp(1.08rem,2vw,1.23rem)}
.actions {display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:30px}
.btn {display:inline-flex;align-items:center;justify-content:center;text-decoration:none;min-height:46px;padding:10px 19px;border:1px solid var(--line);border-radius:12px;font-weight:750;font-size:.9rem;transition:transform .2s,background .2s}
.btn:hover {transform:translateY(-2px)}
.btn.primary {color:var(--accent-ink);background:var(--accent);border-color:transparent}
.btn.secondary {background:rgba(255,255,255,.025)}
.section {padding:47px 0 92px}
.section-head {display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:29px}
.section-head h2 {font-size:clamp(1.9rem,4vw,2.65rem);letter-spacing:-.05em;line-height:1.18;margin:8px 0 0}
.section-head p {max-width:370px;color:var(--muted);margin:0}
.product-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.product-card {position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:390px;padding:34px;border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(160deg,rgba(28,42,68,.89),rgba(13,20,35,.96));transition:border-color .2s,transform .2s}
.product-card:hover {transform:translateY(-4px);border-color:var(--card-color)}
.product-card.page-card {--card-color:var(--teal)}
.product-card.test-card {--card-color:var(--blue)}
.product-card::after {content:"";position:absolute;right:-40px;top:-70px;width:240px;height:240px;border-radius:50%;background:var(--card-color);opacity:.07;filter:blur(38px);pointer-events:none}
.product-head {display:flex;align-items:center;justify-content:space-between;gap:12px}
.product-icon {display:grid;place-items:center;width:70px;height:70px;border-radius:19px;background:rgba(89,133,218,.14);border:1px solid rgba(166,197,255,.17)}
.page-card .product-icon {color:var(--teal);background:rgba(81,223,211,.10)}
.test-card .product-icon {color:var(--blue);background:rgba(117,163,255,.10)}
.product-icon svg {width:38px;height:38px}
.label {color:var(--muted);font-size:.74rem;font-weight:750;letter-spacing:.11em;text-transform:uppercase}
.product-card h3 {font-size:2rem;line-height:1.15;letter-spacing:-.05em;margin:29px 0 12px}
.product-card p {color:var(--muted);max-width:360px}
.card-link {position:relative;margin-top:auto;display:inline-flex;gap:8px;align-items:center;text-decoration:none;font-weight:760;color:var(--card-color)}
.card-link:hover {text-decoration:underline;text-underline-offset:4px}
.card-link::after {content:"";position:absolute;inset:-15px -200px -25px -20px}
.detail-panel,.note {border:1px solid var(--line);border-radius:19px;background:rgba(17,26,43,.77);padding:28px}
.note {color:var(--muted)}
.note strong {color:var(--text)}
.mini-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.mini-card {padding:24px;border:1px solid var(--line);border-radius:17px;background:rgba(21,33,58,.55)}
.mini-card h3 {font-size:1.13rem;letter-spacing:-.03em;margin-bottom:8px}
.mini-card p {color:var(--muted);font-size:.92rem;margin:0}
.mini-index {color:var(--accent);font-size:.8rem;letter-spacing:.13em;font-weight:800;margin-bottom:15px;display:block}
.product-hero {display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:55px;align-items:center;padding:105px 0 92px}
.product-hero h1 {font-size:clamp(3.4rem,6vw,5.55rem)}
.product-hero .lede {max-width:590px}
.visual {min-height:390px;position:relative;border-radius:24px;border:1px solid var(--line);overflow:hidden;background:radial-gradient(circle at 78% 12%,rgba(87,139,237,.18),transparent 45%),linear-gradient(150deg,#1a2a45,#0d1525);padding:24px;display:flex;align-items:center;justify-content:center}
.pagesense .visual {background:radial-gradient(circle at 78% 12%,rgba(59,230,210,.18),transparent 45%),linear-gradient(150deg,#17303b,#0c1827)}
.visual-window {width:100%;max-width:330px;transform:rotate(-3deg);border:1px solid rgba(214,232,255,.23);box-shadow:0 25px 70px rgba(0,0,0,.3);border-radius:16px;background:#15213b;padding:19px}
.window-top {display:flex;align-items:center;gap:6px;padding-bottom:15px;border-bottom:1px solid var(--line)}
.dot {width:7px;height:7px;border-radius:50%;background:#6a80ab}
.window-title {margin-left:auto;color:var(--muted);font-size:.71rem}
.doc {background:#edf7fb;color:#24465b;border-radius:10px;padding:21px;margin-top:18px}
.doc-title {height:12px;width:70%;border-radius:4px;background:#8baab8;margin-bottom:22px}
.doc-line {height:8px;margin-bottom:10px;border-radius:4px;background:#c5d7dd}
.doc-line.short {width:57%}
.doc-line.med {width:79%}
.scan-box {border:2px dashed #119f98;border-radius:7px;padding:11px;margin:16px -9px 10px}
.scan-box .doc-line {background:#b2d9d3}
.exam-row {display:flex;align-items:center;gap:11px;margin:14px 0;color:#c5d6f7;font-size:.82rem}
.exam-bullet {display:grid;place-items:center;flex:0 0 24px;height:24px;border-radius:7px;background:rgba(117,163,255,.16);color:var(--blue)}
.exam-bar {height:9px;background:#344c73;border-radius:8px;flex:1}
.exam-bar.short {max-width:60%}
.result-chip {display:inline-block;margin-top:8px;padding:7px 11px;border-radius:7px;color:#90ffe6;background:rgba(48,168,135,.12);font-size:.8rem;font-weight:700}
.breadcrumb {font-size:.85rem;color:var(--muted);text-decoration:none}
.breadcrumb:hover {color:var(--accent)}
.site-footer {border-top:1px solid var(--line);padding:35px 0;color:var(--muted);font-size:.85rem}
.footer-content {display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.footer-content a {text-decoration:none}
.footer-content a:hover {color:var(--text)}
.stack {display:flex;gap:15px;flex-wrap:wrap}
.note a {color:var(--accent)}
@media(max-width:900px) {
 .product-hero {grid-template-columns:1fr;gap:24px;padding-top:75px}
 .visual {min-height:300px}
}
@media(max-width:700px) {
 .wrap {width:min(100% - 32px,1140px)}
 .nav {min-height:72px;align-items:flex-start;padding:17px 0;flex-direction:column}
 .navlinks {gap:18px}
 .hero {padding:80px 0 44px}
 .product-grid,.mini-grid {grid-template-columns:1fr}
 .product-card {min-height:335px;padding:26px}
 .section-head {display:block}
 .section-head p {margin-top:13px}
 .section {padding:34px 0 68px}
 .product-hero {padding:70px 0}
}
@media(prefers-reduced-motion:reduce) {
 html {scroll-behavior:auto}
 *,*::before,*::after {transition:none!important;animation:none!important}
}