/* FansFlex v7.8: coordinate-matched reconstruction of the user's FIRST 512 x 1536 reference.
 * IMPORTANT: This is a real layout with semantic HTML and functional navigation.
 * Only illustration/photo elements use reference-derived assets. Never render the entire screenshot as the page.
 * Coordinate system: screenshot at 512 px corresponds to 1440 px desktop layout (scale 2.8125).
 */
.ffm-body{background:#f8f9fa!important}
.ffm-container{width:min(calc(100% - 140px),1300px)}
.ffm-header{background:#071522;height:80px}
.ffm-header-inner{gap:16px}
.ffm-logo{flex:0 0 188px}
.ffm-logo img{width:188px}
.ffm-nav{gap:clamp(9px,1.2vw,21px)}
.ffm-nav a{font-size:12px}
.ffm-button-gold{background:linear-gradient(180deg,#ffe9ad 0%,#e8c37e 45%,#c99548 96%);box-shadow:inset 0 1px 0 #fff8d3,0 5px 14px #b97e353b;border-color:#d5aa62}
.ffm-hero{min-height:565px}
.ffm-hero-layout{min-height:565px;padding-top:30px;padding-bottom:35px}
.ffm-hero-photo{background-position:calc(100% - 48px) 52%;background-size:auto 123%}
.ffm-hero-shade{background:linear-gradient(90deg,#07141fe9 0%,#071725dc 32%,#0b223071 50%,#0617230b 75%),linear-gradient(0deg,#06141fd6,transparent 43%)}
.ffm-hero-content{width:56%;min-width:550px}
.ffm-overline{font-size:11px;margin-bottom:18px;letter-spacing:.29em}
.ffm-hero h1{font-size:clamp(51px,5.1vw,73px);line-height:.96;letter-spacing:-.045em;margin-bottom:20px}
.ffm-hero p{max-width:590px;font-size:15px;line-height:1.43;margin-bottom:20px}
.ffm-hero .ffm-button{min-height:48px;padding:12px 23px}
.ffm-hero-stats{margin-top:41px}
.ffm-hero-stats>div{padding:0 22px;gap:11px}
.ffm-hero-stats ion-icon{font-size:35px}
.ffm-hero-stats strong{font-size:20px}
.ffm-hero-stats small{font-size:11px}
.ffm-hero-emblem{position:absolute;top:103px;right:52px;transform:none;display:block;width:154px;height:115px;object-fit:contain;filter:drop-shadow(0 4px 4px #0007)}
.ffm-hero-fee{position:absolute;right:7px;bottom:10px;transform:none;background:transparent;filter:drop-shadow(0 2px 7px #0006)}
.ffm-hero-fee img{width:306px;max-width:none;height:auto;mix-blend-mode:screen;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ffm-benefit-grid{min-height:183px;padding:27px 0 25px;align-items:center}
.ffm-benefit{padding:0 9px}
.ffm-benefit ion-icon{font-size:42px;margin-bottom:11px;filter:drop-shadow(0 1px 1px #ceb47d66)}
.ffm-benefit h2{font-size:15px;line-height:1.15;margin-bottom:7px}
.ffm-benefit p{font-size:11px;line-height:1.28}
.ffm-dashboard-showcase-inner{min-height:501px;grid-template-columns:39% 61%;align-items:center}
.ffm-showcase-copy{padding:30px 0 32px}
.ffm-showcase-copy h2{font-size:clamp(43px,3.7vw,54px);line-height:.99;margin-bottom:20px}
.ffm-checks{margin-bottom:22px}
.ffm-checks li{font-size:16px;line-height:1.44}
.ffm-checks li:before{font-size:19px;margin-right:10px}
.ffm-laptop-scene{height:100%;position:relative;display:flex;align-items:center;justify-content:center;margin:0 -73px 0 -30px;padding:0;perspective:none}
.ffm-laptop-illustration{display:block!important;max-width:none!important;width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 8px 9px #19283b29)}
.ffm-rank-layout{min-height:318px;grid-template-columns:31% 36% 33%}
.ffm-rank-logo{display:flex;align-items:center;justify-content:center;padding:0 16px;border-color:#a17c46;height:235px}
.ffm-rank-logo img{width:100%;max-width:400px;max-height:252px;object-fit:cover;object-position:center 45%;mix-blend-mode:lighten}
.ffm-rank-copy{padding:20px 30px}
.ffm-rank-copy h2{font:700 34px/1.04 FFOpen,Arial,sans-serif;margin-bottom:15px}
.ffm-rank-copy p{font-size:15px;line-height:1.4;max-width:410px}
.ffm-rank-card img{width:min(100%,390px);border-color:#b58e59}
.ffm-academy-layout{min-height:354px;padding-top:25px;padding-bottom:25px;grid-template-columns:28% 72%;gap:10px}
.ffm-academy-intro{padding-right:24px}
.ffm-academy h2{font-size:54px;line-height:.97;margin-bottom:13px}
.ffm-academy p{font-size:14px;line-height:1.35}
.ffm-academy-cards{gap:13px;padding-right:6px}
.ffm-academy-thumb{height:176px;border-radius:12px;box-shadow:0 4px 11px #67768355}
.ffm-academy-thumb img{width:100%;height:100%;object-fit:cover;object-position:center 36%;transform:none!important}
.ffm-academy-thumb .ffm-academy-play,.ffm-academy-thumb .ffm-academy-duration{display:none!important}
.ffm-academy-card strong{margin-top:10px;font-size:15px;line-height:1.14}
.ffm-academy-card small{margin-top:6px;font-size:11px}
.ffm-promotion-layout{min-height:293px;grid-template-columns:39% 35% 26%}
.ffm-promo-visual{height:293px}
.ffm-promo-copy h2{font-size:34px}
.ffm-promo-copy p{font-size:15px;line-height:1.38}
.ffm-promo-list ion-icon{font-size:30px}
.ffm-how{min-height:214px;padding:31px 0 33px}
.ffm-divider-title{margin-bottom:27px}
.ffm-divider-title h2{font-size:33px}
.ffm-step-icon{width:66px;height:66px}
.ffm-step strong span{font-size:14px}
.ffm-freedom{min-height:543px}
.ffm-freedom-picture{background-position:5% 48%;background-size:55% auto}
.ffm-freedom-shade{background:linear-gradient(90deg,transparent 0%,rgba(10,24,38,.05) 29%,rgba(8,21,33,.93) 51%,#071626 87%),linear-gradient(0deg,rgba(4,15,25,.45),transparent 75%)}
.ffm-freedom-content{padding:37px 0;width:52%}
.ffm-freedom h2{font-size:62px;line-height:.96;margin-bottom:17px}
.ffm-freedom p{font-size:16px}
.ffm-freedom-metrics{margin:32px 0 22px}
.ffm-stories{min-height:334px;padding:33px 0 22px}
.ffm-stories h2{font-family:FFOpen,Arial,sans-serif;font-size:34px;font-weight:900;letter-spacing:-.04em}
.ffm-stories-note{font-size:11px;margin-bottom:14px;color:#788492}
.ffm-story{min-height:148px;padding:15px;grid-template-columns:100px 1fr;box-shadow:0 3px 14px #d9e1e6}
.ffm-story img{width:92px;height:94px}
.ffm-story p{font-size:12px}
.ffm-story-controls{margin-top:19px}
.ffm-featured{min-height:110px;display:flex;align-items:center;padding:15px 0}
.ffm-featured .ffm-container{width:min(calc(100% - 140px),1300px)}
.ffm-featured strong{font-size:clamp(14px,1.72vw,24px)}
.ffm-final-cta{min-height:419px}
.ffm-final-image{background-position:center right;background-size:76% auto}
.ffm-final-shade{background:linear-gradient(90deg,#091b2de8,#202a3e94 50%,#091b2e0a 85%)}
.ffm-final-content h2{font-size:55px;max-width:840px;line-height:1.02}
.ffm-final-content p{font-size:16px}
.ffm-footer>.ffm-container{min-height:405px;display:flex;flex-direction:column;justify-content:space-between}
.ffm-footer-columns{padding-top:51px;padding-bottom:46px;gap:28px}
.ffm-footer-columns>div>strong{font-size:15px}
.ffm-footer-columns>div>a:not(:first-child){font-size:13px;margin:10px 0}
.ffm-footer-brand img{width:190px}
.ffm-footer-bottom{padding:20px 0 32px;min-height:86px}

/* Small desktop and tablet: use natural heights rather than clipping cards. */
@media(max-width:1199px){
  .ffm-container,.ffm-featured .ffm-container{width:min(calc(100% - 58px),1050px)}
  .ffm-hero,.ffm-hero-layout{min-height:540px}
  .ffm-hero-emblem{right:30px;width:115px;height:90px}
  .ffm-hero-fee img{width:225px}
  .ffm-benefit-grid{min-height:150px}
  .ffm-dashboard-showcase-inner{min-height:420px}
  .ffm-laptop-scene{margin-right:-22px;margin-left:-22px}
  .ffm-rank-layout{min-height:290px}
  .ffm-academy-layout{min-height:325px}
  .ffm-academy h2{font-size:40px}
  .ffm-academy-thumb{height:145px}
  .ffm-promotion-layout{min-height:260px}
  .ffm-promo-visual{height:260px}
  .ffm-how{min-height:185px}
  .ffm-freedom{min-height:485px}
  .ffm-freedom h2{font-size:48px}
  .ffm-stories{min-height:310px}
  .ffm-featured{min-height:80px}
  .ffm-final-cta{min-height:350px}
  .ffm-footer>.ffm-container{min-height:315px}
}
@media(max-width:860px){
  .ffm-hero-content{min-width:0;width:70%}
  .ffm-hero-photo{background-position:calc(100% + 10px) center}
  .ffm-dashboard-showcase-inner{grid-template-columns:1fr 1fr}
  .ffm-laptop-scene{margin-left:-22px}
  .ffm-academy-layout{grid-template-columns:30% 70%}
  .ffm-academy-thumb{height:105px}
  .ffm-academy-card strong{font-size:12px}
  .ffm-promo-copy h2{font-size:26px}
  .ffm-stories{min-height:0}
  .ffm-story{grid-template-columns:75px 1fr}
  .ffm-story img{width:68px;height:72px}
}
@media(max-width:680px){
  .ffm-container,.ffm-featured .ffm-container{width:min(calc(100% - 36px),560px)}
  .ffm-hero,.ffm-hero-layout{min-height:595px}
  .ffm-hero-content{width:100%}
  .ffm-hero-photo{background-position:right -60px top -5px;background-size:auto 100%;opacity:.8}
  .ffm-hero-shade{background:linear-gradient(0deg,#071522f5 2%,#0715229e 67%,#07152233),linear-gradient(90deg,#071522b0,#07152222)}
  .ffm-hero-emblem{display:none}
  .ffm-hero-fee{right:0;bottom:12px}
  .ffm-hero-fee img{width:145px}
  .ffm-benefit-grid{min-height:0;padding:18px 0;grid-template-columns:repeat(2,minmax(0,1fr))}
  .ffm-benefit ion-icon{font-size:28px;margin-bottom:5px}
  .ffm-dashboard-showcase-inner{display:flex;flex-direction:column;min-height:0}
  .ffm-laptop-scene{margin:0 -18px 0;min-height:0;width:calc(100% + 36px)}
  .ffm-laptop-illustration{width:100%}
  .ffm-rank-layout{min-height:0;display:grid;grid-template-columns:1fr;gap:0;padding:20px 0 30px}
  .ffm-rank-logo{height:130px;border-right:0;border-bottom:1px solid #b79d6999}
  .ffm-rank-logo img{max-height:118px;object-fit:contain}
  .ffm-rank-copy{padding:20px 0}
  .ffm-academy-layout{min-height:0;display:block;padding:35px 0}
  .ffm-academy-intro{padding-right:0;margin-bottom:22px}
  .ffm-academy h2{font-size:38px}
  .ffm-academy-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .ffm-academy-thumb{height:130px}
  .ffm-academy-card strong{font-size:13px}
  .ffm-promotion-layout{display:grid;grid-template-columns:1fr;min-height:0}
  .ffm-promo-visual{height:170px}
  .ffm-how{min-height:0}
  .ffm-freedom{min-height:650px}
  .ffm-freedom-content{width:100%;padding-top:275px}
  .ffm-freedom h2{font-size:39px}
  .ffm-stories{min-height:0}
  .ffm-story{grid-template-columns:75px 1fr}
  .ffm-featured{min-height:0}
  .ffm-featured .ffm-container{flex-wrap:wrap;justify-content:center}
  .ffm-final-cta{min-height:370px}
  .ffm-final-image{background-size:auto 100%}
  .ffm-final-content h2{font-size:31px}
  .ffm-footer>.ffm-container{min-height:0;display:block}
}
@media(min-width:1200px){.ffm-hero-emblem{right:-43px}.ffm-hero-fee{right:-47px}.ffm-laptop-scene{margin-left:-64px}}
.ffm-nav-login-mobile{display:none!important}
@media(max-width:860px){.ffm-nav.is-open .ffm-nav-login-mobile{display:block!important}}
@media(max-width:460px){.ffm-header-inner{gap:6px}.ffm-logo{flex-basis:132px}.ffm-logo img{width:130px}.ffm-header-actions .ffm-login{display:none!important}.ffm-header-actions{gap:3px}.ffm-menu-button{padding:5px 7px}}
/* Target hero portrait sits LEFT of the monogram/fee column, not underneath it. */
@media(min-width:1200px){
 .ffm-hero-photo{background-position:calc(100% - 240px) 52%;background-size:auto 123%;background-image:url('/images/fansflex-premium/landing-hero-model-v76.webp'),repeating-linear-gradient(90deg,transparent 0 67px,#b78a3e15 68px 70px,transparent 71px 85px),linear-gradient(90deg,#071622,#1c3342 55%,#241a17 83%,#110d10)}
}
.ffm-benefit .ffm-benefit-art{display:block;width:52px;height:52px;object-fit:contain;margin:0 auto 9px;filter:drop-shadow(0 1px 1px #b9935040)}
@media(min-width:1200px){
 .ffm-laptop-illustration{width:109%;transform:translateX(-43px)}
 .ffm-hero-fee img{mix-blend-mode:normal;mask-image:none;filter:drop-shadow(0 4px 7px #03060a99)}
}
@media(max-width:900px){.ffm-benefit .ffm-benefit-art{width:39px;height:39px}}
@media(max-width:680px){.ffm-benefit .ffm-benefit-art{width:30px;height:30px}}