/* FFWEB public website refresh 2026: shared navigation, banner and store badges. */
.fx-announcement { background:linear-gradient(104deg,#06427c 0%,#052e58 51%,#072344 100%); color:#fff; position:relative; z-index:899; }
.fx-announcement[hidden] { display:none!important; }
.fx-announcement-inner { width:100%; margin:0 auto; padding:9px clamp(14px,3.6vw,76px); display:flex; align-items:center; justify-content:space-between; gap:clamp(10px,2vw,28px); min-height:64px; }
.fx-announcement-label { display:inline-flex; align-items:center; gap:10px; flex:none; color:#fff; border-radius:10px; padding:12px 16px; background:linear-gradient(135deg,#1079ea,#129bff); font-weight:850; font-size:14px; }
.fx-announcement-label i {font-size:18px;}
.fx-announcement-copy { flex:1; display:flex; align-items:center; gap:18px; font-size:clamp(12px,1.1vw,17px); line-height:1.4; font-weight:650; }
.fx-announcement-copy i { font-size:23px; color:#e6f2ff; }
.fx-announcement-more { color:#0b2846; background:#fff; padding:13px 20px; border-radius:999px; white-space:nowrap; font-weight:850; font-size:13px; box-shadow:0 4px 18px #0002; }
.fx-announcement-more span { margin-left:8px; font-size:18px; }
.fx-announcement-dismiss { min-width:44px; min-height:44px; background:transparent; border:0; color:#c7dbf2; font:300 30px/1 system-ui; cursor:pointer; }
.fx-announcement-label:hover,.fx-announcement-more:hover {filter:brightness(1.05);}
.site-header {height:82px; background:rgba(255,255,255,.96);}
.site-header-inner {width:calc(100% - clamp(26px,7.2vw,160px)); max-width:none; gap:clamp(16px,2.5vw,40px);}
.site-logo img {height:59px; max-width:none;}
.site-nav { gap:clamp(0px,.5vw,12px); }
.site-nav a { font-size:clamp(12px,1vw,16px); padding:0 clamp(9px,1.05vw,19px); }
.site-actions {gap:clamp(7px,1vw,15px);}
.site-test-cta {min-height:48px; border-radius:999px; padding-inline:clamp(14px,1.4vw,26px);}
.site-header .theme-toggle { width:46px; height:46px; }
/* Both official store badges use the same visible frame height. Google PNG has transparent
   padding around its artwork, cropped only in the viewport; neither badge is distorted. */
.fx-store-badges {--fx-store-height:48px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 13px;}
.fx-store-badge {position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 auto;height:var(--fx-store-height);overflow:hidden;line-height:0;border-radius:6px;}
.fx-store-badge img {display:block;width:auto;max-width:none;object-fit:contain;border:0;}
.fx-apple-store img {height:var(--fx-store-height);}
.fx-google-play img {height:calc(var(--fx-store-height) * 1.35);margin:0;}
.fx-store-badge:focus-visible {outline:3px solid #ff941a;outline-offset:3px;}
.fx-bls-info-section {margin:22px auto 26px; padding:clamp(24px,4.2vw,48px); border-radius:20px; background:linear-gradient(124deg,#062b54 0%,#084b88 100%); color:#fff;}
.fx-bls-info-section > div {max-width:990px;}
.fx-bls-info-section span {color:#ffad48;font-size:12px;letter-spacing:.11em;font-weight:900;}
.fx-bls-info-section h2 {margin:11px 0;font-size:clamp(25px,3vw,43px);line-height:1.17;color:#fff;}
.fx-bls-info-section p {color:#d8e8f9;line-height:1.65;font-size:clamp(14px,1.2vw,17px);margin:12px 0 24px;}
.fx-bls-info-section .ff-btn {max-width:100%;white-space:normal;text-align:center;}
@media (max-width:1250px) { .site-header-inner {width:calc(100% - 44px);} .site-nav a {padding:0 9px;} .site-logo img {height:49px;} .fx-announcement-copy i {display:none;} }
@media (max-width:1100px) { .site-nav {display:none;} .menu-toggle {display:inline-flex;} .site-header-inner {width:calc(100% - 28px);} }
@media (max-width:980px) { .site-test-cta {display:inline-flex;} .site-logo img {height:44px;} .fx-announcement-label {padding:10px 13px;font-size:12px;} .fx-announcement-inner {min-height:56px;padding:7px 12px;gap:9px;} .fx-announcement-copy {font-size:12px;} .fx-announcement-more {padding:9px 13px;font-size:12px;} }
@media (max-width:600px) { .site-header {height:66px;} .site-logo img {height:36px;} .site-test-cta {display:none;} .fx-announcement-inner {align-items:center; flex-wrap:wrap;padding:8px 12px;gap:7px;}
 .fx-announcement-label {order:0;white-space:nowrap;padding:8px 10px;font-size:11px;}
 .fx-announcement-copy {order:3;flex:1 0 100%;font-size:11px;line-height:1.3;}
 .fx-announcement-more {order:1;margin-left:auto;padding:7px 10px;font-size:11px;}
 .fx-announcement-more span {font-size:13px;margin-left:2px;}
 .fx-announcement-dismiss {order:2;min-height:32px;min-width:32px;font-size:24px;}
 .fx-store-badges {--fx-store-height:42px;gap:10px 11px;}
}
/* Keep secondary landing pages fluid on wide desktops as well. */
@media (min-width:1200px){
 .ffw-container {max-width:none!important;padding-left:clamp(30px,4.5vw,90px)!important;padding-right:clamp(30px,4.5vw,90px)!important;}
 .demo-page,.prices-page {max-width:none!important;padding-left:clamp(30px,4.5vw,90px)!important;padding-right:clamp(30px,4.5vw,90px)!important;}
 .site-footer-inner {width:calc(100% - clamp(50px,8vw,180px));max-width:none;}
}
.fx-footer-stores {display:flex;justify-content:center;}
.fx-footer-stores .fx-store-badges {--fx-store-height:42px;}
@media (max-width:1200px){ .site-header .site-nav {display:none;} .site-header .menu-toggle {display:inline-flex;} .site-footer-inner {flex-wrap:wrap;} }
@media (max-width:600px){ .fx-footer-stores {width:100%;justify-content:flex-start;} }