@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Manrope:wght@400;500;600;700;800&display=swap');

.ff-wellbeing-shell { width: min(100%, 960px); margin: 0 auto; padding: 14px 16px 42px; color: #eff8fa; font-family: Manrope, sans-serif; }
.ff-wellbeing-nav { border-color: rgba(85, 215, 233, .24) !important; background: rgba(4, 20, 30, .96) !important; }
.ff-wellbeing-nav > div:nth-child(2) { font-family: "Bebas Neue", Impact, sans-serif; font-size: 1.75rem !important; letter-spacing: .04em; }
.ff-wellbeing { display: grid; gap: 13px; }
.ff-wellbeing__intro > p { margin: 0 0 11px; color: #7ee3f0; font-size: .7rem; font-weight: 800; letter-spacing: .22em; text-align: center; text-transform: uppercase; }
.ff-wellbeing__intro > p span { margin: 0 8px; }
.ff-wellbeing__hero { isolation: isolate; position: relative; overflow: hidden; min-height: 224px; padding: 20px; border: 1px solid #16bcd0; border-radius: 15px; background: linear-gradient(100deg, rgba(1, 14, 26, .98) 0%, rgba(4, 24, 39, .82) 50%, rgba(220, 113, 40, .25)), radial-gradient(circle at 75% 45%, #f2ad4f 0, #975134 15%, #0b2130 45%, #06131d 74%); }
.ff-wellbeing__hero:after { position: absolute; inset: 0; z-index: -1; content: ""; opacity: .38; background: repeating-linear-gradient(90deg, transparent 0 47px, rgba(108, 220, 235, .16) 48px 50px), linear-gradient(20deg, transparent 52%, rgba(120, 220, 235, .24) 52.5% 53.5%, transparent 54%); }
.ff-wellbeing__hero-copy { position: relative; z-index: 2; width: min(60%, 420px); }
.ff-wellbeing__hero h1, .ff-wellbeing h2 { margin: 0; font-family: "Bebas Neue", Impact, sans-serif; font-weight: 400; letter-spacing: .035em; text-transform: uppercase; }
.ff-wellbeing__hero h1 { font-size: clamp(2.15rem, 7.4vw, 4.7rem); line-height: .82; }
.ff-wellbeing__hero h1 span { color: #09d8ef; }
.ff-wellbeing__hero-copy p { margin: 14px 0 0; font-size: clamp(.68rem, 1.7vw, .94rem); font-weight: 800; letter-spacing: .08em; line-height: 1.35; text-transform: uppercase; }
.ff-wellbeing__hero em { position: absolute; right: 16px; bottom: 22px; max-width: 33%; color: #25e5ee; font-size: clamp(.85rem, 2.2vw, 1.5rem); font-weight: 700; line-height: .9; text-align: right; text-transform: uppercase; transform: rotate(-8deg); }
.ff-wellbeing__site-scene { position: absolute; right: 20%; bottom: 0; width: 125px; height: 175px; border-radius: 70px 70px 10px 10px; background: linear-gradient(#072031 0 25%, #1a5260 26% 42%, #4cc356 43% 69%, #0a1a20 70%); box-shadow: 0 0 0 8px rgba(3, 15, 23, .55); }
.ff-wellbeing__site-scene:before { position: absolute; top: 13px; left: 25px; width: 76px; height: 36px; border-radius: 50% 50% 8px 8px; content: ""; background: #d5d9d4; box-shadow: inset 0 -7px #83969a; }
.ff-wellbeing__site-scene i { position: absolute; width: 2px; height: 220px; background: rgba(9, 16, 24, .7); transform-origin: bottom; }.ff-wellbeing__site-scene i:nth-child(1){left:-70px;bottom:0;transform:rotate(26deg)}.ff-wellbeing__site-scene i:nth-child(2){right:-45px;bottom:0;transform:rotate(-13deg)}.ff-wellbeing__site-scene i:nth-child(3){right:-70px;bottom:0;transform:rotate(-28deg)}
.ff-wellbeing-actions { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.ff-wellbeing-action { min-height: 145px; padding: 15px 9px 12px; border: 1px solid #20c9df; border-radius: 14px; color: #fff; text-align: center; text-decoration: none; background: rgba(8, 40, 53, .86); transition: transform .18s ease, filter .18s ease; }.ff-wellbeing-action:hover,.ff-wellbeing-action:focus-visible { color:#fff; filter:brightness(1.15); transform:translateY(-3px) }.ff-wellbeing-action.chat{background:linear-gradient(140deg,#079053,#006b43)}.ff-wellbeing-action.crisis{background:linear-gradient(140deg,#1167c2,#073a8f)}.ff-wellbeing-action.resources{background:linear-gradient(140deg,#0c8990,#06606e)}.ff-wellbeing-action.peer{background:linear-gradient(140deg,#6744cf,#3f238b)}
.ff-wellbeing-action b { display:block; min-height:42px; font-size:1.7rem; letter-spacing:-.22em; line-height:1; }.ff-wellbeing-action strong { display:block; font-family:"Bebas Neue",Impact,sans-serif; font-size:1.45rem; font-weight:400; letter-spacing:.04em; }.ff-wellbeing-action span { display:block; margin-top:5px; font-size:.7rem; font-weight:600; line-height:1.25; }
.ff-wellbeing-feedback { margin: 0; padding: 10px 14px; border: 1px solid rgba(94, 224, 237, .5); border-radius: 10px; color: #b8f6fb; background: rgba(20, 153, 171, .15); font-size: .82rem; }
.ff-wellbeing-panel,.ff-wellbeing-list { padding:13px 10px 10px; border:1px solid rgba(34, 201, 220, .45); border-radius:14px; background:rgba(5, 29, 41, .86); }.ff-wellbeing-section-head { display:flex; align-items:center; gap:12px; padding:0 4px 10px; }.ff-wellbeing-heart { color:#16d9ee; font-size:3rem; line-height:.7; }.ff-wellbeing-section-head div { flex:1; }.ff-wellbeing-section-head h2,.ff-wellbeing-matter h2,.ff-wellbeing-list h2 { font-size:1.38rem; line-height:1; }.ff-wellbeing-section-head p,.ff-wellbeing-matter p { margin:4px 0 0; color:#bfced5; font-size:.72rem; }.ff-wellbeing-section-head button,.ff-wellbeing-list > div button { border:0; color:#09d8ef; background:transparent; font-weight:800; font-size:.74rem; }
.ff-wellbeing-areas { display:grid; grid-template-columns:repeat(4, 1fr); gap:9px; }.ff-wellbeing-area { min-height:133px; padding:10px 8px; overflow:hidden; position:relative; border:1px solid rgba(31, 201, 222, .72); border-radius:9px; color:#fff; text-align:center; background:linear-gradient(145deg,rgba(15,84,92,.45),rgba(3,13,23,.88)); }.ff-wellbeing-area:before { position:absolute; inset:0; content:""; opacity:.35; background:linear-gradient(135deg,transparent,rgba(124,200,209,.38)); }.ff-wellbeing-area:hover,.ff-wellbeing-area:focus-visible { border-color:#68edf9; background-color:#123e4e; }.ff-wellbeing-area>* { position:relative; z-index:1; display:block; }.ff-wellbeing-area__mark { height:39px; color:#f6f7f4; font-size:2rem; font-weight:800; line-height:1; }.ff-wellbeing-area strong { font-family:"Bebas Neue",Impact,sans-serif; font-size:1.2rem; font-weight:400; letter-spacing:.025em; line-height:1; }.ff-wellbeing-area span:last-child { margin-top:5px; font-size:.65rem; font-weight:600; line-height:1.2; }
.ff-wellbeing-matter { display:grid; grid-template-columns:auto 1fr minmax(165px, .7fr); align-items:center; gap:16px; padding:14px; border:1px solid #19cbe2; border-radius:13px; background:linear-gradient(90deg,rgba(7,51,66,.85),rgba(5,25,36,.9)); }.ff-wellbeing-matter>span { color:#16d9ee; font-size:3rem; }.ff-wellbeing-matter blockquote { margin:0; padding:10px 14px; border:1px solid rgba(78, 215, 230, .4); border-radius:8px; color:#d7e9ed; font-size:.72rem; line-height:1.4; }
.ff-wellbeing-crisis { padding:15px; border:1px solid #ed6170; border-radius:13px; background:linear-gradient(110deg,rgba(64,14,27,.92),rgba(32,14,30,.92)); }.ff-wellbeing-crisis h2 { color:#ff7a82; font-size:1.55rem; }.ff-wellbeing-crisis h2 span { display:inline-grid; width:23px; height:23px; margin-right:9px; place-items:center; border-radius:50%; color:#3a0a14; font-family:Manrope,sans-serif; font-size:.8rem; background:#ff737c; vertical-align:2px; }.ff-wellbeing-crisis__numbers { display:grid; grid-template-columns:repeat(3, 1fr) 1.25fr; gap:9px; margin-top:13px; }.ff-wellbeing-crisis a { padding-right:8px; border-right:1px solid rgba(255,255,255,.22); color:#fff; text-decoration:none; }.ff-wellbeing-crisis a strong,.ff-wellbeing-crisis a span { display:block; }.ff-wellbeing-crisis a strong { font-family:"Bebas Neue",Impact,sans-serif; font-size:1.35rem; font-weight:400; letter-spacing:.04em; }.ff-wellbeing-crisis a span { font-size:.64rem; line-height:1.22; }.ff-wellbeing-crisis__numbers p { align-self:center; margin:0; padding:8px; border:1px solid rgba(247,104,117,.55); border-radius:8px; color:#ff9aa0; font-size:.72rem; text-align:center; }
.ff-wellbeing-lists { display:grid; grid-template-columns:1fr 1fr; gap:11px; }.ff-wellbeing-list>div { display:flex; align-items:center; justify-content:space-between; padding:0 4px 8px; border-bottom:1px solid rgba(132, 202, 211, .23); }.ff-wellbeing-list>div h2 { font-size:1.2rem; }.ff-wellbeing-list>a,.ff-wellbeing-list>button { display:grid; grid-template-columns:1fr auto; width:100%; padding:10px 5px; border:0; border-bottom:1px solid rgba(132, 202, 211, .17); color:#fff; text-align:left; text-decoration:none; background:transparent; }.ff-wellbeing-list strong { font-size:.73rem; }.ff-wellbeing-list span { grid-column:1; margin-top:2px; color:#a4bdc5; font-size:.63rem; }.ff-wellbeing-list b { grid-column:2; grid-row:1 / span 2; align-self:center; color:#11d8ed; font-size:.64rem; }.ff-wellbeing-list>button:after { align-self:center; content:"›"; color:#13d8ee; font-size:1.7rem; }
@media (max-width: 620px) { .ff-wellbeing-shell{padding:12px 9px 38px}.ff-wellbeing__hero{min-height:178px;padding:16px}.ff-wellbeing__hero-copy{width:67%}.ff-wellbeing__site-scene{right:22%;width:84px;height:125px}.ff-wellbeing__hero em{right:11px;bottom:12px}.ff-wellbeing-actions{grid-template-columns:1fr 1fr}.ff-wellbeing-action{min-height:118px}.ff-wellbeing-areas{grid-template-columns:repeat(2,1fr)}.ff-wellbeing-area{min-height:120px}.ff-wellbeing-matter{grid-template-columns:auto 1fr}.ff-wellbeing-matter blockquote{grid-column:1 / -1}.ff-wellbeing-crisis__numbers{grid-template-columns:repeat(3,1fr)}.ff-wellbeing-crisis__numbers p{grid-column:1/-1}.ff-wellbeing-lists{grid-template-columns:1fr}.ff-wellbeing-nav>div:nth-child(2){font-size:1.35rem!important} }

body.ff-wellbeing-chat-open { overflow: hidden; }
.ff-wellbeing-chat[hidden] { display: none; }
.ff-wellbeing-chat { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 18px; }
.ff-wellbeing-chat__backdrop { position: absolute; inset: 0; background: rgba(0, 9, 16, .78); backdrop-filter: blur(5px); }
.ff-wellbeing-chat__panel { position: relative; width: min(100%, 540px); max-height: min(720px, calc(100dvh - 36px)); display: flex; overflow: hidden; border: 1px solid #20c9df; border-radius: 18px; color: #eff8fa; background: #061923; box-shadow: 0 24px 70px rgba(0, 0, 0, .48); flex-direction: column; }
.ff-wellbeing-chat__panel header { display: flex; align-items: center; justify-content: space-between; padding: 15px 17px; border-bottom: 1px solid rgba(66, 213, 230, .24); background: linear-gradient(115deg, #073d4c, #081d2a); }.ff-wellbeing-chat__panel header>div { display: flex; align-items: center; gap: 10px; }.ff-wellbeing-chat__panel header>div>span { display: grid; width: 37px; height: 37px; border: 1px solid rgba(79, 231, 197, .5); border-radius: 50%; color: #d8ffed; background: #087352; font-size: .74rem; letter-spacing: -.16em; place-items: center; }.ff-wellbeing-chat__panel h2 { margin: 0; font-family: "Bebas Neue", Impact, sans-serif; font-size: 1.6rem; font-weight: 400; letter-spacing: .04em; }.ff-wellbeing-chat__panel header p { margin: 1px 0 0; color: #9cc9d2; font-size: .69rem; }.ff-wellbeing-chat__panel header button { width: 34px; height: 34px; border: 1px solid rgba(115, 224, 237, .32); border-radius: 50%; color: #cdeff3; background: transparent; font-size: 1.55rem; line-height: 1; }
.ff-wellbeing-chat__messages { display: flex; min-height: 185px; padding: 16px; overflow-y: auto; gap: 9px; background: linear-gradient(rgba(9, 39, 50, .58), rgba(4, 22, 31, .85)); flex: 1; flex-direction: column; }.ff-wellbeing-chat__message { max-width: 88%; margin: 0; padding: 10px 12px; border-radius: 13px; font-size: .82rem; line-height: 1.48; }.ff-wellbeing-chat__message.bot { align-self: flex-start; border: 1px solid rgba(91, 212, 225, .2); background: #102c38; }.ff-wellbeing-chat__message.user { align-self: flex-end; color: #071920; background: #69dce8; }
.ff-wellbeing-chat__quick-links { display: flex; padding: 12px 15px 4px; gap: 7px; flex-wrap: wrap; }.ff-wellbeing-chat__quick-links button { border: 1px solid rgba(59, 213, 227, .42); border-radius: 999px; color: #bff9ff; background: rgba(20, 165, 180, .12); font-size: .7rem; font-weight: 700; padding: 7px 10px; }.ff-wellbeing-chat__quick-links button:hover,.ff-wellbeing-chat__quick-links button:focus-visible { background: rgba(20, 165, 180, .32); }
.ff-wellbeing-chat__form { display: flex; padding: 11px 15px; gap: 8px; }.ff-wellbeing-chat__form input { min-width: 0; flex: 1; border: 1px solid rgba(67, 203, 220, .34); border-radius: 10px; outline: none; color: #eff8fa; background: #07161f; font: inherit; font-size: .8rem; padding: 10px 11px; }.ff-wellbeing-chat__form input:focus { border-color: #50e6f4; box-shadow: 0 0 0 3px rgba(57, 210, 227, .15); }.ff-wellbeing-chat__form button { border: 0; border-radius: 10px; color: #03222a; background: #55dcea; font: inherit; font-size: .76rem; font-weight: 800; padding: 0 15px; }
.ff-wellbeing-chat__notice { margin: 0; padding: 0 15px 14px; color: #9cb8c0; font-size: .66rem; line-height: 1.45; }.ff-wellbeing-chat__notice a { color: #68e4ef; font-weight: 800; }
@media (max-width: 420px) { .ff-wellbeing-chat { padding: 10px; }.ff-wellbeing-chat__panel { max-height: calc(100dvh - 20px); border-radius: 14px; }.ff-wellbeing-chat__messages { min-height: 170px; }.ff-wellbeing-chat__quick-links { padding-inline: 12px; }.ff-wellbeing-chat__form { padding-inline: 12px; } }
