:root {
  --pf-bg: #070a10;
  --pf-panel: #101621;
  --pf-panel-2: #151d2b;
  --pf-line: rgba(154, 170, 197, .16);
  --pf-text: #f7f9fc;
  --pf-muted: #aab5c7;
  --pf-cyan: #8bdcf2;
  --pf-violet: #ad8cff;
  --pf-amber: #f7b45a;
  --pf-success: #79d99a;
  --pf-danger: #ff9aab;
  --pf-max: 1240px;
  --pf-radius: 22px;
  --pf-shadow: 0 28px 80px rgba(0, 0, 0, .24);
}

* { box-sizing: border-box; }
html { color-scheme: dark; scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--pf-text);
  background:
    radial-gradient(circle at 80% 0%, rgba(87, 64, 162, .13), transparent 30rem),
    radial-gradient(circle at 20% 18%, rgba(43, 136, 174, .08), transparent 28rem),
    var(--pf-bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
a { color: inherit; }
img { max-width: 100%; }
button, input { font: inherit; }
[hidden] { display: none !important; }

.pfs-container { width: min(calc(100% - 40px), var(--pf-max)); margin-inline: auto; }
.pfs-header {
  position: sticky; top: 0; z-index: 50;
  border-bottom: 1px solid var(--pf-line);
  background: rgba(7,10,16,.9);
  backdrop-filter: blur(18px);
}
.pfs-nav { display: flex; min-height: 76px; align-items: center; justify-content: space-between; gap: 22px; }
.pfs-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.pfs-brand-mark {
  display: grid; width: 42px; height: 42px; place-items: center;
  border-radius: 13px; font-weight: 950; letter-spacing: -.05em;
  color: #0b0f16; background: linear-gradient(135deg, var(--pf-amber), var(--pf-cyan));
}
.pfs-brand strong, .pfs-brand span { display: block; }
.pfs-brand strong { font-size: 1rem; }
.pfs-brand span { margin-top: 3px; color: #8190a7; font-size: .69rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.pfs-links { display: flex; align-items: center; gap: 8px; }
.pfs-links a {
  padding: 11px 14px; border-radius: 11px; color: #ccd4df;
  font-weight: 780; text-decoration: none;
}
.pfs-links a:hover, .pfs-links a.is-active { color: white; background: rgba(255,255,255,.055); }
.pfs-menu { display: none; border: 1px solid var(--pf-line); color: white; background: transparent; border-radius: 11px; padding: 10px 12px; }

.pfs-button {
  display: inline-flex; min-height: 48px; align-items: center; justify-content: center;
  padding: 0 20px; border: 1px solid var(--pf-line); border-radius: 13px;
  color: white; background: #111927; text-decoration: none; font-weight: 900; cursor: pointer;
}
.pfs-button:hover { transform: translateY(-1px); border-color: rgba(139,220,242,.45); }
.pfs-button.primary { color: #071019; border-color: transparent; background: linear-gradient(135deg, var(--pf-cyan), #b6e8f5); }
.pfs-button.violet { color: #090612; border-color: transparent; background: linear-gradient(135deg, #c7b1ff, var(--pf-violet)); }
.pfs-button.danger { color: #ffd1d8; border-color: rgba(255,93,120,.35); background: rgba(145,35,56,.16); }
.pfs-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

.pfs-hero { padding: 92px 0 74px; }
.pfs-hero-grid { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(360px,.9fr); gap: clamp(44px,7vw,88px); align-items: center; }
.pfs-kicker { color: var(--pf-cyan); font-size: .78rem; font-weight: 950; letter-spacing: .13em; text-transform: uppercase; }
.pfs-hero h1 { max-width: 900px; margin: 18px 0 22px; font-size: clamp(3.7rem,8vw,7.4rem); line-height: .9; letter-spacing: -.075em; }
.pfs-hero p { max-width: 760px; margin: 0; color: #b7c1cf; font-size: clamp(1.05rem,1.5vw,1.22rem); line-height: 1.72; }
.pfs-price-inline { display: flex; gap: 10px; align-items: baseline; margin-top: 26px; }
.pfs-price-inline strong { font-size: 2rem; letter-spacing: -.04em; }
.pfs-price-inline span { color: #8997ab; }

.pfs-suite-preview {
  overflow: hidden; border: 1px solid rgba(173,140,255,.22); border-radius: 28px;
  background: linear-gradient(150deg, #161d2c, #0b111b 72%); box-shadow: var(--pf-shadow);
}
.pfs-suite-preview-head { padding: 28px; border-bottom: 1px solid var(--pf-line); }
.pfs-suite-preview-head span { color: #8d9aaf; font-size: .72rem; font-weight: 900; text-transform: uppercase; letter-spacing: .1em; }
.pfs-suite-preview-head h2 { margin: 9px 0 0; font-size: 2rem; letter-spacing: -.04em; }
.pfs-app-mini { display: grid; grid-template-columns: 46px 1fr auto; gap: 14px; align-items: center; padding: 18px 28px; border-bottom: 1px solid var(--pf-line); }
.pfs-app-mini:last-child { border-bottom: 0; }
.pfs-app-icon { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 13px; font-weight: 950; color: white; background: linear-gradient(145deg,#2b3850,#172033); }
.pfs-app-mini strong, .pfs-app-mini small { display: block; }
.pfs-app-mini small { margin-top: 4px; color: #8794a7; }
.pfs-app-mini em { color: #91a0b5; font-size: .76rem; font-style: normal; font-weight: 850; }

.pfs-section { padding: 82px 0; border-top: 1px solid var(--pf-line); }
.pfs-section.is-muted { background: rgba(14,20,31,.68); }
.pfs-section-head { display: grid; grid-template-columns: minmax(0,1fr) minmax(290px,.55fr); gap: 44px; align-items: end; margin-bottom: 34px; }
.pfs-section-head h2 { margin: 8px 0 0; font-size: clamp(2.4rem,5vw,4.8rem); line-height: .98; letter-spacing: -.06em; }
.pfs-section-head p { margin: 0; color: var(--pf-muted); line-height: 1.7; }
.pfs-grid-3 { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.pfs-card {
  min-width: 0; padding: 26px; border: 1px solid var(--pf-line); border-radius: var(--pf-radius);
  background: linear-gradient(145deg,var(--pf-panel-2),var(--pf-panel)); box-shadow: 0 18px 48px rgba(0,0,0,.12);
}
.pfs-card h3 { margin: 20px 0 10px; font-size: 1.42rem; letter-spacing: -.035em; }
.pfs-card p { margin: 0; color: #9fabbd; line-height: 1.65; }
.pfs-card .pfs-badge { margin-top: 20px; }
.pfs-badge {
  display: inline-flex; min-height: 30px; align-items: center; padding: 0 10px;
  border: 1px solid rgba(139,220,242,.22); border-radius: 999px;
  color: #bfeef8; background: rgba(55,127,154,.11); font-size: .72rem; font-weight: 900; text-transform: uppercase; letter-spacing: .07em;
}
.pfs-badge.preview { color: #e1d2ff; border-color: rgba(173,140,255,.25); background: rgba(109,72,177,.12); }
.pfs-badge.locked { color: #ffd0d7; border-color: rgba(255,115,138,.28); background: rgba(142,40,58,.12); }
.pfs-badge.active { color: #bcf0cd; border-color: rgba(84,190,119,.3); background: rgba(37,128,67,.12); }

.pfs-pricing-card {
  display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 32px; align-items: center;
  padding: clamp(30px,5vw,58px); border: 1px solid rgba(173,140,255,.28); border-radius: 28px;
  background: radial-gradient(circle at 85% 25%,rgba(135,88,226,.18),transparent 24rem), linear-gradient(150deg,#151b2a,#0a101a);
}
.pfs-pricing-card h2 { margin: 10px 0 14px; font-size: clamp(2.6rem,5vw,5rem); line-height: .94; letter-spacing: -.065em; }
.pfs-pricing-card p { max-width: 720px; margin: 0; color: #aeb8c8; line-height: 1.7; }
.pfs-price-box { min-width: 250px; padding: 28px; border: 1px solid var(--pf-line); border-radius: 20px; background: rgba(4,8,14,.56); text-align: center; }
.pfs-price-box strong { display: block; font-size: 3.7rem; letter-spacing: -.07em; }
.pfs-price-box span { color: #8d9aaf; }

.pfs-account-shell { padding: 56px 0 90px; }
.pfs-account-grid { display: grid; grid-template-columns: minmax(320px,.75fr) minmax(0,1.25fr); gap: 22px; align-items: start; }
.pfs-stack { display: grid; gap: 22px; }
.pfs-panel { padding: 27px; border: 1px solid var(--pf-line); border-radius: 22px; background: linear-gradient(145deg,#111927,#0b111b); }
.pfs-panel h2 { margin: 0 0 10px; font-size: 1.55rem; letter-spacing: -.04em; }
.pfs-panel > p { margin: 0; color: #a5b0c0; line-height: 1.65; }
.pfs-profile { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.pfs-profile-person { display: flex; align-items: center; gap: 14px; }
.pfs-avatar { display: grid; width: 62px; height: 62px; place-items: center; border-radius: 17px; background: linear-gradient(145deg,#39285e,#1c2540); font-size: 1.2rem; font-weight: 950; }
.pfs-profile strong, .pfs-profile span { display: block; }
.pfs-profile span { margin-top: 5px; color: #8a98ab; }
.pfs-facts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-top: 22px; }
.pfs-fact { padding: 15px; border: 1px solid var(--pf-line); border-radius: 14px; background: rgba(5,9,16,.5); }
.pfs-fact span, .pfs-fact strong { display: block; }
.pfs-fact span { color: #7f8ca1; font-size: .68rem; font-weight: 900; text-transform: uppercase; letter-spacing: .09em; }
.pfs-fact strong { margin-top: 7px; }

.pfs-form { display: grid; gap: 16px; margin-top: 22px; }
.pfs-field { display: grid; gap: 7px; }
.pfs-field label { color: #dce4ef; font-size: .82rem; font-weight: 850; }
.pfs-field input {
  min-height: 50px; width: 100%; padding: 0 14px;
  border: 1px solid #2b3546; border-radius: 12px; color: white; background: #080d16;
}
.pfs-field input:focus { outline: 2px solid rgba(139,220,242,.35); border-color: var(--pf-cyan); }
.pfs-check { display: grid; grid-template-columns: 21px 1fr; gap: 10px; color: #b6c0ce; line-height: 1.5; }
.pfs-check input { width: 18px; height: 18px; margin-top: 3px; accent-color: var(--pf-violet); }
.pfs-status { display: none; padding: 13px 14px; border-radius: 12px; line-height: 1.5; }
.pfs-status.show { display: block; }
.pfs-status.error { color: #ffc2cb; border: 1px solid rgba(255,96,121,.28); background: rgba(145,35,54,.13); }
.pfs-status.success { color: #bceccc; border: 1px solid rgba(85,192,119,.28); background: rgba(35,128,67,.13); }
.pfs-status.info { color: #cbe8ef; border: 1px solid rgba(88,169,195,.28); background: rgba(37,104,128,.13); }

.pfs-license-list, .pfs-device-list, .pfs-session-list { display: grid; gap: 11px; margin-top: 18px; }
.pfs-license, .pfs-device, .pfs-session {
  display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 14px; align-items: center;
  padding: 16px; border: 1px solid var(--pf-line); border-radius: 15px; background: rgba(5,9,16,.48);
}
.pfs-license strong, .pfs-license span, .pfs-device strong, .pfs-device span, .pfs-session strong, .pfs-session span { display: block; }
.pfs-license span, .pfs-device span, .pfs-session span { margin-top: 5px; color: #8190a4; font-size: .82rem; }
.pfs-license-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.pfs-mini { min-height: 36px; padding: 0 11px; border: 1px solid var(--pf-line); border-radius: 10px; color: white; background: #111927; cursor: pointer; font-weight: 820; }
.pfs-mini.danger { color: #ffc1ca; border-color: rgba(255,102,126,.28); background: rgba(142,36,55,.12); }
.pfs-key { overflow-wrap: anywhere; color: #d9caff !important; font-family: ui-monospace,SFMono-Regular,Consolas,monospace; }

.pfs-footer { padding: 52px 0 28px; border-top: 1px solid var(--pf-line); background: #06090e; }
.pfs-footer-grid { display: grid; grid-template-columns: 1.4fr repeat(3,1fr); gap: 28px; }
.pfs-footer h3 { margin: 0 0 13px; font-size: .84rem; color: #8d9aae; text-transform: uppercase; letter-spacing: .09em; }
.pfs-footer a { display: block; margin-top: 9px; color: #c3ccd8; text-decoration: none; }
.pfs-footer p { max-width: 480px; color: #8491a4; line-height: 1.6; }
.pfs-footer-bottom { margin-top: 38px; padding-top: 20px; border-top: 1px solid var(--pf-line); color: #748196; font-size: .82rem; }

@media (max-width: 980px) {
  .pfs-hero-grid, .pfs-section-head, .pfs-pricing-card, .pfs-account-grid { grid-template-columns: 1fr; }
  .pfs-grid-3 { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .pfs-price-box { min-width: 0; text-align: left; }
}
@media (max-width: 720px) {
  .pfs-links { display: none; position: absolute; inset: 76px 20px auto; padding: 12px; border: 1px solid var(--pf-line); border-radius: 16px; background: #0b111a; box-shadow: var(--pf-shadow); }
  .pfs-links.is-open { display: grid; }
  .pfs-menu { display: block; }
  .pfs-hero { padding-top: 62px; }
  .pfs-hero h1 { font-size: clamp(3.1rem,17vw,5rem); }
  .pfs-grid-3, .pfs-footer-grid, .pfs-facts { grid-template-columns: 1fr; }
  .pfs-license, .pfs-device, .pfs-session { grid-template-columns: 1fr; }
}
