.bf-page,.bf-page *,.bf-page *::before,.bf-page *::after{box-sizing:border-box}.bf-page{font:16px/1.5 "BF Inter",Inter,Arial,sans-serif}body.ai-boyfriend-page .bf-page button{font:inherit!important;cursor:pointer!important}.bf-page a{color:inherit;text-decoration:none}body.ai-boyfriend-page .bf-page a:focus-visible,body.ai-boyfriend-page .bf-page button:focus-visible{outline:3px solid #7540df!important;outline-offset:4px!important}.bf-page .wrap,.bf-page.wrap{width:min(1220px,calc(100% - 80px));margin-inline:auto}body.ai-boyfriend-page{background:#fcfbfe}.bf-page .skip{position:absolute;left:-9999px}.bf-page .skip:focus{left:12px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,24px);opacity:0;pointer-events:none;transition:.2s;z-index:50;max-width:calc(100% - 32px);padding:14px 22px;border:1px solid #EDE6FC;border-radius:12px;background:white;color:#190952;box-shadow:0 8px 24px #7345b61a}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:1101px){.bf-page .wrap,.bf-page.wrap{width:min(1120px,calc(100% - 80px))}}@media(max-width:1100px){.bf-page .wrap,.bf-page.wrap{width:calc(100% - 48px)}}@media(max-width:640px){.bf-page .wrap,.bf-page.wrap{width:calc(100% - 36px)}}@media(prefers-reduced-motion:reduce){.bf-page *,.bf-page *::before,.bf-page *::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
:root{
 --color-bg:#FCFBFE;--color-surface:#FFFFFF;--color-text:#190952;--color-text-2:#67618F;--color-text-muted:#89839F;
 --color-brand:#7533FF;--color-brand-end:#633CFD;--color-brand-subtle:#E4D7FD;--color-incoming:#EAE9F5;--color-border:#EDE6FC;--color-success:#39C985;
 --color-action:#7533FF;--color-action-hover:#633CFD;--color-on-action:#FFF;
 --shadow-sm:0 5px 18px #7345b60a;--shadow-md:0 10px 32px #7345b610;
}

/* Approved Figma 10:13 — 1540px canvas, 1220px shared content bounds. */

.bf-page{max-width:1540px;margin:auto;color:var(--color-text);isolation:isolate}.bf-page h1,.bf-page h2,.bf-page h3,.bf-page p,.bf-page figure{margin:0}.bf-page h1,.bf-page h2,.bf-page h3{font-weight:700}.bf-page b{font-weight:inherit}.bf-page h2{font-size:48px;line-height:1.15;letter-spacing:-1.4px}.bf-page p{color:var(--color-text-2)}.bf-page img{display:block;max-width:100%}body.ai-boyfriend-page .bf-page button{color:inherit!important}.bf-page .section,.bf-page .closing{margin-top:96px}.btn{display:inline-flex;align-items:center;justify-content:center;position:relative;width:386px;max-width:100%;height:62px;padding:12px 44px 12px 22px;border:0;border-radius:14px;background:#7540DF;box-shadow:0 7px 18px rgba(137,90,255,.145);color:white!important;font-size:20px;font-weight:700;line-height:1.3;transition:box-shadow .2s,filter .2s}.btn::after{content:"";position:absolute;right:26px;top:calc(50% - 5px);width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}.btn:hover{filter:brightness(.96);box-shadow:0 8px 24px #7533ff26}.center{text-align:center}.section-head{text-align:center}.section-head p{font-size:22px;line-height:1.3;margin:16px auto 0;max-width:1100px}
#characters{height:1760px}#characters .section-head{height:160px}#characters .section-head p{max-width:1140px;font-size:22px;line-height:1.3;margin-top:12px}.character-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 79px}.character-card{height:720px;min-width:0;border:1px solid var(--color-border);border-radius:12px;overflow:hidden;background:white;box-shadow:0 4px 14px #7345b60a}.card-image{aspect-ratio:3/4;overflow:hidden}.card-image img{width:100%;height:100%;object-fit:cover;object-position:center}.card-content{padding:24px;min-height:246px}.card-title{margin-bottom:12px}.card-title h3{font-size:28px;line-height:1.2;letter-spacing:-.7px}.card-content p{font-size:18px;line-height:1.4}#characters .center{margin-top:36px}
.conversation-section{height:1110px;position:relative}.conversation-section::before{content:"";position:absolute;z-index:-1;inset:140px 15% 40px;background:radial-gradient(ellipse,#f4e8fc85,transparent 72%);pointer-events:none}#conversation .section-head{height:232px;padding-top:16px}#conversation .section-head h2{font-size:48px;line-height:1.15}#conversation .section-head p{max-width:1100px;font-size:24px;line-height:1.25;margin-top:16px}.conversation-demo{display:grid;grid-template-columns:minmax(0,640fr) minmax(0,460fr);gap:120px;min-height:744px}.character-picker{min-width:0}.selected-portrait{width:100%;aspect-ratio:1;overflow:hidden;position:relative;border-radius:12px 12px 0 0}.selected-portrait img{width:100%;height:auto;max-width:none;object-fit:contain;object-position:center top}.selected-portrait::after{content:"";position:absolute;inset:80% 0 0;pointer-events:none;background:linear-gradient(180deg,#fcfbfe00 0%,#fcfbfe2e 38%,#fcfbfe 100%)}.character-switcher{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px;filter:drop-shadow(0 14px 14px #c4a0f147)}body.ai-boyfriend-page .person-option{--progress:0;position:relative!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;height:72px!important;min-width:0!important;padding:8px 12px!important;border:1.2px solid transparent!important;border-radius:40px!important;background:white!important;font-size:18px!important;line-height:1!important;color:var(--color-text-2)!important;isolation:isolate!important}body.ai-boyfriend-page .person-option img{width:52px!important;height:52px!important;border-radius:50%!important;object-fit:cover!important;object-position:50% 20%!important;flex-shrink:0!important}body.ai-boyfriend-page .person-option.active{background:transparent!important;border-color:var(--color-border)!important;color:var(--color-brand)!important}body.ai-boyfriend-page .person-option.active::after{content:""!important;position:absolute!important;inset:-1.2px!important;pointer-events:none!important;border-radius:inherit!important;background:none center/100% 100% no-repeat!important;clip-path:inset(0 calc(100% - var(--progress)*100%) 0 0)!important}.conversation-preview{min-width:0}.chat-window{height:650px;display:flex;flex-direction:column;position:relative;border:1px solid var(--color-border);border-radius:28px;background:white;box-shadow:0 5px 16px #7345b607}.chat-top{height:108px;flex-shrink:0;display:flex;align-items:center;gap:20px;padding:28px 30px;border:0;position:relative}.chat-top>img{width:58px;height:58px;object-fit:cover;object-position:center 20%;border-radius:50%}.chat-top strong{font-size:24px;line-height:1.2}.chat-top div>span{display:block;font-size:14px;color:var(--color-text-muted);margin-top:8px;line-height:1.2}.dot{display:inline-block;background:var(--color-success);width:8px;height:8px;border-radius:50%;margin-right:6px}body.ai-boyfriend-page .chat-options{margin-left:auto!important;display:grid!important;place-items:center!important;width:28px!important;height:36px!important;padding:0!important;border:0!important;background:transparent!important;color:#7661A4!important}body.ai-boyfriend-page .chat-options svg{width:20px!important;height:20px!important;fill:currentColor!important}.chat-preview-label{display:none}.messages{display:flex;flex-direction:column;gap:18px;flex:1;min-height:0;padding:0 30px 20px;overflow:auto;scrollbar-width:thin}.bubble{flex-shrink:0;align-self:flex-start;position:relative;max-width:100%;width:370px;padding:16px 26px;border-radius:28px;background:var(--color-incoming);font-size:17.6px;line-height:25px;color:var(--color-text);overflow:visible;overflow-wrap:break-word}.bubble.user{align-self:flex-end;width:340px;background:var(--color-brand-subtle)}.bubble:nth-child(2){width:fit-content;min-width:140px}.bubble::after{content:"";position:absolute;left:-7px;bottom:0;width:18px;height:16px;background:inherit;clip-path:polygon(100% 0,100% 100%,0 100%,35% 75%,65% 30%)}.bubble.user::after{left:auto;right:-7px;transform:scaleX(-1)}.chat-bottom{flex-shrink:0;margin:0 18px 18px}.preview-composer{height:62px;border:1px solid var(--color-border);border-radius:32px;display:flex;align-items:center;justify-content:space-between;padding:0 22px 0 26px;color:var(--color-text-2);font-size:18px}.send-button{display:grid;place-items:center;border:0;background:transparent;color:var(--color-brand)!important;width:32px;height:36px;padding:0}.send-button svg{width:28px;height:28px}body.ai-boyfriend-page .chat-options-menu{position:absolute!important;top:80px!important;right:20px!important;z-index:8!important;min-width:180px!important;padding:8px!important;background:white!important;border:1px solid var(--color-border)!important;border-radius:12px!important;box-shadow:var(--shadow-md)!important}body.ai-boyfriend-page .chat-options-menu[hidden]{display:none!important}body.ai-boyfriend-page .preview-menu-action{display:block!important;width:100%!important;padding:10px 12px!important;background:transparent!important;border:0!important;text-align:left!important;font-size:14px!important;border-radius:7px!important}body.ai-boyfriend-page .preview-menu-action:hover{background:#f5efff!important}#conversation .center{margin-top:34px}#conversation .center .btn{width:340px}
.prototype-create{height:605px}.prototype-create .section-head{height:144px}.prototype-create .section-head p{max-width:1200px;font-size:22px}.prototype-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:21.59px;min-height:313px}.prototype-steps figure{min-width:0}.step-image{aspect-ratio:436/236;position:relative;display:flex;overflow:hidden;border-radius:10px;background:#242125;color:white}.step-image>img{width:31%;height:100%;object-fit:cover;object-position:center top;margin-left:auto}.product-copy{position:relative;z-index:1;padding:18px 0 12px 22px;width:69%;font-size:14px;line-height:1.25;min-width:0}.product-copy>strong{display:block;font-size:17px;margin-bottom:22px;white-space:nowrap}.product-copy p{color:white;font-size:14px;margin:10px 0}.product-copy b{font-size:14px;font-weight:700}.personality-tags{display:flex;gap:6px;margin:8px 0 17px;position:relative;z-index:2;width:280px}.personality-tags>span{border-radius:14px;background:#48434b;padding:5px 10px;font-size:11px;white-space:nowrap}.personality-tags>span:first-child{background:#8249ef}.voice-choice{display:flex;align-items:center;gap:14px;height:45px;white-space:nowrap;padding-right:8px;font-size:14px}.voice-choice i{height:32px;width:32px;flex-shrink:0;background:#48434b;border-radius:50%}.voice-choice.chosen{border-radius:24px;background:#674294}.voice-choice.chosen i{background:#7533ff}.product-voice>img{width:31%}.product-summary>img{width:30%}.prototype-steps figcaption{display:flex;gap:18px;align-items:center;margin-top:8px;font-size:20px;font-weight:700;line-height:1.3}.step-number{display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;border-radius:50%;background:#7533ff;color:white;font-size:20px;font-weight:400}.prototype-create .center{margin-top:48px}
.feature-section{height:810px}.feature-section .section-head{height:90px}.feature-section h2{font-size:44px}.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.feature{height:330px;padding:32px;min-width:0;background:white;border:1px solid var(--color-border);border-radius:14px;box-shadow:0 5px 18px #7345b607}.feature-icon{display:block;width:28px;height:30px;color:#793bff;margin-bottom:28px}.feature-icon svg{display:block;width:28px;height:30px;stroke:currentColor;fill:none;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.feature h3{font-size:24px;line-height:29px;min-height:58px;font-weight:700;letter-spacing:-.4px;margin-bottom:30px}.feature p{font-size:18px;line-height:27px}
.faq-section{height:800px;display:grid;grid-template-columns:minmax(0,400fr) minmax(0,726fr);gap:94px}.faq-intro{position:relative;padding-top:48px}.faq-intro h2{font-size:46px;white-space:nowrap}.purple{color:#7533ff}.faq-intro p{font-size:24px;line-height:1.25;margin-top:8px}.faq-spark{position:absolute;right:-16px;top:48px;width:56px;height:60px;display:block}.faq-spark i,.scene-sparks i,.closing-sparks i{display:block;position:absolute;background:#b98aff;clip-path:path("M15 0C17 10 20 13 30 15C20 17 17 20 15 30C13 20 10 17 0 15C10 13 13 10 15 0Z");width:30px;height:30px}.faq-spark i:first-child{right:0;top:0}.faq-spark i:last-child{left:0;bottom:0;transform:scale(.75)}.faq-list{padding-top:22px;display:flex;flex-direction:column;gap:8px;min-width:0}.faq-item{background:white;border:1px solid var(--color-border);border-radius:14px;overflow:hidden}body.ai-boyfriend-page .faq-question{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:18px!important;width:100%!important;min-height:62px!important;padding:16px 28px!important;border:0!important;background:white!important;text-align:left!important;font-size:18px!important;line-height:1.3!important;font-weight:600!important}body.ai-boyfriend-page .faq-question>span{font-size:22px!important;color:#7345b6!important;line-height:1!important;transition:transform .2s!important}body.ai-boyfriend-page .faq-item.open .faq-question>span{transform:rotate(180deg)!important}.faq-answer{display:grid;grid-template-rows:0fr;visibility:hidden}.faq-answer>div{overflow:hidden}.faq-item.open .faq-answer{grid-template-rows:1fr;visibility:visible}.faq-answer p{padding:0 28px 20px;font-size:16px;line-height:20px}
.closing{height:340px;position:relative;isolation:isolate;display:grid;grid-template-columns:1fr 1fr}.closing::before{content:"";position:absolute;z-index:-2;inset:12px 0;border:1.2px solid var(--color-border);border-radius:34px;background:linear-gradient(110deg,#fffffff9,#faf3fd20);box-shadow:-18px 8px 68px 3px #cdb0f83d}.closing::after{content:"";position:absolute;z-index:-1;width:680px;height:372px;left:540px;top:-34px;background:radial-gradient(ellipse,#d5a3f5b3,transparent 70%);pointer-events:none}.closing>div:first-child{position:relative;z-index:2;padding:40px 32px 0;width:750px;max-width:100%;pointer-events:none}.closing>div:first-child .btn{pointer-events:auto}.closing h2{font-size:46px;line-height:1.1;letter-spacing:-1.38px;max-width:710px}.closing p{font-size:20px;line-height:27px;max-width:600px;margin-top:12px}.closing .btn{width:438px;margin-top:6px;font-size:22px}.closing-image{position:absolute;left:644px;top:-4px;width:536px;height:332px;overflow:visible}.closing-image>img{position:absolute;width:536px;height:auto;max-width:none;top:0;left:0;clip-path:inset(0 0 calc(100% - 332px) 0);mask-image:linear-gradient(#000 0 294px,transparent 328px);-webkit-mask-image:linear-gradient(#000 0 294px,transparent 328px);object-fit:contain}.closing-greeting{position:absolute;left:246px;top:234px;display:flex;align-items:center;justify-content:center;width:304px;height:70px;border-radius:36px;background:white;color:#190952;font-size:20px;white-space:nowrap;box-shadow:0 12px 24px #d4a5fb55;z-index:3}.closing-greeting::after{content:"";position:absolute;left:24px;bottom:-12px;width:25px;height:20px;background:white;clip-path:polygon(0 0,100% 0,0 100%)}.closing-sparks{position:absolute;left:-92px;top:60px;width:104px;height:180px;z-index:1}.closing-sparks i{background:#d3adff}.closing-sparks i:nth-child(1){left:54px;top:0;transform:scale(.6)}.closing-sparks i:nth-child(2){left:20px;top:38px}.closing-sparks i:nth-child(3){left:0;top:100px;transform:scale(.8)}
@media(max-width:1300px) and (min-width:1101px){.conversation-demo{gap:70px}.chat-top{padding-inline:22px}.messages{padding-inline:22px}.bubble{font-size:16px;padding:14px 20px}.feature{padding:28px}.feature h3{font-size:22px}.feature p{font-size:17px}.closing-image{left:auto;right:0}.closing::after{left:auto;right:-20px}.closing-greeting{left:auto;right:0}.closing h2{font-size:42px}.closing>div:first-child{width:650px}.faq-intro h2{font-size:40px}.faq-intro p{font-size:20px}}
@media(max-width:1100px){.bf-page h2{font-size:36px}.bf-page .section,.bf-page .closing{margin-top:80px}#characters{height:auto;padding-bottom:0}#characters .section-head{height:auto;margin-bottom:36px}#characters .section-head p{font-size:18px}.character-grid{gap:24px}.character-card{height:auto}.card-content{padding:20px;min-height:240px}.card-title h3{font-size:24px}.card-content p{font-size:15px;line-height:1.55}.conversation-section{height:auto}#conversation .section-head{height:auto;padding:0;margin-bottom:40px}#conversation .section-head h2{font-size:36px}#conversation .section-head p{font-size:18px}.conversation-demo{gap:36px;min-height:0;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:start}.chat-window{height:540px;border-radius:22px}.chat-top{height:88px;padding:20px;gap:12px}.chat-top>img{width:42px;height:42px}.chat-top strong{font-size:18px}.chat-top div>span{font-size:12px;margin-top:5px}.messages{padding:0 18px 18px;gap:18px}.bubble{font-size:14px;line-height:20px;padding:12px 16px;border-radius:22px;width:min(100%,300px)}.bubble.user{width:min(88%,280px)}.bubble:nth-child(2){min-width:105px}.preview-composer{height:48px;font-size:14px;padding:0 15px}.chat-bottom{margin:0 14px 14px}body.ai-boyfriend-page .person-option{height:60px!important;font-size:14px!important;gap:7px!important;padding:8px!important}body.ai-boyfriend-page .person-option img{width:38px!important;height:38px!important}.character-switcher{gap:10px;margin-top:20px}body.ai-boyfriend-page .person-option.active::after{background-size:100% 100%!important}.prototype-create{height:auto}.prototype-create .section-head{height:auto;margin-bottom:30px}.prototype-create .section-head p{font-size:18px}.prototype-steps{min-height:0;gap:18px}.prototype-steps figcaption{font-size:16px;gap:10px}.step-number{width:30px;height:30px;font-size:16px}.product-copy{padding:12px 0 8px 12px;font-size:10px}.product-copy>strong{font-size:12px;margin-bottom:14px}.product-copy p,.product-copy b{font-size:10px}.personality-tags{gap:4px;margin:5px 0 10px}.personality-tags>span{font-size:8px;padding:4px 6px}.voice-choice{font-size:10px;gap:8px;height:32px}.voice-choice i{width:23px;height:23px}.prototype-create .center{margin-top:44px}.feature-section{height:auto}.feature-section .section-head{height:auto;margin-bottom:36px}.feature-section h2{font-size:36px}.feature-grid{gap:18px}.feature{height:auto;min-height:310px;padding:24px}.feature h3{font-size:20px;line-height:25px;margin-bottom:20px;min-height:50px}.feature p{font-size:15px;line-height:23px}.faq-section{height:auto;gap:50px;grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr)}.faq-intro h2{font-size:34px}.faq-intro p{font-size:18px}.faq-spark{right:-18px;top:90px;transform:scale(.7)}body.ai-boyfriend-page .faq-question{font-size:15px!important;padding:16px 20px!important;min-height:60px!important}.faq-answer p{font-size:14px;line-height:20px;padding:0 20px 18px}.closing{height:340px}.closing>div:first-child{width:55%;padding:36px 24px}.closing h2{font-size:32px;letter-spacing:-1px}.closing p{font-size:15px;line-height:22px}.closing .btn{font-size:15px;height:52px;width:310px;margin-top:18px}.closing-image{left:auto;right:-10px;width:380px;height:300px;top:28px}.closing-image>img{width:380px;clip-path:inset(0 0 calc(100% - 288px) 0);mask-image:linear-gradient(#000 0 250px,transparent 288px);-webkit-mask-image:linear-gradient(#000 0 250px,transparent 288px)}.closing-greeting{left:auto;right:10px;top:210px;width:230px;height:56px;font-size:15px}.closing::after{left:auto;right:-20px;width:480px}.closing-sparks{left:-20px;transform:scale(.75)}}
@media(max-width:800px){.conversation-demo{grid-template-columns:1fr;max-width:600px;margin:auto;gap:36px}.character-picker{width:100%}.chat-window{height:600px}.chat-top{height:100px;padding:24px 26px}.chat-top>img{width:50px;height:50px}.chat-top strong{font-size:22px}.messages{padding-inline:26px}.bubble{font-size:16px;line-height:23px;width:min(90%,370px);padding:14px 22px}.bubble.user{width:min(85%,340px)}.bubble:nth-child(2){min-width:120px}.preview-composer{height:54px;font-size:16px}.character-switcher{gap:14px}body.ai-boyfriend-page .person-option{height:68px!important;font-size:17px!important}body.ai-boyfriend-page .person-option img{width:48px!important;height:48px!important}.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.faq-section{grid-template-columns:1fr;gap:28px}.faq-intro{padding:0}.faq-intro h2{font-size:36px}.faq-intro p{font-size:18px;margin-top:12px}.faq-spark{right:20px;top:0}.faq-list{padding-top:0}.closing h2{font-size:28px}.closing-image{right:-20px;width:330px;top:48px}.closing-image>img{width:330px}.closing-greeting{top:210px;width:210px;font-size:14px}.closing .btn{font-size:13px;padding-inline:12px 30px}.closing .btn::after{right:15px}.prototype-steps{gap:14px}.product-copy>strong{font-size:10px}.product-copy p,.product-copy b{font-size:8px}.personality-tags>span{font-size:6px;padding:3px 4px}.voice-choice{font-size:8px;height:25px;gap:5px}.voice-choice i{height:18px;width:18px}.prototype-steps figcaption{font-size:13px;gap:7px}.step-number{width:25px;height:25px;font-size:13px}}
@media(max-width:640px){.bf-page .section,.bf-page .closing{margin-top:64px}.bf-page h2,#conversation .section-head h2,.feature-section h2{font-size:30px;line-height:1.18;letter-spacing:-.7px}.section-head p,#characters .section-head p,#conversation .section-head p,.prototype-create .section-head p{font-size:16px;line-height:1.5;margin-top:16px}.desktop{display:none}.btn{width:min(100%,340px);height:54px;font-size:16px}.btn::after{right:20px;width:7px;height:7px}#characters .section-head{margin-bottom:28px}.character-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}.character-card{border-radius:12px}.card-content{padding:14px;min-height:220px}.card-title h3{font-size:20px}.card-content p{font-size:12px;line-height:1.5}.card-title{margin-bottom:10px}#characters .center{margin-top:30px}.character-switcher{gap:8px;margin-top:18px}body.ai-boyfriend-page .person-option{height:58px!important;gap:7px!important;font-size:14px!important;padding:6px!important}body.ai-boyfriend-page .person-option img{width:36px!important;height:36px!important}.chat-window{height:560px}.chat-top{height:88px;padding:20px}.chat-top strong{font-size:20px}.chat-top>img{width:46px;height:46px}.messages{padding:0 18px 18px;gap:18px}.bubble{font-size:14px;line-height:21px;padding:12px 18px;border-radius:22px}.preview-composer{height:50px;font-size:14px}.chat-bottom{margin:0 14px 14px}#conversation .center{margin-top:30px}.prototype-steps{grid-template-columns:1fr;gap:30px;max-width:420px;margin:auto}.step-image{border-radius:10px}.product-copy{padding:20px 0 12px 20px}.product-copy>strong{font-size:16px;margin-bottom:20px}.product-copy p,.product-copy b{font-size:13px}.personality-tags{gap:5px;margin:8px 0 14px}.personality-tags>span{font-size:10px;padding:5px 8px}.voice-choice{font-size:13px;height:40px;gap:10px}.voice-choice i{height:30px;width:30px}.prototype-steps figcaption{font-size:17px;margin-top:12px;gap:12px}.step-number{width:34px;height:34px;font-size:18px}.feature-grid{grid-template-columns:1fr;gap:18px}.feature{min-height:0;padding:28px}.feature h3{min-height:0;font-size:22px;line-height:27px;margin-bottom:18px}.feature p{font-size:16px;line-height:25px}.feature-icon{margin-bottom:22px}.faq-intro h2{font-size:30px}.faq-intro p{font-size:16px}body.ai-boyfriend-page .faq-question{font-size:14px!important;padding:16px!important;min-height:64px!important}.faq-answer p{padding:0 16px 18px;font-size:14px}.closing{height:620px;display:block}.closing>div:first-child{width:100%;max-width:none;padding:34px 24px}.closing h2{font-size:30px;line-height:1.13}.closing p{font-size:15px;line-height:23px}.closing .btn{font-size:14px;width:100%;height:52px;margin-top:20px}.closing-image{width:360px;max-width:100%;height:280px;top:auto;bottom:12px;right:0}.closing-image>img{width:360px;max-width:100%;mask-image:linear-gradient(#000 0 245px,transparent 280px);-webkit-mask-image:linear-gradient(#000 0 245px,transparent 280px)}.closing-greeting{right:6px;top:200px;width:224px;height:52px;font-size:14px}.closing::after{width:100%;height:340px;right:0;top:auto;bottom:0}.closing-sparks{left:0}.closing::before{border-radius:26px}.footer-links{gap:14px}}body.ai-boyfriend-page /* Review corrections: visible perimeter progress and content-sized FAQ. */
.person-option.active::after{content:none!important}
.person-progress{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);overflow:visible;pointer-events:none;z-index:2}
.person-progress rect{fill:none;stroke:#7533ff;stroke-width:2.5;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-dasharray:calc(var(--progress,0)*100) 100;stroke-dashoffset:0}
.faq-section{height:auto;min-height:800px;align-items:start}.faq-item{flex-shrink:0}.faq-spark{top:190px;right:42px}
@media(min-width:1101px){
.wrap{width:min(1120px,calc(100% - 80px))}.bf-page{max-width:1440px}
.bf-page h2,#conversation .section-head h2{font-size:40px}.section-head p,#characters .section-head p,#conversation .section-head p,.prototype-create .section-head p{font-size:20px}
.bf-page .section,.bf-page .closing{margin-top:80px}
#characters{height:auto}#characters .section-head{height:auto;margin-bottom:42px}.character-grid{column-gap:38px;row-gap:24px}.character-card{height:auto}.card-content{min-height:225px}.card-title h3{font-size:25px}.card-content p{font-size:16px;line-height:24px}
.conversation-section{height:auto}#conversation .section-head{height:auto;margin-bottom:44px}.conversation-demo{gap:70px;min-height:0}.chat-top strong{font-size:21px}.bubble{font-size:16px;line-height:23px}.preview-composer{font-size:16px}body.ai-boyfriend-page .person-option{font-size:16px!important;height:64px!important}body.ai-boyfriend-page .person-option img{width:44px!important;height:44px!important}
.prototype-create{height:auto}.prototype-create .section-head{height:auto;margin-bottom:36px}.prototype-steps{min-height:0}.prototype-steps figcaption{font-size:18px}
.feature-section{height:auto}.feature-section .section-head{height:auto;margin-bottom:38px}.feature{height:auto;min-height:290px;padding:28px}.feature h3{font-size:21px;line-height:27px;margin-bottom:22px}.feature p{font-size:16px;line-height:25px}
.faq-section{min-height:0;gap:72px;padding-bottom:24px}.faq-intro h2{font-size:38px}.faq-intro p{font-size:20px}body.ai-boyfriend-page .faq-question{font-size:16px!important}.faq-answer p{font-size:15px;line-height:22px}
.closing h2{font-size:38px}.closing p{font-size:18px;line-height:26px}.closing .btn{font-size:18px;width:370px}.closing>div:first-child{width:610px}.closing-image{left:auto;right:0}
}
@media(max-width:1100px){.faq-section{min-height:0}.faq-spark{top:140px;right:30px}}
@media(max-width:800px){.faq-spark{top:0;right:12px}.faq-intro{padding-right:65px}.faq-intro h2{white-space:normal}}body.ai-boyfriend-page .person-option:not(.active) .person-progress{display:none!important}

/* Embedded body: navigation and footer come from host components. */
.preview-composer input{min-width:0;flex:1;width:100%;padding:8px 0;border:0;outline:none;background:transparent;color:var(--color-text);font:inherit}.preview-composer input::placeholder{color:var(--color-text-2);opacity:1}.preview-composer:focus-within{border-color:#7533ff;box-shadow:0 0 0 2px #7533ff12}.send-button:disabled{opacity:.35;cursor:default}.bubble.user.message-sent{width:fit-content;max-width:88%;animation:message-arrive .22s ease-out}.bubble.user.message-sent:nth-child(2){min-width:0}
@keyframes message-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.closing .btn{margin-top:30px}.closing{min-height:380px;height:auto}.closing>div:first-child{padding-bottom:36px}
@media(max-width:640px){.closing{height:650px}.closing .btn{margin-top:28px}}

/* Scale only the portrait/chat group; headings and section bounds remain unchanged. */

.message-arriving{animation:message-arrive .28s ease-out both}.preview-composer{cursor:default}.preview-composer .send-button{cursor:default}

/* Explicit shared geometry: keep portrait and chat at the same reduced scale. */
@media(min-width:801px){
.conversation-demo{zoom:1;width:80%;max-width:896px;margin-inline:auto;grid-template-columns:minmax(0,488fr) minmax(0,352fr);gap:56px;min-height:0;align-items:start}
.selected-portrait{width:100%;aspect-ratio:1}.selected-portrait img{width:100%;height:auto}
.character-switcher{gap:12px;margin-top:22px}body.ai-boyfriend-page .person-option{height:52px!important;padding:6px 8px!important;gap:8px!important;font-size:13px!important}body.ai-boyfriend-page .person-option img{width:36px!important;height:36px!important}
.chat-window{height:520px;border-radius:23px}.chat-top{height:86px;padding:22px 24px;gap:16px}.chat-top>img{width:46px;height:46px}.chat-top strong{font-size:17px}.chat-top div>span{font-size:11px;margin-top:6px}body.ai-boyfriend-page .chat-options{width:22px!important;height:29px!important}body.ai-boyfriend-page .chat-options svg{width:16px!important;height:16px!important}
.messages{padding:0 24px 16px;gap:18px}.bubble{font-size:13px;line-height:19px;padding:13px 20px;border-radius:22px;width:100%;max-width:100%}.bubble.user{width:272px;max-width:92%}.bubble:nth-child(2){min-width:112px;width:fit-content}
.chat-bottom{margin:0 14px 14px}.preview-composer{height:50px;padding:0 17px 0 20px;font-size:14px}.send-button{width:26px;height:29px}.send-button svg{width:22px;height:22px}
}
@media(min-width:801px) and (max-width:1100px){.conversation-demo{width:90%;gap:32px}.messages{padding-inline:16px}.chat-top{padding-inline:16px}body.ai-boyfriend-page .person-option{font-size:12px!important;gap:5px!important}body.ai-boyfriend-page .person-option img{width:30px!important;height:30px!important}}

/* Shared description typography and balanced intro measure. */
.bf-page{--description-font-size:16px;--description-line-height:24px;--description-width:760px}
.bf-page .section-head p,.bf-page #characters .section-head p,.bf-page #conversation .section-head p,.bf-page .prototype-create .section-head p,.bf-page .faq-intro p,.bf-page .closing p,.bf-page .scene-copy p{font-size:var(--description-font-size);line-height:var(--description-line-height);font-weight:400}
.bf-page #characters .section-head p,.bf-page #conversation .section-head p,.bf-page #create .section-head p{width:100%;max-width:var(--description-width);margin:16px auto 0;text-align:center;text-wrap:pretty}

/* Desktop section spacing review. */
@media(min-width:1101px){.bf-page .section,.bf-page .closing{margin-top:120px}}

/* Match production homepage CTA treatment across all breakpoints. */
.bf-page .btn{background:#7540DF;background-image:none;border-radius:14px;box-shadow:0 7px 18px rgba(137,90,255,.145)}

/* Mobile descriptions follow the compact body type scale. */
@media(max-width:640px){.bf-page{--description-font-size:14px;--description-line-height:21px}.bf-page .feature p{font-size:14px;line-height:21px}}

/* Mobile chat preview: content-sized height, readable text and avatars unchanged. */
@media(max-width:640px){.bf-page #conversation .chat-window{height:auto;min-height:400px}.bf-page #conversation .messages{flex:0 0 auto;overflow:visible;min-height:0}.bf-page #conversation .chat-bottom{margin-top:auto;padding-top:12px}}

/* Hero geometry uses the confirmed 1540 x 1000 Figma section. */
.bf-page .hero-scene.wrap{width:100%;max-width:1540px;height:1000px;position:relative;isolation:isolate;overflow:hidden;margin-top:96px}
.scene-title{position:relative;z-index:3;text-align:center;font-size:64px;line-height:1.1;font-weight:700;letter-spacing:-1.92px}
.scene-title>span{display:block}.scene-title>span+span{font-size:40px;line-height:1.2;letter-spacing:-1.2px;margin-top:10px}
.scene-action{position:relative;z-index:4;text-align:center;margin-top:22px}.scene-action .btn{font-size:22px}
.listening-stage{position:absolute;inset:0;isolation:isolate;pointer-events:none}
.listening-stage::before{content:"";position:absolute;left:calc(50% - 500px);top:200px;width:1000px;height:800px;background:radial-gradient(ellipse at center,#dfb6fad9 0%,#dfb6fa70 40%,#f6e6fc00 72%);z-index:-1;pointer-events:none}
.scene-character{position:absolute!important;left:calc(50% - 350px);top:270px;width:700px;height:1050px;max-width:none;z-index:1}.scene-character img{width:700px;height:1050px;max-width:none;object-fit:contain}
.scene-copy{position:absolute;top:250px;left:max(40px,calc(50% - 610px));width:300px;z-index:2}.scene-copy p{font-size:20px;line-height:28px;max-width:300px}
.voice-cue{margin-top:34px}.voice-cue span{display:none}.voice-cue svg{width:150px;height:60px;stroke:#7533ff;stroke-width:2;stroke-linecap:round;fill:none}
.scene-messages{position:absolute;left:calc(50% + 266px);top:0;width:344px;height:650px;z-index:3;color:#190952}.scene-message{position:absolute;font-size:22px;line-height:30px;box-shadow:none}
.scene-message.from-user{right:0;top:260px;width:302px;padding:24px 30px;border-radius:30px;background:white}
.scene-message.from-character{right:0;top:380px;width:150px;padding:16px 24px;border-radius:30px;background:#e4d7fd;text-align:center}
.memory-cue{position:absolute;left:0;top:470px;width:344px;padding:24px 28px;border-radius:30px;background:white;font-size:20px;line-height:28px}
.memory-cue::after{content:"";position:absolute;right:24px;bottom:-12px;width:24px;height:20px;background:white;clip-path:polygon(0 0,100% 0,100% 100%)}
.scene-sparks{position:absolute;left:8px;top:380px;width:64px;height:64px}.scene-sparks i:first-child{right:0;top:0}.scene-sparks i:last-child{left:0;bottom:0;transform:scale(.75)}
@media(max-width:1300px) and (min-width:1101px){.scene-copy{width:270px}.scene-copy p{font-size:18px}.scene-messages{left:auto;right:40px;width:300px}.scene-message.from-user{width:270px;font-size:20px}.memory-cue{width:300px;font-size:18px}}
@media(max-width:1100px){.bf-page .hero-scene.wrap{height:900px;margin-top:64px}.scene-title{font-size:54px}.scene-title>span+span{font-size:32px}.scene-action .btn{font-size:19px}.scene-character{width:600px;height:900px;left:calc(50% - 300px);top:250px}.scene-character img{width:600px;height:900px}.scene-copy{left:24px;top:230px;width:235px}.scene-copy p{font-size:16px;line-height:24px}.scene-messages{left:auto;right:24px;width:250px}.scene-message.from-user{top:250px;width:230px;padding:18px 20px;font-size:17px;line-height:25px}.scene-message.from-character{top:355px;width:130px;font-size:19px}.memory-cue{top:450px;width:250px;font-size:16px;line-height:24px;padding:20px}.scene-sparks{top:375px}.listening-stage::before{left:5%;width:90%;top:200px;height:700px}}
@media(max-width:800px){.bf-page .hero-scene.wrap{height:940px}.scene-title{font-size:46px}.scene-title>span+span{font-size:28px}.scene-copy{top:215px;width:210px}.scene-copy p{font-size:15px}.scene-character{left:calc(50% - 240px);top:300px;width:600px}.scene-messages{top:30px;width:210px}.scene-message.from-user{width:210px;font-size:15px}.memory-cue{width:210px;font-size:14px;padding:18px}.scene-message.from-character{top:360px}.scene-sparks{top:390px;left:0}}
@media(max-width:640px){.bf-page .hero-scene.wrap{height:auto;min-height:0;padding:0 18px;margin-top:36px;overflow:hidden}.scene-title{font-size:clamp(30px,8.3vw,46px);letter-spacing:-1px}.scene-title>span+span{font-size:clamp(23px,6.3vw,30px);line-height:1.2;letter-spacing:-.7px;max-width:480px;margin:12px auto 0}.scene-action{margin-top:24px}.scene-action .btn{font-size:16px}.listening-stage{position:relative;inset:auto;height:710px;margin-top:30px;display:flex;flex-direction:column;pointer-events:none}.scene-character{top:0;left:calc(50% - 215px);width:430px;height:470px;overflow:hidden}.scene-character img{width:430px;height:645px}.listening-stage::before{left:-15%;top:0;width:130%;height:500px}.scene-copy{position:relative;top:auto;left:auto;order:2;margin-top:500px;width:100%;text-align:center}.scene-copy p{max-width:430px;margin:auto;font-size:16px;line-height:26px}.voice-cue{margin-top:18px}.voice-cue svg{width:120px;height:40px}.scene-messages{right:0;top:0;width:170px;height:470px}.scene-message.from-user{top:200px;width:170px;font-size:12px;line-height:18px;padding:14px 16px;border-radius:20px;box-shadow:0 5px 16px #7345b608}.scene-message.from-character{top:292px;width:105px;padding:12px 16px;font-size:15px}.memory-cue,.scene-sparks{display:none}}

/* Fade at the visible frame edge, rather than at the source image bottom. */
.scene-character{mask-image:linear-gradient(to bottom,#000 0px,#000 620px,transparent 730px);-webkit-mask-image:linear-gradient(to bottom,#000 0px,#000 620px,transparent 730px)}
@media(min-width:1101px){.bf-page .hero-scene.wrap{max-width:1440px;height:920px;margin-top:80px}.scene-title{font-size:56px}.scene-title>span+span{font-size:34px}.scene-action .btn{font-size:19px}.scene-copy{left:max(40px,calc(50% - 560px));width:270px}.scene-copy p{font-size:18px;line-height:27px}.scene-character{top:250px;mask-image:linear-gradient(#000 0 560px,transparent 670px);-webkit-mask-image:linear-gradient(#000 0 560px,transparent 670px)}.scene-messages{left:auto;right:max(40px,calc(50% - 560px));width:310px}.scene-message{font-size:19px;line-height:27px}.scene-message.from-user{width:280px}.memory-cue{width:310px;font-size:18px;line-height:26px}}
@media(max-width:1100px){.scene-character{mask-image:linear-gradient(#000 0 540px,transparent 650px);-webkit-mask-image:linear-gradient(#000 0 540px,transparent 650px)}}
@media(max-width:800px){.scene-character{mask-image:linear-gradient(#000 0 530px,transparent 640px);-webkit-mask-image:linear-gradient(#000 0 530px,transparent 640px)}}
@media(max-width:640px){.scene-character{mask-image:linear-gradient(#000 0 380px,transparent 470px);-webkit-mask-image:linear-gradient(#000 0 380px,transparent 470px)}}

/* Content-driven bubble placement prevents overlap when text wraps. */
@media(min-width:641px){.scene-messages{top:260px;height:auto;display:flex;flex-direction:column;align-items:flex-end;gap:24px}.scene-messages .scene-message,.scene-messages .memory-cue{position:relative;inset:auto;flex-shrink:0}.scene-messages .scene-sparks{left:28px;top:140px}.scene-messages .memory-cue{margin-top:8px}}

/* Headphone-sharing conversation: user lavender, AI white, body-sized type. */
.bf-page .scene-messages .scene-message,.bf-page .scene-messages .memory-cue{font-size:16px;line-height:24px;text-align:left}
.bf-page .scene-message.from-user,.bf-page .scene-messages .memory-cue{background:#e4d7fd;color:#190952}
.bf-page .scene-message.from-character{background:#fff;color:#190952}
.bf-page .scene-messages .memory-cue::after{background:#e4d7fd}
.bf-page .voice-cue svg{width:112px;height:44px;opacity:.58;stroke-width:1.7}
.voice-cue line{transform-box:fill-box;transform-origin:center;animation:voice-playing var(--voice-speed,.9s) ease-in-out var(--voice-delay,0s) infinite alternate}
@keyframes voice-playing{0%{transform:scaleY(.35)}45%{transform:scaleY(.7)}100%{transform:scaleY(1)}}
@media(min-width:641px){.bf-page .scene-messages{gap:18px}.bf-page .scene-message.from-user{width:280px;padding:20px 24px;align-self:flex-end}.bf-page .scene-message.from-character{width:250px;padding:20px 24px;align-self:flex-start}.bf-page .scene-messages .memory-cue{width:280px;padding:20px 24px;margin-top:0;align-self:flex-end}.bf-page .scene-messages .scene-sparks{position:absolute;left:auto;right:0;top:120px;width:46px;height:58px;margin:0;pointer-events:none}.bf-page .scene-messages .scene-sparks i:first-child{left:auto;right:0;top:0;width:30px;height:30px;transform:scale(.85);transform-origin:top right}.bf-page .scene-messages .scene-sparks i:last-child{left:0;right:auto;top:auto;bottom:0;width:30px;height:30px;transform:scale(.6);transform-origin:bottom left}}
@media(max-width:640px){.bf-page .voice-cue svg{width:96px;height:36px}.bf-page .scene-message.from-user{padding:14px 16px}.bf-page .scene-message.from-character{width:170px;top:320px;padding:14px 16px}}
@media(prefers-reduced-motion:reduce){.voice-cue line{animation:none;transform:none}}

/* Hero-only voice-message composition. The play glyph is decorative, not a control. */
.bf-page .hero-scene .scene-copy{top:440px;left:max(48px,calc(50% - 540px));width:260px;margin:0;text-align:left}
.hero-scene .hero-voice-message{display:flex;align-items:center;gap:14px;width:260px;max-width:100%;height:66px;padding:12px 16px;border:0;border-radius:24px;background:rgba(255,255,255,.8);box-shadow:0 5px 20px rgba(99,60,140,.055);color:#7540df;cursor:default;user-select:none}
.hero-scene .hero-voice-play{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:50%;background:#eee5fc;color:#7540df}.hero-scene .hero-voice-play svg{width:19px;height:19px;margin-left:2px}
.hero-scene .hero-voice-wave{display:block;flex:1;min-width:0;width:125px;height:30px;fill:none;stroke:#a77cde;stroke-width:2.2;stroke-linecap:round;opacity:.8}
.hero-scene .hero-voice-duration{flex:0 0 auto;font-size:13px;line-height:1;font-weight:500;color:#89769f;font-variant-numeric:tabular-nums}
@media(min-width:641px) and (max-width:1100px){.bf-page .hero-scene .scene-copy{top:500px;left:32px;width:225px}.hero-scene .hero-voice-message{width:225px;gap:10px;padding-inline:14px}.hero-scene .hero-voice-play{flex-basis:30px;width:30px;height:30px}}
@media(max-width:640px){
.bf-page .hero-scene .listening-stage{display:block;height:auto;min-height:0;margin-top:30px;padding-top:540px;padding-bottom:24px}
.bf-page .hero-scene .scene-character{left:calc(50% - 215px);top:0;width:430px;height:440px;mask-image:linear-gradient(#000 0 345px,transparent 440px);-webkit-mask-image:linear-gradient(#000 0 345px,transparent 440px)}
.bf-page .hero-scene .scene-copy{position:absolute;top:452px;left:50%;width:240px;max-width:100%;margin:0;transform:translateX(-50%)}.hero-scene .hero-voice-message{width:240px;height:62px;padding:12px 15px;gap:12px}
.bf-page .hero-scene .scene-messages{position:relative;inset:auto;display:flex;flex-direction:column;gap:14px;width:100%;max-width:360px;height:auto;margin-inline:auto}
.bf-page .hero-scene .scene-messages .scene-message,.bf-page .hero-scene .scene-messages .memory-cue{position:relative;inset:auto;display:block;margin:0;max-width:92%;font-size:16px;line-height:24px;border-radius:24px;padding:16px 20px}
.bf-page .hero-scene .scene-message.from-user{align-self:flex-end;width:280px}.bf-page .hero-scene .scene-message.from-character{align-self:flex-start;width:250px}.bf-page .hero-scene .scene-messages .memory-cue{align-self:flex-end;width:280px}
.bf-page .hero-scene .scene-sparks{display:none}.bf-page .hero-scene .listening-stage::before{top:0;left:-15%;width:130%;height:490px}
}

/* Compact, translucent dialogue orbiting the unchanged portrait. */
.bf-page .hero-scene .scene-messages .scene-message,.bf-page .hero-scene .scene-messages .memory-cue{width:fit-content;max-width:100%;min-height:44px;padding:12px 18px;font-size:14px;line-height:20px;border:0;border-radius:28px;color:#190952;box-shadow:none;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:1}
.bf-page .hero-scene .scene-message.from-user,.bf-page .hero-scene .scene-messages .memory-cue{background:rgba(222,204,255,.65)}
.bf-page .hero-scene .scene-message.from-character{background:rgba(255,255,255,.75)}
.bf-page .hero-scene .scene-messages .memory-cue::after{background:rgba(222,204,255,.65)}
@media(min-width:641px){
.bf-page .hero-scene .scene-messages{top:310px;gap:16px;height:auto}.bf-page .hero-scene .scene-messages .scene-message,.bf-page .hero-scene .scene-messages .memory-cue{white-space:nowrap;max-width:none;margin:0}
.bf-page .hero-scene .scene-message.from-user{align-self:flex-end}.bf-page .hero-scene .scene-message.from-character{align-self:flex-start}.bf-page .hero-scene .scene-messages .memory-cue{align-self:flex-end}
.bf-page .hero-scene .scene-copy{top:470px}
.bf-page .hero-scene .listening-stage>.scene-sparks{display:block;position:absolute;left:calc(50% - 180px);right:auto;top:360px;width:54px;height:62px;opacity:.78;pointer-events:none;z-index:2}
.bf-page .hero-scene .listening-stage>.scene-sparks i:first-child{left:auto;right:0;top:0;bottom:auto;transform:scale(.82);transform-origin:top right}.bf-page .hero-scene .listening-stage>.scene-sparks i:last-child{left:0;right:auto;top:auto;bottom:0;transform:scale(.55);transform-origin:bottom left}
}
@media(min-width:641px) and (max-width:1100px){.bf-page .hero-scene .scene-copy{top:530px}}
@media(min-width:641px) and (max-width:1000px){.bf-page .hero-scene .scene-messages{top:690px;right:24px;width:270px}.bf-page .hero-scene .listening-stage>.scene-sparks{display:none}}
@media(max-width:640px){
.bf-page .hero-scene .listening-stage{padding-top:570px}.bf-page .hero-scene .scene-copy{top:482px}
.bf-page .hero-scene .scene-messages{gap:16px}.bf-page .hero-scene .scene-messages .scene-message,.bf-page .hero-scene .scene-messages .memory-cue{white-space:normal;max-width:92%;width:fit-content;font-size:14px;line-height:20px;padding:12px 18px;overflow-wrap:break-word}
.bf-page .hero-scene .listening-stage>.scene-sparks{display:none}
}

/* Transparent voice-story content group; the existing player stays unchanged. */
.bf-page .hero-scene .scene-copy{top:410px;left:max(48px,calc(50% - 570px));width:350px;background:transparent;border:0;box-shadow:none;text-align:left}
.hero-scene .hero-voice-eyebrow{display:flex;align-items:center;gap:9px;font-size:11px;line-height:18px;font-weight:600;letter-spacing:1.4px;color:#9788ad}
.hero-scene .hero-voice-eyebrow svg{width:19px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.bf-page .hero-scene .scene-copy .hero-voice-heading{font-size:30px;line-height:1.2;letter-spacing:-.75px;font-weight:650;color:#190952;margin:12px 0 0}
.bf-page .hero-scene .scene-copy .hero-voice-description{max-width:340px;margin:14px 0 0;font-size:16px;line-height:24px;font-weight:400;color:#76658e}
.hero-scene .scene-copy .hero-voice-message{margin-top:24px}
@media(min-width:1001px) and (max-width:1250px){.bf-page .hero-scene .scene-copy{left:48px;width:310px}.bf-page .hero-scene .scene-copy .hero-voice-heading{font-size:27px}.bf-page .hero-scene .scene-copy .hero-voice-description{max-width:300px}}
@media(min-width:641px) and (max-width:1000px){.bf-page .hero-scene .scene-copy{left:32px;top:405px;width:280px}.bf-page .hero-scene .scene-copy .hero-voice-heading{font-size:26px}.bf-page .hero-scene .scene-copy .hero-voice-description{font-size:15px;line-height:23px;max-width:265px}.hero-scene .scene-copy .hero-voice-message{margin-top:20px}}
@media(max-width:640px){
.bf-page .hero-scene .listening-stage{padding-top:730px}
.bf-page .hero-scene .scene-copy{top:466px;left:50%;transform:translateX(-50%);width:min(350px,100%);max-width:100%;margin:0}
.bf-page .hero-scene .scene-copy .hero-voice-heading{font-size:28px;line-height:1.2;margin-top:10px}.bf-page .hero-scene .scene-copy .hero-voice-description{max-width:100%;font-size:16px;line-height:24px;margin-top:12px}
.hero-scene .scene-copy .hero-voice-message{margin-top:20px}
}
@media(max-width:360px){.bf-page .hero-scene .listening-stage{padding-top:754px}.bf-page .hero-scene .scene-copy .hero-voice-heading{font-size:26px}}

/* Mobile: dialogue belongs to the portrait; voice story follows the scene. */
@media(max-width:640px){
.bf-page .hero-scene .listening-stage{padding-top:0;padding-bottom:24px;display:flex;flex-direction:column;height:auto;min-height:0}
.bf-page .hero-scene .scene-messages{order:0;position:relative;inset:auto;box-sizing:border-box;width:100%;max-width:430px;height:auto;min-height:0;margin:0 auto;padding:302px 0 0;display:flex;flex-direction:column;gap:12px;z-index:3}
.bf-page .hero-scene .scene-messages .scene-message,.bf-page .hero-scene .scene-messages .memory-cue{width:fit-content;max-width:75%;min-height:44px;padding:11px 15px;border:0;border-radius:25px;font-size:14px;line-height:21px;color:#190952;white-space:normal;overflow-wrap:break-word;box-shadow:0 3px 12px rgba(85,53,126,.035);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.bf-page .hero-scene .scene-message.from-user,.bf-page .hero-scene .scene-messages .memory-cue{background:rgba(222,204,255,.32);align-self:flex-end}
.bf-page .hero-scene .scene-message.from-character{background:rgba(255,255,255,.42);align-self:flex-start}
.bf-page .hero-scene .scene-messages .memory-cue::after{background:rgba(222,204,255,.32)}
.bf-page .hero-scene .scene-copy{order:1;position:relative;inset:auto;transform:none;width:100%;max-width:350px;margin:28px auto 0;z-index:2}
.bf-page .hero-scene .scene-character{z-index:1}
}

@media(max-width:640px){.bf-page .hero-scene .scene-copy .hero-voice-description{font-size:var(--description-font-size,14px);line-height:var(--description-line-height,21px)}}

/* Confirmed Figma CTA 111:188: continuous canvas, independent copy card, full upper-body cutout. */
.bf-page .closing{display:block;position:relative;isolation:isolate;height:560px;min-height:0;background:#fcfbfe;overflow:visible;margin-bottom:48px}
.bf-page .closing::before{inset:auto;left:0;top:70px;width:66%;height:410px;border:0;border-radius:36px;background:linear-gradient(150deg,#fff 0%,#fff 45%,#fff9ff70 80%,#fcfbfe00 100%);box-shadow:-12px 16px 56px #cdb0f826;z-index:-2}
.bf-page .closing::after{inset:auto;left:42%;top:20px;width:58%;height:520px;background:radial-gradient(ellipse closest-side at 58% 50%,rgba(231,200,244,.72) 0%,rgba(231,200,244,.38) 38%,rgba(231,200,244,.12) 70%,rgba(231,200,244,0) 100%);z-index:-1}
.bf-page .closing>div.closing-copy{width:65%;max-width:none;padding:112px 0 48px 48px;pointer-events:none}
.bf-page .closing .closing-copy h2{font-size:38px;line-height:1.15;letter-spacing:-1.1px;max-width:620px}
.bf-page .closing .closing-copy p{font-size:16px;line-height:24px;max-width:470px;margin-top:24px}
.bf-page .closing .closing-copy .btn{margin-top:30px;width:360px;height:56px;font-size:16px;padding:12px 20px;pointer-events:auto}.bf-page .closing .closing-copy .btn::after{display:none}
.bf-page .closing .closing-image{inset:auto;right:0;top:40px;width:50%;height:500px;max-width:none;overflow:visible}
.bf-page .closing .closing-image>img{inset:0;width:100%;height:100%;max-width:none;object-fit:contain;object-position:center bottom;clip-path:none;mask-image:linear-gradient(to bottom,#000 0%,#000 72%,rgba(0,0,0,.98) 77%,rgba(0,0,0,.88) 82%,rgba(0,0,0,.63) 87%,rgba(0,0,0,.32) 92%,rgba(0,0,0,.08) 97%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 72%,rgba(0,0,0,.98) 77%,rgba(0,0,0,.88) 82%,rgba(0,0,0,.63) 87%,rgba(0,0,0,.32) 92%,rgba(0,0,0,.08) 97%,transparent 100%)}
.bf-page .closing .closing-greeting{inset:auto;right:12px;bottom:92px;width:280px;height:68px;border-radius:38px;font-size:16px;background:white;box-shadow:0 12px 24px #c991ed55;white-space:nowrap;z-index:3}.bf-page .closing .closing-greeting::after{left:24px;bottom:-12px;width:25px;height:20px}
.bf-page .closing .closing-sparks{left:-14px;top:130px;width:94px;height:150px;transform:none}.bf-page .closing .closing-sparks i{background:#d3adff}
@media(min-width:641px) and (max-width:1000px){.bf-page .closing{height:490px}.bf-page .closing::before{top:50px;height:365px;width:70%}.bf-page .closing::after{top:15px;height:440px}.bf-page .closing>div.closing-copy{padding:88px 0 36px 28px}.bf-page .closing .closing-copy h2{font-size:30px;max-width:460px}.bf-page .closing .closing-copy p{max-width:360px;font-size:14px;line-height:22px}.bf-page .closing .closing-copy .btn{width:300px;font-size:14px;margin-top:26px}.bf-page .closing .closing-image{top:65px;height:400px;width:47%}.bf-page .closing .closing-greeting{right:0;bottom:75px;width:220px;height:54px;font-size:13px}.bf-page .closing .closing-sparks{left:-20px;top:90px;transform:scale(.75)}}
@media(max-width:640px){.bf-page .closing{height:auto;min-height:0;padding-bottom:0;margin-bottom:32px}.bf-page .closing::before{top:0;left:0;width:100%;height:350px;border-radius:28px}.bf-page .closing::after{left:0;top:auto;bottom:0;width:100%;height:390px}.bf-page .closing>div.closing-copy{width:100%;padding:36px 24px 0}.bf-page .closing .closing-copy h2{font-size:28px;line-height:1.15;letter-spacing:-.7px}.bf-page .closing .closing-copy p{max-width:100%;font-size:16px;line-height:24px;margin-top:20px}.bf-page .closing .closing-copy .btn{width:100%;font-size:13px;height:52px;margin-top:26px}.bf-page .closing .closing-image{position:relative;inset:auto;width:100%;height:auto;aspect-ratio:1.05;margin-top:24px}.bf-page .closing .closing-image>img{height:100%;width:100%}.bf-page .closing .closing-greeting{right:0;bottom:55px;width:230px;height:56px;font-size:14px}.bf-page .closing .closing-sparks{left:0;top:36px;transform:scale(.7)}}

@media(max-width:640px){.bf-page .closing .closing-copy p{font-size:var(--description-font-size,14px);line-height:var(--description-line-height,21px)}}

/* Product layout illustrations: actual app feature placement, landing-page palette. */
.bf-page #create .app-preview{position:relative;display:block;width:100%;aspect-ratio:436/350;height:auto;padding:16px;border:1px solid #e8dff9;border-radius:14px;background:#f8f5fe;overflow:hidden;color:#190952;font:10px/1.35 "BF Inter",Inter,Arial,sans-serif;box-shadow:0 6px 20px #7533ff08}
.app-preview *{box-sizing:border-box}.app-preview label{display:block;color:#76659d;font-size:8px;letter-spacing:.9px;font-weight:600}.app-preview b{font-weight:600!important}.app-preview .is-selected{color:#7533ff;background:#e9ddff;border-color:#b995ff!important}.app-stepper{display:flex;align-items:center;gap:10px;color:#a096b4;font-size:10px;font-weight:600}.app-stepper i{height:1px;flex:1;background:#e8dff9}.app-stepper .is-current{color:#7533ff}
.app-portrait{display:flex;flex-direction:column;align-items:center;margin:12px auto 13px;gap:3px}.bf-page #create .app-portrait img{position:static;width:48px;height:62px;border:1.5px solid #b995ff;border-radius:8px;object-fit:cover;object-position:center 15%}.app-portrait>span{font-size:9px;color:#76659d}.app-portrait small{font-size:8px;color:#7533ff}.app-persona-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px 8px;background:#ffffffa6;border:1px solid #e8dff9;padding:12px;border-radius:10px}.app-field label{margin-bottom:5px}.app-field label small{float:right;letter-spacing:0}.app-field>div{border:1px solid #e8dff9;border-radius:6px;background:white;padding:7px 8px;min-height:27px;font-size:9px}.app-field.app-full{grid-column:1/-1}.app-field>.app-segments{display:flex;padding:0;border:0;gap:4px;background:transparent}.app-segments span{flex:1;padding:7px 2px;text-align:center;border:1px solid #e8dff9;border-radius:6px;font-size:8px;white-space:nowrap}.app-tags{display:flex;align-items:center;gap:6px}.app-tags>span{border-radius:10px;background:#e9ddff;color:#7533ff;padding:3px 6px;font-size:8px}.app-tags em{color:#a096b4;font-size:8px;font-style:normal}.app-field>.app-about{color:#76659d;font-size:9px;line-height:1.5;min-height:42px}
.app-voice-layout{display:grid;grid-template-columns:1.9fr 1fr;gap:10px;margin-top:16px}.app-library{min-width:0}.app-mode{display:flex;gap:6px;margin-bottom:10px;font-size:8px}.app-mode span{border:1px solid #e8dff9;border-radius:12px;padding:4px 8px;background:#fff}.app-library-heading{display:flex;justify-content:space-between;font-size:8px;font-weight:600;letter-spacing:.8px;margin-bottom:10px}.app-library-heading>span{letter-spacing:0;color:#76659d}.app-voice-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.app-voice{display:flex;align-items:center;gap:5px;min-width:0;padding:8px 5px;background:#fff;border:1px solid #e8dff9;border-radius:8px;min-height:50px}.app-voice>i{width:22px;height:22px;flex-shrink:0;border-radius:50%;background:radial-gradient(circle at 30% 25%,hsl(var(--voice-hue) 65% 88%),hsl(var(--voice-hue) 35% 56%))}.app-voice>span:nth-child(2){min-width:0}.app-voice b{font-size:8px;display:block}.app-voice small{font-size:6px;line-height:1.3;color:#887b9b;display:block}.app-play{font-size:10px;color:#9970d1;margin-left:auto}.app-tuning{align-self:start;background:#ffffffb8;border:1px solid #e8dff9;border-radius:12px;padding:12px 10px;margin-top:28px}.app-wave{height:62px;display:flex;align-items:center;justify-content:center;gap:2px;border:1px solid #eee7fa;border-radius:8px;background:#f7f1ff;margin:9px 0 18px;overflow:hidden}.app-wave i{width:2px;flex-shrink:0;border-radius:2px;background:#a275f0}.app-slider-label{display:flex;justify-content:space-between;font-size:8px;color:#887b9b;margin:14px 0 8px}.app-slider-label b{color:#7533ff}.app-slider{height:3px;background:linear-gradient(to right,#a275f0 50%,#e8dff9 50%);position:relative;border-radius:3px;margin-bottom:10px}.app-slider i{position:absolute;left:50%;top:-3px;width:9px;height:9px;border-radius:50%;background:#a275f0}
.bf-page #create .app-chat-preview{padding:0;background:#f1e9fb}.bf-page #create .app-chat-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 18%;opacity:.23;filter:saturate(.65)}.app-chat-content{position:relative;z-index:1;height:100%;padding:14px;display:flex;flex-direction:column}.app-intro{padding:8px 10px;background:#ffffffc9;border:1px solid #e5d8f5;border-radius:8px;font-size:8px;line-height:1.5;margin-top:5px;color:#625278}.app-chat-name{display:flex;align-items:center;gap:6px;margin-top:9px;font-size:8px}.bf-page #create .app-chat-name img{position:static;width:19px;height:19px;object-fit:cover;border-radius:50%}.app-chat-name>span{color:#9970d1}.app-chat-bubble{margin:5px 0 0 24px;max-width:85%;padding:9px 11px;background:#ffffffdc;border:1px solid #e4d7f4;border-radius:2px 10px 10px;font-size:8px;line-height:1.55}.app-chat-bubble strong{color:#7533ff;font-weight:500}.app-chat-bubble.app-short{padding-block:8px}.app-chat-tools{display:flex;gap:5px;flex-wrap:wrap;margin-top:auto;padding-top:10px}.app-chat-tools span{padding:3px 5px;border:1px solid #dcccfa;background:#ffffffe0;border-radius:10px;color:#76659d;font-size:6px}.app-message-placeholder{display:flex;align-items:center;justify-content:space-between;margin-top:7px;min-height:28px;padding:5px 8px;border:1px solid #dcccfa;background:#ffffffe0;border-radius:6px;font-size:8px;color:#887b9b}.app-message-placeholder span{color:#7533ff;font-size:14px}
@media(min-width:641px) and (max-width:1000px){.bf-page #create .app-preview{padding:10px;aspect-ratio:436/410}.app-persona-fields{padding:8px;gap:7px}.app-voice-layout{grid-template-columns:1.9fr 1fr;gap:6px;margin-top:10px}.app-tuning{padding:9px 6px}.app-voice{padding-inline:3px;gap:3px}.app-voice>i{width:16px;height:16px}.app-voice b{font-size:7px}.app-voice small{font-size:6px}.app-wave{gap:1px}.app-wave i{width:1px}.app-voice{min-height:43px}.app-portrait{margin-block:8px}.app-field>.app-about{font-size:8px}.app-chat-content{padding:10px}.app-chat-bubble{font-size:7px}.app-chat-tools{gap:3px}}
@media(max-width:640px){.bf-page #create .app-preview{aspect-ratio:436/350}}


body.ai-boyfriend-page .bf-page .faq-question{color:#190952!important;background:white!important;background-image:none!important;box-shadow:none!important;border-radius:0!important}body.ai-boyfriend-page .bf-page .faq-question b{font:inherit!important}body.ai-boyfriend-page .bf-page .person-option{box-shadow:none!important}
body.ai-boyfriend-page #main .faq-question{font-size:16px!important;line-height:1.3!important;font-weight:600!important}body.ai-boyfriend-page #conversation .person-option{font-size:13px!important;line-height:1!important}body.ai-boyfriend-page #main .preview-menu-action{font-size:14px!important}@media(max-width:640px){body.ai-boyfriend-page #main .faq-question{font-size:14px!important}body.ai-boyfriend-page #conversation .person-option{font-size:14px!important}}
/* Staging: isolate host section defaults; retain local spacing. */
body.ai-boyfriend-page .bf-page>section{padding:0!important}body.ai-boyfriend-page .bf-page #features{background:transparent!important}body.ai-boyfriend-page{background:#fcfbfe!important}body.ai-boyfriend-page .header{background:linear-gradient(110deg,rgba(255,244,251,.92),rgba(243,239,255,.92) 58%,rgba(238,243,255,.92))!important;border:1px solid rgba(255,255,255,.61)!important;box-shadow:0 10px 32px rgba(53,35,68,.05)!important}body.ai-boyfriend-page .header .links a[aria-current],body.ai-boyfriend-page .header .links a.active{background:transparent!important;box-shadow:none!important}body.ai-boyfriend-page .header .links a::after{display:none!important}body.ai-boyfriend-page .header .links a{color:#41364f!important;text-decoration:none!important}
body.ai-boyfriend-page .header .brand{font-size:25px!important;font-weight:800!important;gap:10px!important;letter-spacing:-1px}body.ai-boyfriend-page .header .brand-logo{display:grid!important;place-items:center;overflow:hidden!important;width:36px!important;height:36px!important;flex:0 0 36px;background:white;border-radius:10px}body.ai-boyfriend-page .header .brand-logo img{width:160%!important;max-width:none!important;height:auto!important;object-fit:cover!important}body.ai-boyfriend-page .header .nav{min-height:78px!important}body.ai-boyfriend-page .header .links{gap:24px!important}body.ai-boyfriend-page .header .links a{font-size:16px!important;font-weight:600!important;padding:10px 18px!important}body.ai-boyfriend-page .header .links a[aria-current]::before{display:none!important}@media(max-width:767px){body.ai-boyfriend-page .header .brand{font-size:18px!important}body.ai-boyfriend-page .header .nav{min-height:64px!important}}
body.ai-boyfriend-page #conversation .person-option{color:var(--color-text-2)!important}body.ai-boyfriend-page #conversation .person-option.active{color:var(--color-brand)!important}
/* Match the production mobile header and isolate host decorations. */
body.ai-boyfriend-page #features::before{content:none!important;display:none!important}
body.ai-boyfriend-page .header .brand-logo{position:relative!important}
body.ai-boyfriend-page .header .brand-logo img{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;width:160%!important;height:160%!important;object-fit:cover!important}
body.ai-boyfriend-page #faq .faq-question>span{display:grid!important;place-items:center;width:16px!important;height:16px!important;flex:0 0 16px!important;font-size:0!important;transform:none!important}
body.ai-boyfriend-page #faq .faq-question>span::after{content:"";display:block;width:7px;height:7px;border-right:1.8px solid #7540df;border-bottom:1.8px solid #7540df;transform:rotate(45deg);margin-top:-4px}
body.ai-boyfriend-page #faq .faq-item.open .faq-question>span::after{transform:rotate(225deg);margin-top:4px}
@media(max-width:767px){
body.ai-boyfriend-page .header .nav{min-height:58px!important;gap:8px!important;grid-template-columns:minmax(0,1fr) auto auto!important}
body.ai-boyfriend-page .header .brand{font-size:15px!important;gap:6px!important;letter-spacing:-.5px!important;min-width:0}
body.ai-boyfriend-page .header .brand-logo{width:29px!important;height:29px!important;flex:0 0 29px!important}
body.ai-boyfriend-page .header .sign{min-height:40px!important;height:40px!important;padding:8px 10px!important;font-size:11px!important;line-height:18.7px!important;border-radius:999px!important;white-space:nowrap}
body.ai-boyfriend-page .header .menu{display:grid!important;place-items:center;width:36px!important;min-width:36px!important;max-width:36px!important;height:36px!important;min-height:36px!important;padding:0!important;border-radius:12px!important;font-size:20px!important;line-height:34px!important;box-shadow:none!important}
}
@media(max-width:640px){body.ai-boyfriend-page #faq .faq-intro{padding:0 16px!important}body.ai-boyfriend-page #faq .faq-spark{right:0!important}}

/* Preserve local mobile hero gutters and production dropdown rhythm. */
@media(max-width:640px){body.ai-boyfriend-page .bf-page>section.hero-scene{padding:0 18px!important}}
@media(max-width:767px){
body.ai-boyfriend-page .header .nav{padding:8px 10px!important;height:58px!important;min-height:58px!important}
body.ai-boyfriend-page .header .links{top:66px!important;padding:8px!important;gap:2px!important;height:auto!important;min-height:0!important;border:0!important;border-radius:16px!important}
body.ai-boyfriend-page .header .links a{font-size:14px!important;line-height:19.6px!important;min-height:40px!important;height:40px!important;padding:10px 14px!important;display:block!important}
}

/* Footer follows the published site's shared component treatment. */
body.ai-boyfriend-page footer{background:#faf9fc!important;padding:64px 0 0!important;overflow:hidden}
body.ai-boyfriend-page footer .brand{font-size:28px!important;font-weight:800!important;line-height:1.7!important;gap:10px!important}
body.ai-boyfriend-page footer .brand-logo{position:relative;display:block!important;width:36px!important;height:36px!important;flex:0 0 36px!important;overflow:hidden!important;border-radius:10px;background:white}
body.ai-boyfriend-page footer .brand-logo img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:160%!important;height:160%!important;max-width:none!important;object-fit:cover}
body.ai-boyfriend-page footer .socials{gap:10px!important;margin-top:28px!important;flex-wrap:wrap}
body.ai-boyfriend-page footer .socials a{width:42px!important;height:42px!important;border:1px solid #e6dfef!important;border-radius:13px!important;background:white!important;box-shadow:0 3px 8px rgba(37,23,55,.016)!important}
body.ai-boyfriend-page footer .copyright{border-top:1px solid #e5dfeb!important;margin-top:60px!important;padding:24px 0 28px!important}
@media(max-width:767px){body.ai-boyfriend-page footer{padding-top:48px!important}body.ai-boyfriend-page footer .footer-grid{gap:32px!important}body.ai-boyfriend-page footer .copyright{margin-top:36px!important}}

/* Preserve production social-link interactive states over base overrides. */
body.ai-boyfriend-page footer .socials a:hover,body.ai-boyfriend-page footer .socials a:focus-visible{background:#895aff!important;border-color:#895aff!important;color:#fff!important;box-shadow:0 7px 18px rgba(137,90,255,.2)!important}
body.ai-boyfriend-page footer .socials a:hover svg,body.ai-boyfriend-page footer .socials a:focus-visible svg{color:#fff!important}

/* Use the production logo asset with its native aspect ratio. */
body.ai-boyfriend-page .header .brand-logo,body.ai-boyfriend-page footer .brand-logo{display:grid!important;place-items:center!important}body.ai-boyfriend-page .header .brand-logo img,body.ai-boyfriend-page footer .brand-logo img{position:static!important;left:auto!important;top:auto!important;transform:none!important;height:auto!important;width:160%!important}