:root{
  --nfx-bg:#000;
  --nfx-fg:#fff;
  --nfx-muted:rgba(255,255,255,.75);
  --nfx-muted2:rgba(255,255,255,.6);
  --nfx-red:#e50914;
  --nfx-red2:#f6121d;
  --nfx-line:rgba(255,255,255,.12);
  --nfx-card:#111;
  --nfx-card2:#0b0b0b;
  --nfx-radius:16px;
  --nfx-shadow:0 16px 48px rgba(0,0,0,.45);
  --nfx-max:1120px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--nfx-bg);
  color:var(--nfx-fg);
  font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  line-height:1.55;
}

a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}

.nfx-container{width:min(var(--nfx-max),calc(100% - 32px));margin:0 auto}
.nfx-muted{color:var(--nfx-muted2)}
.nfx-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:14px 18px;border-radius:6px;border:1px solid rgba(255,255,255,.16);
  background:#111;color:#fff;font-weight:600;cursor:pointer;
}
.nfx-btn:hover{border-color:rgba(255,255,255,.28)}
.nfx-btn--primary{background:var(--nfx-red);border-color:transparent}
.nfx-btn--primary:hover{background:var(--nfx-red2)}

/* Header */
.nfx-header{
  position:fixed;top:0;left:0;right:0;z-index:50;
  padding:18px 0;
  background:linear-gradient(to bottom, rgba(0,0,0,.75), rgba(0,0,0,0));
  transition:background .2s ease, backdrop-filter .2s ease;
}
.nfx-header.is-scrolled{
  background:rgba(0,0,0,.92);
  backdrop-filter: blur(8px);
}
.nfx-header__inner{
  width:min(var(--nfx-max),calc(100% - 32px));margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
}
.nfx-logo{
  font-weight:800;letter-spacing:.2px;
  color:var(--nfx-red);
  font-size:28px;
}
.nfx-header__right{display:flex;align-items:center;gap:14px}
.nfx-signin{
  background:var(--nfx-red);
  padding:8px 14px;border-radius:4px;font-weight:700;
}
.nfx-signin:hover{background:var(--nfx-red2)}

/* Language dropdown (visual only) */
.nfx-lang{position:relative}
.nfx-lang__btn{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;padding:8px 12px;border-radius:4px;
  cursor:pointer;
}
.nfx-lang__menu{
  display:none;position:absolute;right:0;top:44px;min-width:180px;
  background:rgba(0,0,0,.92);border:1px solid rgba(255,255,255,.15);
  border-radius:8px;overflow:hidden;
}
.nfx-lang:hover .nfx-lang__menu{display:block}
.nfx-lang__item{display:block;padding:10px 12px;color:#fff}
.nfx-lang__item:hover{background:rgba(255,255,255,.08)}
.nfx-lang__item.is-active{background:rgba(255,255,255,.12)}

/* Hero */
.nfx-hero{position:relative;min-height:92vh;display:flex;align-items:center;padding-top:84px}
.nfx-hero__bg{
  position:absolute;inset:0;
  background:
  url("../images/hero.png") center/cover no-repeat,
    radial-gradient(1200px 700px at 50% 0%, rgba(229,9,20,.20), transparent 60%),
    radial-gradient(900px 600px at 10% 30%, rgba(255,255,255,.08), transparent 55%),
    radial-gradient(900px 600px at 90% 35%, rgba(255,255,255,.06), transparent 55%),
    linear-gradient(to bottom, rgba(0,0,0,.40), rgba(0,0,0,.88)),
    linear-gradient(135deg, #1a1a1a, #000);
  filter:saturate(1.05);
}

.nfx-hero__overlay{position:absolute;inset:0;background:rgba(0,0,0,.28)}
.nfx-hero__content{position:relative;text-align:center;padding:70px 0}
.nfx-hero__title{
  font-size:clamp(2.2rem, 4vw, 3.6rem);
  line-height:1.05;margin:0 0 14px;
  font-weight:900;
}
.nfx-hero__sub{margin:0 0 10px;font-size:clamp(1rem, 1.4vw, 1.25rem);color:var(--nfx-muted)}
.nfx-hero__price{margin:0 0 22px;font-size:.95rem;color:rgba(255,255,255,.85)}
.nfx-hero__cta{max-width:760px;margin:0 auto}
.nfx-cta__label{margin:0 0 10px;color:rgba(255,255,255,.9);font-size:.95rem}
.nfx-form-wrap{max-width:740px;margin:0 auto}

/* Fluent Forms styling inside hero/footer */
.nfx-form-wrap form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.nfx-form-wrap input[type="email"],
.nfx-form-wrap input[type="text"],
.nfx-form-wrap input[type="tel"],
.nfx-form-wrap input[type="name"]{
  background:rgba(0,0,0,.55);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;padding:14px 14px;border-radius:6px;
  min-width:min(360px, 100%);
}
.nfx-form-wrap button,
.nfx-form-wrap input[type="submit"]{
  background:var(--nfx-red);border:0;color:#fff;
  padding:14px 20px;border-radius:6px;font-weight:800;
  cursor:pointer;
}
.nfx-form-wrap button:hover,
.nfx-form-wrap input[type="submit"]:hover{background:var(--nfx-red2)}

.nfx-value-strip{
  margin-top:26px;
  display:flex;gap:12px;justify-content:center;flex-wrap:wrap;
  color:rgba(255,255,255,.92);
}
.nfx-value{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.35);
  padding:10px 12px;border-radius:999px;
  font-size:.92rem;
}

.nfx-hero__curve{
  position:absolute;left:0;right:0;bottom:-1px;height:70px;
  background:radial-gradient(90% 110% at 50% 0%, rgba(229,9,20,.55), transparent 65%);
  mask-image: radial-gradient(90% 90% at 50% 0%, #000 55%, transparent 60%);
  opacity:.9;
}

/* Sections */
.nfx-section{padding:64px 0}
.nfx-section h2{margin:0 0 18px;font-size:1.6rem}

/* Row / slider */
.nfx-row__head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px}
.nfx-row__controls{display:flex;gap:10px}
.nfx-arrow{
  width:40px;height:40px;border-radius:10px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.35);
  color:#fff;font-size:22px;cursor:pointer;
}
.nfx-arrow:hover{border-color:rgba(255,255,255,.28);background:rgba(0,0,0,.55)}
.nfx-slider{
  display:flex;gap:14px;overflow:auto;padding:14px 2px 4px;
  scroll-snap-type:x mandatory;
}
.nfx-slider::-webkit-scrollbar{height:10px}
.nfx-slider::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:999px}
.nfx-poster{
  position:relative;flex:0 0 190px;height:270px;
  border-radius:18px;overflow:hidden;
  background:linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.10);
  scroll-snap-align:start;
  transform:translateZ(0);
  transition:transform .18s ease, border-color .18s ease;
}
.nfx-poster:hover{transform:scale(1.04);border-color:rgba(255,255,255,.22)}
.nfx-poster__img{
  position:absolute;inset:0;
  background:
    radial-gradient(380px 220px at 40% 30%, rgba(229,9,20,.25), transparent 60%),
    radial-gradient(260px 200px at 70% 60%, rgba(255,255,255,.10), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,.75));
}
.nfx-poster__rank{
  position:absolute;left:10px;bottom:8px;
  font-weight:900;font-size:78px;line-height:1;
  color:rgba(255,255,255,.08);
  text-shadow:0 0 18px rgba(0,0,0,.55);
}
.nfx-poster__shine{
  position:absolute;inset:-20%;
  background:linear-gradient(135deg, transparent, rgba(255,255,255,.08), transparent);
  transform:translateX(-40%) rotate(15deg);
  opacity:.0;
}
.nfx-poster:hover .nfx-poster__shine{opacity:1;animation:nfxshine 1.2s ease}
@keyframes nfxshine{
  from{transform:translateX(-40%) rotate(15deg)}
  to{transform:translateX(40%) rotate(15deg)}
}

/* Cards */
.nfx-cards{
  display:grid;grid-template-columns:repeat(4,1fr);gap:14px;
}
.nfx-card{
  position:relative;
  background:linear-gradient(180deg, rgba(60,60,120,.25), rgba(0,0,0,.15));
  border:1px solid rgba(255,255,255,.10);
  border-radius:18px;padding:18px;
  min-height:170px;
}
.nfx-card h3{margin:0 0 8px}
.nfx-card p{margin:0;color:rgba(255,255,255,.72)}
.nfx-card__icon{
  position:absolute;right:16px;bottom:14px;
  font-size:26px;opacity:.85;
}

/* Devices */
.nfx-device-icons{display:flex;gap:10px;flex-wrap:wrap}
.nfx-device{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.35);
  padding:10px 12px;border-radius:999px;
}

/* FAQ */
.nfx-accordion{margin-top:16px;display:grid;gap:10px}
.nfx-acc-btn{
  width:100%;
  display:flex;align-items:center;justify-content:space-between;
  text-align:left;
  padding:18px 18px;
  background:#2a2a2a;
  border:1px solid rgba(255,255,255,.08);
  color:#fff;font-size:1rem;border-radius:10px;
  cursor:pointer;
}
.nfx-acc-btn:hover{background:#313131}
.nfx-plus{font-size:28px;line-height:1;font-weight:300;transition:transform .15s ease}
.nfx-acc-panel{
  display:none;
  padding:16px 18px;
  background:#1f1f1f;
  border:1px solid rgba(255,255,255,.08);
  border-top:0;border-radius:0 0 10px 10px;
  margin-top:-10px;
}
.nfx-acc-panel p{margin:0;color:rgba(255,255,255,.78)}
.nfx-acc-btn.is-open{border-radius:10px 10px 0 0}
.nfx-acc-btn.is-open .nfx-plus{transform:rotate(45deg)}

/* Bottom CTA */
.nfx-bottom-cta{margin-top:40px;text-align:center}

/* Pricing */
.nfx-pricing-hero{padding:120px 0 70px}
.nfx-pricing-title{margin:0 0 10px;font-size:clamp(2rem, 3.2vw, 3rem);font-weight:900}
.nfx-pricing-sub{margin:0 0 22px;color:rgba(255,255,255,.72)}
.nfx-checklist{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.nfx-check{border:1px solid rgba(255,255,255,.12);padding:10px 12px;border-radius:999px;background:rgba(0,0,0,.35);font-size:.92rem}

.nfx-billing-toggle{display:inline-flex;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:999px;overflow:hidden;margin:10px 0 26px}
.nfx-toggle-btn{background:transparent;border:0;color:#fff;padding:10px 14px;cursor:pointer;font-weight:700}
.nfx-toggle-btn.is-active{background:rgba(229,9,20,.25)}
.nfx-save{color:rgba(255,255,255,.85);font-weight:800}

.nfx-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:8px}
.nfx-plan{
  background:rgba(0,0,0,.35);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;padding:18px;
  min-height:260px;
  position:relative;
}
.nfx-plan h2{margin:0 0 8px}
.nfx-price{font-size:1.15rem;font-weight:900;margin-bottom:10px}
.nfx-plan ul{margin:0 0 14px;padding-left:18px;color:rgba(255,255,255,.75)}
.nfx-plan--popular{border-color:rgba(229,9,20,.55);box-shadow:0 0 0 1px rgba(229,9,20,.25), var(--nfx-shadow)}
.nfx-badge{
  position:absolute;top:14px;right:14px;
  background:rgba(229,9,20,.85);padding:6px 10px;border-radius:999px;
  font-weight:900;font-size:.85rem;
}
.nfx-compare{margin-top:42px}
.nfx-table-wrap{overflow:auto;border-radius:14px;border:1px solid rgba(255,255,255,.10)}
.nfx-table{width:100%;border-collapse:collapse;min-width:720px;background:rgba(0,0,0,.35)}
.nfx-table th,.nfx-table td{padding:14px;border-bottom:1px solid rgba(255,255,255,.08)}
.nfx-table th{text-align:left;color:rgba(255,255,255,.85);background:rgba(255,255,255,.03)}
.nfx-table td{text-align:center;color:rgba(255,255,255,.78)}
.nfx-table td:first-child{text-align:left}

.nfx-payments{margin-top:26px}
.nfx-pay-icons{display:flex;gap:10px;flex-wrap:wrap}
.nfx-pay-icons span{border:1px solid rgba(255,255,255,.12);padding:8px 10px;border-radius:999px;background:rgba(0,0,0,.35)}

/* Footer */
.nfx-footer{padding:60px 0;background:#000;border-top:1px solid rgba(255,255,255,.08)}
.nfx-footer__top{margin:0 0 18px;color:rgba(255,255,255,.65)}
.nfx-footer__grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:10px 24px;
  margin-bottom:24px;
}
.nfx-footer__grid a{color:rgba(255,255,255,.65);text-decoration:underline;text-underline-offset:2px}
.nfx-footer__grid a:hover{color:#fff}
.nfx-footer__bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.nfx-footer__copy{margin:0;color:rgba(255,255,255,.55)}

/* Generic page */
.nfx-page{padding:120px 0 70px}
.nfx-title{margin:0 0 16px}
.nfx-content{color:rgba(255,255,255,.80)}

/* Responsive */
@media (max-width: 980px){
  .nfx-cards{grid-template-columns:repeat(2,1fr)}
  .nfx-plans{grid-template-columns:1fr}
  .nfx-footer__grid{grid-template-columns:repeat(2,1fr)}
  .nfx-hero{min-height:88vh}
}
@media (max-width: 520px){
  .nfx-logo{font-size:22px}
  .nfx-lang{display:none}
  .nfx-form-wrap form{gap:10px}
}
