/* BeeSquad waitlist — palette editable rapidement depuis les variables suivantes. */
:root { --bee-primary: #ffd34d; --bee-primary-hover: #ffe58a; --bee-secondary: #14cfe0; --bee-background: #08131f; --bee-surface: #102838; --bee-paper: #f5f1e7; --bee-ink: #08131f; --bee-muted: #a7bbc4; --bee-line: rgba(245,241,231,.16); --bee-error: #bd5545; --font-display: "Aptos Display", "Segoe UI", Arial, sans-serif; --font-body: "Aptos", "Segoe UI", Arial, sans-serif; --ease: cubic-bezier(.23,1,.32,1); }
* { box-sizing: border-box; } html { scroll-behavior: smooth; background: var(--bee-background); } body { margin: 0; color: var(--bee-paper); background: var(--bee-background); font: 16px/1.5 var(--font-body); } a { color: inherit; text-decoration: none; } button, input, select { font: inherit; } button, a { -webkit-tap-highlight-color: transparent; } .skip-link { position: fixed; z-index: 100; top: -100px; left: 16px; padding: 10px 13px; color: var(--bee-ink); background: var(--bee-primary); }.skip-link:focus { top: 16px; }.site-header { position: sticky; z-index: 20; top: 0; height: 76px; padding: 0 clamp(18px,4vw,64px); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(245,241,231,.1); background: rgba(8,19,31,.9); backdrop-filter: blur(16px); }.brand { display: inline-flex; align-items: center; gap: 9px; font: 750 20px/1 var(--font-display); letter-spacing: -.06em; }.brand img { width: 35px; height: 35px; object-fit: contain; }.brand > span > span { color: var(--bee-primary); }.header-actions { display: flex; align-items: center; gap: 18px; }.language-switch { display: flex; border-bottom: 1px solid rgba(245,241,231,.3); }.language-button { padding: 7px 8px; border: 0; color: var(--bee-muted); background: transparent; font: 700 10px/1 var(--font-display); letter-spacing: .12em; cursor: pointer; }.language-button.is-active { color: var(--bee-primary); }.button { min-height: 52px; padding: 14px 20px; border: 1px solid transparent; display: inline-flex; align-items: center; justify-content: center; gap: 16px; cursor: pointer; font: 750 13px/1 var(--font-display); letter-spacing: .01em; transition: transform .18s var(--ease), background .18s var(--ease), color .18s var(--ease); }.button:hover { transform: translateY(-2px); }.button:active { transform: scale(.97); }.button-small { min-height: 39px; padding: 10px 14px; color: var(--bee-ink); background: var(--bee-primary); font-size: 11px; }.button-primary { width: 100%; color: var(--bee-ink); background: var(--bee-primary); }.button-primary:hover { background: var(--bee-primary-hover); }.button-outline { color: var(--bee-paper); border-color: var(--bee-primary); }.button-outline:hover { color: var(--bee-ink); background: var(--bee-primary); }.hero { position: relative; overflow: hidden; border-bottom: 1px solid var(--bee-line); }.hero-image { position: absolute; inset: 0; background: linear-gradient(90deg, var(--bee-background) 0%, rgba(8,19,31,.96) 36%, rgba(8,19,31,.4) 100%), linear-gradient(0deg,var(--bee-background) 0%,transparent 42%), url("/manus-storage/beesquad-hero-radar_368d54fc.jpg") center/cover no-repeat; }.hero-image::after { content:""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg,transparent 0 9.8%,rgba(245,241,231,.08) 10% 10.1%); opacity: .75; }.hero-grid { position: relative; z-index: 1; max-width: 1270px; min-height: 690px; margin: auto; padding: 94px clamp(18px,5vw,70px) 76px; display: grid; grid-template-columns: minmax(0,1fr) minmax(350px,.7fr); align-items: center; gap: clamp(45px,9vw,150px); }.eyebrow { display: flex; align-items: center; gap: 8px; margin: 0 0 20px; color: var(--bee-primary); font: 700 10px/1.2 var(--font-display); letter-spacing: .14em; }.eyebrow.dark { color: #5a747c; }.status-dot { width: 7px; height: 7px; display: inline-block; border-radius: 50%; background: var(--bee-primary); box-shadow: 0 0 0 4px rgba(255,211,77,.15); }.hero h1, h2 { margin: 0; font-family: var(--font-display); font-weight: 750; letter-spacing: -.065em; line-height: .96; }.hero h1 { max-width: 750px; font-size: clamp(47px,6vw,84px); }.hero h1 em, h2 em { color: var(--bee-primary); font-style: normal; }.hero-lede { max-width: 670px; margin: 24px 0 0; color: #c7d6db; font-size: clamp(16px,1.45vw,20px); }.benefit-strip { display: flex; gap: clamp(14px,3vw,36px); max-width: 650px; margin: 36px 0 22px; padding: 21px 0; border-top: 1px solid var(--bee-line); border-bottom: 1px solid var(--bee-line); }.benefit-strip div { display: grid; gap: 3px; }.benefit-strip strong { font: 750 17px/1 var(--font-display); letter-spacing: -.04em; }.benefit-strip span { color: var(--bee-muted); font-size: 11px; }.text-link { display: inline-flex; gap: 10px; color: var(--bee-primary); font: 700 12px/1 var(--font-display); }.text-link b { font-size: 17px; }.waitlist-card { width: min(100%,430px); justify-self: end; padding: 27px; color: var(--bee-ink); background: var(--bee-paper); box-shadow: 16px 18px 0 rgba(255,211,77,.18), 0 30px 70px rgba(0,0,0,.34); }.card-topline { display: flex; justify-content: space-between; color: #597078; font: 700 10px/1 var(--font-display); letter-spacing: .11em; }.card-honey { color: #dd980e; font-size: 24px; line-height: .5; }.waitlist-card h2 { margin-top: 18px; font-size: 31px; color: var(--bee-ink); }.waitlist-card > p { margin: 12px 0 20px; color: #5b6e72; font-size: 13px; }.form-grid { display: grid; gap: 13px; }.two-columns { grid-template-columns: 1fr 1fr; }.waitlist-card label:not(.consent) { display: block; margin-bottom: 13px; }.waitlist-card label > span:first-child { display: block; margin-bottom: 7px; color: #4b626a; font: 700 9px/1 var(--font-display); letter-spacing: .1em; text-transform: uppercase; }.waitlist-card input:not([type="checkbox"]), .waitlist-card select { width: 100%; height: 46px; padding: 0 11px; color: var(--bee-ink); border: 1px solid #bdc7bf; border-radius: 0; background: #fffefa; outline: 0; font-size: 12px; }.waitlist-card input:focus, .waitlist-card select:focus { border-color: #d69008; box-shadow: 0 0 0 3px rgba(214,144,8,.16); }.waitlist-card select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #4b626a 50%), linear-gradient(135deg,#4b626a 50%,transparent 50%); background-position: calc(100% - 15px) 19px,calc(100% - 10px) 19px; background-size: 5px 5px; background-repeat: no-repeat; }.consent { display: flex; align-items: flex-start; gap: 8px; margin: 4px 0 17px; color: #52666c; font-size: 10px; line-height: 1.45; cursor: pointer; }.consent input { position: absolute; opacity: 0; }.checkbox-ui { width: 15px; height: 15px; flex: 0 0 15px; border: 1px solid #8b9b98; background: white; }.consent input:checked + .checkbox-ui { border-color: #d69008; background: var(--bee-primary) center/10px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%2308131f' d='m6.1 12.2-4-4 1.4-1.4 2.6 2.6 6.3-6.3 1.4 1.4z'/%3E%3C/svg%3E"); }.form-note { margin: 12px 0 0 !important; color: #6e7d7d !important; font-size: 10px !important; text-align: center; }.form-status { min-height: 1.4em; margin: 9px 0 0; color: #166357; font-size: 11px; text-align: center; }.form-status.is-error { color: var(--bee-error); }.count-bar { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 28px; max-width: 1270px; margin: auto; padding: 21px clamp(18px,5vw,70px); border-top: 1px solid var(--bee-line); }.count-wrap { display: flex; align-items: baseline; gap: 8px; }.count-label { color: var(--bee-primary); font: 700 10px/1 var(--font-display); letter-spacing: .12em; }.count-wrap strong { font: 750 27px/1 var(--font-display); letter-spacing: -.07em; }.count-plus { color: var(--bee-primary); }.count-wrap > span:last-child { color: var(--bee-muted); font-size: 12px; }.count-pips { display: flex; gap: 8px; }.count-pips i { width: 9px; height: 9px; border: 1px solid rgba(255,211,77,.5); transform: rotate(30deg); }.count-pips i:nth-child(-n+5) { background: var(--bee-primary); }.section { padding: 112px max(18px,calc((100vw - 1140px)/2)); }.member-value { color: var(--bee-ink); background: var(--bee-paper); }.section-intro { max-width: 760px; }.section h2 { font-size: clamp(40px,5.2vw,72px); }.member-value h2 em { color: #d5910a; }.value-grid { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 50px; border-top: 1px solid rgba(8,19,31,.18); border-left: 1px solid rgba(8,19,31,.18); }.value-card { position: relative; min-height: 290px; padding: 25px; display: flex; flex-direction: column; border-right: 1px solid rgba(8,19,31,.18); border-bottom: 1px solid rgba(8,19,31,.18); transition: transform .2s var(--ease),background .2s var(--ease); }.value-card:hover { transform: translateY(-5px); background: #fffaf0; }.value-card.featured { background: #efe4bf; }.value-index { color: #cf900d; font: 700 12px/1 var(--font-display); }.value-icon { width: 42px; height: 42px; margin: auto 0 17px; display: grid; place-items: center; color: var(--bee-ink); background: var(--bee-primary); font-size: 24px; }.value-card h3 { margin: 0 0 8px; font: 750 23px/1.06 var(--font-display); letter-spacing: -.05em; }.value-card p { max-width: 260px; margin: 0; color: #53666b; font-size: 14px; }.how-it-works { display: grid; grid-template-columns: minmax(270px,.8fr) minmax(0,1.2fr); gap: clamp(55px,10vw,160px); background: var(--bee-surface); }.how-it-works h2 { font-size: clamp(43px,4.8vw,68px); }.flow-side > p:not(.eyebrow) { max-width: 390px; color: #b3c6cc; margin: 23px 0 0; font-size: 16px; }.flow-list { border-top: 1px solid var(--bee-line); }.flow-list article { display: grid; grid-template-columns: 50px 1fr 28px; gap: 12px; align-items: center; padding: 24px 0; border-bottom: 1px solid var(--bee-line); }.step-number { color: var(--bee-primary); font: 700 12px/1 var(--font-display); }.flow-list h3 { margin: 0 0 5px; font: 700 21px/1.1 var(--font-display); letter-spacing: -.045em; }.flow-list p { margin: 0; color: var(--bee-muted); font-size: 13px; }.step-arrow { color: var(--bee-primary); font-size: 20px; text-align: right; }.invitation-banner { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 35px; padding-top: 95px; padding-bottom: 95px; background: linear-gradient(110deg,#0b1f2d,#0b3641); }.invitation-banner::after { content:""; position:absolute; width:470px; height:470px; right:-160px; top:-190px; border:1px solid rgba(255,211,77,.24); border-radius:50%; box-shadow:0 0 0 55px rgba(255,211,77,.035),0 0 0 110px rgba(255,211,77,.025); }.invitation-banner > * { position:relative; z-index:1; }.invitation-banner h2 { font-size: clamp(42px,5vw,69px); }.site-footer { padding: 29px max(18px,calc((100vw - 1140px)/2)); display: flex; align-items: center; justify-content: space-between; gap: 22px; color: #9ab0b8; border-top: 1px solid var(--bee-line); font-size: 11px; }.site-footer .brand { font-size: 16px; }.site-footer .brand img { width: 27px; height: 27px; }.site-footer p { margin: 0; }.site-footer nav { display: flex; gap: 18px; }.site-footer nav a:hover { color: var(--bee-primary); }.modal[hidden] { display:none; }.modal { position:fixed; z-index:50; inset:0; display:grid; place-items:center; padding:18px; }.modal-backdrop { position:absolute; inset:0; background:rgba(8,19,31,.84); backdrop-filter:blur(7px); }.modal-card { position:relative; z-index:1; width:min(100%,565px); padding:clamp(27px,5vw,45px); color:var(--bee-ink); background:var(--bee-paper); box-shadow:15px 15px 0 rgba(255,211,77,.28); }.modal-close { position:absolute; top:14px; right:17px; width:32px; height:32px; border:0; color:var(--bee-ink); background:transparent; font-size:27px; cursor:pointer; }.modal-mark img { width:48px; height:48px; }.modal-card .eyebrow { margin-top:20px; }.modal-card h2 { font-size:clamp(35px,5vw,52px); }.modal-card h2 em { color:#d5900a; }.modal-card > p:not(.eyebrow) { color:#56696e; margin:17px 0 22px; }.referral-link { display:flex; border:1px solid #b5c0b8; background:#fffefa; }.referral-link input { min-width:0; height:48px; flex:1; padding:0 11px; border:0; color:#44575d; background:transparent; font-size:12px; }.referral-link button { min-width:80px; border:0; color:var(--bee-ink); background:var(--bee-primary); font:700 12px/1 var(--font-display); cursor:pointer; }.share-label { margin:22px 0 10px !important; color:#52666c !important; font:700 10px/1 var(--font-display); letter-spacing:.1em; text-transform:uppercase; }.share-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }.share-button { min-height:49px; display:flex; align-items:center; justify-content:center; gap:7px; color:white; font:700 11px/1 var(--font-display); }.share-button.linkedin { background:#0a66c2; }.share-button.x { background:#101010; }.share-button.whatsapp { background:#27a65a; }.share-button.email { color:var(--bee-ink); background:#d9dfd8; }.share-button:hover { filter:brightness(1.08); } #viral-loops-widget:empty { display:none; } @media (max-width:900px) { .hero-grid { grid-template-columns:1fr; gap:45px; padding-top:70px; }.waitlist-card { justify-self:start; margin-left:5vw; }.how-it-works { grid-template-columns:1fr; }.flow-side { max-width:650px; }.section { padding-top:84px; padding-bottom:84px; } } @media (max-width:620px) { .site-header { height:67px; padding:0 15px; }.brand { font-size:17px; }.brand img { width:30px; height:30px; }.header-actions { gap:8px; }.button-small { display:none; }.hero-grid { min-height:0; padding:66px 18px 46px; }.hero h1 { font-size:47px; }.hero-lede { font-size:15px; }.benefit-strip { gap:12px; }.benefit-strip strong { font-size:15px; }.benefit-strip span { font-size:9px; }.waitlist-card { width:calc(100% - 11px); margin-left:10px; padding:20px; }.waitlist-card h2 { font-size:28px; }.two-columns { grid-template-columns:1fr; gap:0; }.count-bar { align-items:flex-start; flex-direction:column; gap:14px; padding:18px; }.count-wrap { flex-wrap:wrap; gap:6px; }.count-wrap > span:last-child { width:100%; }.count-pips { display:none; }.section { padding:68px 18px; }.section h2 { font-size:41px; }.value-grid { grid-template-columns:1fr; margin-top:35px; }.value-card { min-height:210px; }.how-it-works { gap:45px; }.flow-list article { grid-template-columns:35px 1fr 15px; }.flow-list h3 { font-size:18px; }.invitation-banner { align-items:flex-start; flex-direction:column; }.site-footer { align-items:flex-start; flex-wrap:wrap; }.site-footer nav { width:100%; }.share-grid { grid-template-columns:repeat(2,1fr); }.modal-card { padding:28px 20px; }.modal-card h2 { font-size:37px; } }