.brand-header { display:flex; justify-content:center; align-items:center; padding:18px 20px; background:#fff0f7; border-bottom:1px solid #ffcada; }
.brand-header__logo { display:block; line-height:0; }
.brand-header__logo img { display:block; width:215px; height:auto; }
.brand-skip { position:absolute; left:16px; top:8px; transform:translateY(-200%); z-index:10; padding:10px 16px; background:white; color:#131313; }
.brand-skip:focus { transform:none; }
.influencers { background:#fff0f7; color:#131313; padding:48px 0 36px; font-family:Poppins,sans-serif; border-bottom:1px solid #ffcada; }
.influencers__heading { display:flex; align-items:center; justify-content:space-between; gap:16px; max-width:1240px; padding:0 20px; margin:0 auto 24px; }
.influencers__heading h2 { margin:0; font:700 clamp(24px,3vw,34px)/1.2 Poppins,sans-serif; letter-spacing:-.025em; }
.influencers__navigation { display:flex; gap:8px; flex-shrink:0; }
.influencers__arrow { display:grid; place-items:center; width:40px; height:40px; border:1px solid #e9b4c7; border-radius:50%; background:white; color:#131313; cursor:pointer; }
.influencers__arrow svg { width:18px; height:18px; }
.influencers__arrow:disabled { opacity:.35; cursor:default; }
.influencers__track { position:relative; display:flex; align-items:stretch; gap:20px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scroll-padding-inline:20px; padding:4px 20px 20px; margin:0 auto; max-width:1240px; list-style:none; scrollbar-width:thin; scrollbar-color:#e6a5bd #ffe3ee; }
.influencer-card { flex:0 0 calc((100% - 60px)/4); min-width:0; scroll-snap-align:start; border:1px solid #f0cdda; border-radius:18px; overflow:hidden; background:#fff; box-shadow:0 5px 16px #6c28450c; }
.influencer-card:focus-within { border-color:#a64166; }
.creator-header { display:flex; align-items:center; gap:10px; padding:14px 12px; min-height:70px; }
.creator-avatar { display:block; width:40px; height:40px; aspect-ratio:1; flex-shrink:0; border-radius:50%; background-repeat:no-repeat; background-color:#f6e4ea; overflow:hidden; outline:1px solid #efccda; outline-offset:2px; }
.influencers__disclosure { max-width:1240px; margin:-12px auto 20px; padding:0 20px; color:#775460; font:400 12px/1.6 Poppins,sans-serif; }
.creator-identity { min-width:0; flex:1; }
.creator-identity h3 { margin:0; color:#171217; font:600 13px/1.45 Poppins,sans-serif; overflow-wrap:anywhere; }
.creator-kind,.creator-handle,.creator-followers { display:block; color:#806571; font:400 10px/1.6 Poppins,sans-serif; overflow-wrap:anywhere; }
.creator-platform { flex-shrink:0; display:grid; place-items:center; width:27px; height:27px; border-radius:7px; color:#151015; }
.creator-platform svg { width:23px; height:23px; filter:drop-shadow(1px 1px 0 #f3a9c5); }
.influencer-card__media { position:relative; aspect-ratio:9/16; background:#171216; isolation:isolate; }
.influencer-card video { display:block; width:100%; height:100%; aspect-ratio:9/16; object-fit:contain; background:#171216; }
.creator-tap { position:absolute; inset:0; width:100%; height:100%; display:grid; place-items:center; padding:0; border:0; background:linear-gradient(transparent 65%,#0009); color:white; cursor:pointer; }
.creator-tap>svg { width:60px; height:60px; padding:15px; border-radius:50%; background:#19101966; border:1px solid #fffb; filter:drop-shadow(0 2px 6px #0004); }
.is-playing .creator-tap>svg { opacity:0; }
.creator-tap:focus-visible { outline:3px solid white; outline-offset:-5px; }
.creator-controls { position:absolute; bottom:14px; left:12px; right:12px; display:flex; align-items:center; gap:7px; z-index:2; }
.creator-control { display:grid; place-items:center; flex-shrink:0; width:34px; height:34px; border:1px solid #ffffff50; border-radius:50%; background:#17121680; color:white; cursor:pointer; padding:8px; }
.creator-control svg { display:block; width:17px; height:17px; }
.creator-control:hover { background:#171216d9; }
.creator-control:focus-visible { outline:2px solid white; outline-offset:3px; }
.creator-control-spacer { flex:1; }
.creator-progress { position:absolute; z-index:2; bottom:0; left:0; right:0; height:3px; background:#ffffff38; pointer-events:none; }
.creator-progress span { display:block; width:100%; height:100%; transform:scaleX(0); transform-origin:left; background:#fff; }
.influencer-status { position:absolute; top:12px; left:12px; right:12px; z-index:3; margin:0; padding:9px 12px; border-radius:10px; font-size:12px; line-height:1.5; text-align:center; color:white; background:#171216df; pointer-events:none; }
.creator-caption { padding:14px 14px 12px; }
.creator-caption p { margin:0; min-height:38px; color:#34232c; font:400 12px/19px Poppins,sans-serif; }
.creator-meta { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:14px; color:#9a7d89; font:500 9px/1.4 Poppins,sans-serif; letter-spacing:.08em; }
.influencers__hint { margin:16px 20px 0; text-align:center; font:400 12px/1.5 Poppins,sans-serif; color:#775460; }
.influencer-card__media:fullscreen { display:flex; align-items:center; justify-content:center; width:100%; height:100%; aspect-ratio:auto; }
.influencer-card__media:fullscreen video { width:100%; height:100%; object-fit:contain; }
@media(max-width:989px) {
 .influencer-card { flex-basis:calc((100% - 40px)/3); }
 .brand-header { padding:16px 20px; }
 .brand-header__logo img { width:125px; }
}
@media(max-width:719px) {
 .influencers { padding:32px 0 28px; }
 .influencers__heading { margin-bottom:20px; gap:8px; }
 .influencers__heading h2 { font-size:24px; }
 .influencers__arrow { width:34px; height:34px; }
 .influencers__track { gap:14px; }
 .influencer-card { flex-basis:82%; max-width:340px; }
 .creator-header { padding:14px; }
 .creator-identity h3 { font-size:14px; }
 .creator-kind,.creator-handle,.creator-followers { font-size:11px; }
 .creator-control { width:40px; height:40px; }
 .creator-caption p { font-size:13px; line-height:20px; }
}
