
.social-showcase{position:relative;isolation:isolate;display:grid;grid-template-columns:1.08fr 1fr;align-items:center;min-height:850px;padding:65px calc(max(6vw, 24px));overflow:hidden;background:radial-gradient(ellipse at 77% 85%,#eee9fa 0,transparent 33%),linear-gradient(115deg,#f8f8fa,#fff 54%,#f5f5f8);color:#070c13;scroll-margin-top:70px}
.social-copy{position:relative;z-index:2;padding-bottom:20px}
.social-copy h2{margin:0;font-size:calc(clamp(56px, 6.4vw, 104px));line-height:.98;font-weight:900;letter-spacing:-.065em;white-space:nowrap}
.social-copy h2>span{background:linear-gradient(105deg,#6345fa 4%,#b62ce6 31%,#ff287c 56%,#ff6a18 79%,#ffb500);background-clip:text;-webkit-background-clip:text;color:transparent}
.social-description{margin:28px 0 36px;font-size:calc(clamp(17px, 1.8vw, 27px));line-height:1.45;letter-spacing:-.025em;color:#424650}
.social-platforms{display:flex;flex-wrap:wrap;gap:calc(clamp(12px, 1.6vw, 24px));align-items:center}
.social-platforms .social-platform{display:grid;place-items:center;flex:0 0 auto;width:calc(clamp(45px, 4.5vw, 62px));height:calc(clamp(45px, 4.5vw, 62px));border-radius:50%;color:#fff;box-shadow:inset 0 0 0 1px #ffffff30,0 5px 12px #26213415;transition:transform .25s,box-shadow .25s}
.social-platforms svg{width:51%;height:51%;display:block}
.social-platforms .social-platform:hover{transform:translateY(-5px) rotate(-6deg);box-shadow:inset 0 0 0 1px #ffffff30,0 9px 18px #26213428}
.social-platforms a:focus-visible{outline:3px solid #7755e7;outline-offset:5px}
.social-platforms .social-instagram{background:radial-gradient(circle at 28% 105%,#ffda76 3%,#ff7a32 28%,#ec296b 52%,#aa32ba 75%,#674be2)}
.social-platforms .social-facebook{background:linear-gradient(145deg,#438bff,#1554cc)}
.social-platforms .social-tiktok{background:#11151b}.social-tiktok svg{filter:drop-shadow(-1px -1px 0 #25e5df) drop-shadow(1px 1px 0 #ff477b)}
.social-platforms .social-youtube{background:linear-gradient(145deg,#ff3e59,#e71329)}
.social-platforms .social-linkedin{background:linear-gradient(145deg,#159bd5,#0865a9)}
.social-platforms .social-x{background:linear-gradient(145deg,#30343e,#080c13)}
.social-work-link{position:relative;display:block;width:max-content;margin:48px 0 0 30px;font-family:Caveat,cursive;font-weight:500;font-size:calc(clamp(38px, 4.1vw, 65px));line-height:.85;transform:rotate(-8deg)}
.social-work-link>span{display:block;margin:7px 0 0 75px}
.social-work-link>span:after{content:"";display:block;height:13px;border-top:3px solid;border-radius:50%;transform:rotate(-5deg);margin-top:12px}
.social-work-link svg{position:absolute;width:170px;left:calc(100% + 18px);top:8px;transform:rotate(8deg);transition:transform .25s}
.social-work-link:hover svg{transform:translate(8px,-5px) rotate(8deg)}
.phone-feed:focus-visible,.social-work-link:focus-visible{outline:3px solid #7755e7;outline-offset:8px}
.social-stage{position:relative;min-width:0;height:720px;display:grid;place-items:center}
.social-brushes{position:absolute;width:140%;height:123%;max-width:none;left:-19%;top:-13%;pointer-events:none}
.social-phone{position:relative;z-index:2;width:344px;padding:10px;border-radius:53px;background:linear-gradient(110deg,#85868a,#0a0b0d 7%,#111 80%,#656875 93%,#121318);box-shadow:inset 0 0 0 1px #9b9b9c,inset -4px 0 0 2px #545661,9px 9px 0 #22242c,12px 11px 0 #696b76,20px 28px 30px #20222d2b;transform:perspective(1100px) rotateY(-9deg) rotate(9deg);animation:socialPhoneFloat 7s ease-in-out infinite}
.social-phone:after{content:"";position:absolute;right:-7px;top:162px;width:4px;height:69px;border-radius:3px;background:linear-gradient(#aaa,#25262a,#888)}
.social-phone-screen{overflow:hidden;border-radius:43px;background:#f8f8fa;border:2px solid #000}
.phone-status{position:relative;height:47px;padding:17px 26px 0;display:flex;justify-content:space-between;font-size:12px}
.phone-island{position:absolute;left:50%;transform:translateX(-50%);top:10px;width:106px;height:28px;border-radius:30px;background:#030405}
.phone-island:after{content:"";position:absolute;right:13px;top:10px;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle,#183047,#080d17 70%)}
.phone-account{height:49px;display:flex;align-items:center;justify-content:center;gap:25px;font-size:15px;letter-spacing:-.6px;font-style:italic}
.phone-account>span{position:absolute;right:27px;font-style:normal;letter-spacing:1px}
.phone-tabs{display:flex;height:45px;justify-content:space-around;font-size:28px;align-items:center}
.phone-tabs>span:first-child{position:relative}.phone-tabs>span:first-child:after{content:"";position:absolute;width:106px;height:3px;bottom:-8px;left:50%;transform:translateX(-50%);background:#12151b}
.phone-feed{display:block;position:relative;aspect-ratio:3/5;overflow:hidden;background:#11161b;isolation:isolate}
.phone-feed:focus-visible{outline-offset:-4px}
.feed-track{width:100%;display:flex;flex-direction:column}
.feed-track.is-looping{animation:socialFeedScroll 42s linear infinite;will-change:transform}
.feed-grid{display:grid;flex:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;padding-bottom:3px}
@keyframes socialFeedScroll{to{transform:translateY(-50%)}}
.feed-tile{position:relative;aspect-ratio:4/5;overflow:hidden;background:#111720;color:#fff}
.feed-tile>img,.feed-tile>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.feed-tile>video{opacity:0;transition:opacity .4s}.feed-tile>video.is-playing{opacity:1}
.feed-type{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-size:14px;line-height:1.65;letter-spacing:2px;text-transform:uppercase}
.feed-ideas{background:linear-gradient(135deg,#263d4e,#070e17);font-style:italic}
.feed-neon{background:radial-gradient(ellipse at center,#321132,#08090e 75%);font-family:Caveat,cursive;color:#ff89e6;font-size:28px;line-height:1;letter-spacing:0;text-transform:none;text-shadow:0 0 5px #fa41b1,0 0 13px #ed00ba;transform:none}
.feed-built{background:linear-gradient(145deg,#38475a,#0c1521);font-size:16px;line-height:1.1;letter-spacing:1px}.feed-built em{font-family:Caveat,cursive;text-transform:none;font-size:24px;letter-spacing:0}.feed-orbit{width:65px;height:22px;border:1px solid #e6a085;border-radius:50%;transform:rotate(-25deg);margin-top:14px;box-shadow:0 0 8px #e6a08555}
.feed-monogram{font-family:Caveat,cursive;font-size:68px;font-style:italic;color:#ffdaab;text-shadow:0 0 10px #ff9d3d;line-height:1;background:radial-gradient(ellipse at top,#5d514b,#101214 75%)}.feed-monogram>span{font:7px var(--sans);text-shadow:none;text-transform:uppercase;letter-spacing:1px;color:#fff;margin-top:7px}
.feed-reel{position:absolute;right:7px;top:5px;color:#fff;font-size:18px;text-shadow:0 1px 4px #000}
.feed-signature{background:#fff}.feed-signature>img,.feed-signature>video{object-fit:contain}.feed-signature .feed-reel{color:#111;text-shadow:none}
.phone-bottom{height:49px;display:flex;justify-content:space-around;align-items:center;background:#0a0e12;color:#fff;font-size:26px}
.phone-avatar{border:1px solid #bfc1c4;border-radius:50%;width:22px;height:22px;font:italic 18px Caveat,cursive}
.phone-avatar,.phone-home{display:grid;place-items:center}
.phone-home{height:26px;background:#0a0e12}.phone-home:after{content:"";width:110px;background:#f7f7f7;border-radius:4px}
.social-phone-shadow{position:absolute;bottom:0;width:350px;height:32px;border-radius:50%;background:radial-gradient(ellipse,#9c6ece88,transparent 70%);filter:blur(8px)}
.social-showcase.motion-paused .feed-track,.social-showcase.motion-paused .social-phone{animation-play-state:paused}
@keyframes socialPhoneFloat{0%,to{transform:perspective(1100px) rotateY(-9deg) rotate(9deg) translateY(0)}50%{transform:perspective(1100px) rotateY(-7deg) rotate(8deg) translateY(-12px)}}
@media(min-width:1700px){.social-showcase{padding-left:calc(max(6vw, 50vw - 750px));padding-right:calc(max(6vw, 50vw - 750px));min-height:950px}}
@media(max-width:1100px) and (min-width:801px){.social-showcase{padding:55px 5vw;min-height:750px;grid-template-columns:1.08fr 1fr}.social-copy h2{font-size:6.35vw}.social-phone{width:285px;border-radius:47px}.social-phone-screen{border-radius:37px}.social-stage{height:630px}.social-work-link svg{width:100px}.phone-account{font-size:13px}}
@media(max-width:800px){.social-showcase{grid-template-columns:1fr;min-height:0;padding:64px 24px 65px;gap:28px}.social-copy{padding:0;max-width:560px;width:100%;margin:auto}.social-copy h2{font-size:calc(clamp(43px, 9.7vw, 76px));line-height:1.02}.social-description{font-size:calc(clamp(16px, 3.7vw, 22px));margin:22px 0 25px}.social-platforms{gap:23px}.social-platforms>span{width:44px;height:44px;border-radius:11px}.social-linkedin,.social-x{font-size:33px}.social-work-link{margin:30px 0 0 8px;font-size:42px}.social-work-link svg{width:110px;left:calc(100% + 10px);top:0}.social-work-link svg,.social-work-link:hover svg{transform:rotate(45deg)}.social-stage{width:100%;height:650px;max-width:500px;justify-self:center}.social-phone{width:300px}.social-brushes{width:135%;left:-18%;top:-8%;height:115%}.social-phone-shadow{bottom:7px;width:290px}}
@media(max-width:380px){.social-showcase{padding-left:20px;padding-right:20px}.social-platforms{gap:17px}.social-stage{height:580px}.social-phone{width:264px;padding:8px;border-radius:44px}.social-phone-screen{border-radius:36px}.phone-account{font-size:12px}.phone-island{width:88px}.phone-status{padding-left:20px;padding-right:20px}.feed-type{font-size:11px}.feed-neon{font-size:24px}.feed-monogram{font-size:58px}.social-work-link{font-size:37px}.social-work-link svg{width:90px}}
@media(prefers-reduced-motion:reduce){.social-phone{animation:none}.feed-tile>video,.social-work-link svg{transition:none}}
@media(max-width:800px){.social-platforms{gap:calc(clamp(9px, 2.5vw, 20px))}.social-platforms .social-platform{width:calc(clamp(37px, 10vw, 48px));height:calc(clamp(37px, 10vw, 48px));border-radius:50%}}
@media(prefers-reduced-motion:reduce){.feed-track.is-looping{animation:none;will-change:auto}.social-platforms .social-platform{transition:none}}
.social-phone-screen{display:flex;flex-direction:column;aspect-ratio:9/19.5;container-type:inline-size;background:#fff;color:#171717}
.social-phone-screen>div{flex-shrink:0}
.social-phone-screen svg{display:block;width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.social-phone-screen a:focus-visible{outline:2px solid #7755e7;outline-offset:-2px}
.social-phone-screen .phone-status{height:40px;padding:15px 21px 0;font-size:11px}
.phone-status-icons{display:flex;align-items:flex-start;gap:3px}.social-phone-screen .phone-status-icons svg{width:12px;height:12px}.social-phone-screen .phone-status-icons svg:last-child{width:17px}
.social-phone-screen .phone-island{width:31%;height:25px;top:7px}
.social-phone-screen .phone-account{height:32px;padding:0 12px;display:flex;justify-content:space-between;gap:6px;font-size:13px;font-style:normal;font-weight:800;letter-spacing:-.4px}
.phone-account>a{white-space:nowrap}.social-phone-screen .phone-account svg{width:19px;height:19px;flex-shrink:0}
.phone-profile{display:flex;gap:10px;align-items:center;padding:5px 13px}
.phone-story-avatar{display:block;flex:0 0 55px;width:55px;height:55px;padding:2.5px;border-radius:50%;background:linear-gradient(30deg,#ffc947,#ff6638 25%,#df1c80 55%,#8a30cb 85%)}
.phone-story-avatar>span{display:grid;place-items:center;width:100%;height:100%;padding:4px;border:2px solid #fff;border-radius:50%;background:#fff;overflow:hidden}.phone-story-avatar img{width:100%;height:100%;object-fit:contain}
.phone-profile-facts{display:flex;justify-content:space-around;flex:1;gap:6px;text-align:center}.phone-profile-facts>span{display:flex;flex-direction:column;gap:3px;font-size:8px;white-space:nowrap}.phone-profile-facts b{font-size:10px;line-height:1.1}
.phone-bio{display:flex;flex-direction:column;gap:2px;padding:3px 14px 7px;font-size:8px;line-height:1.3}.phone-bio strong{font-size:9px;font-weight:700}.phone-bio a{color:#174c83;font-weight:600}
.phone-profile-actions{display:flex;gap:5px;padding:0 13px 7px}.phone-profile-actions a{flex:1;display:grid;place-items:center;height:25px;border-radius:6px;background:#efefef;font-size:9px;font-weight:700}.phone-profile-actions .phone-follow{background:#3797f0;color:#fff}.phone-profile-actions a:hover{filter:brightness(.95)}
.phone-highlights{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:10px 11px 12px}.phone-highlights a{display:flex;min-width:0;flex-direction:column;align-items:center;gap:6px;font-family:Arial,Helvetica,sans-serif;font-size:9px;font-weight:400;line-height:1.25;letter-spacing:0;color:#262626;white-space:nowrap}.phone-highlights a>span{display:block;flex:none;width:clamp(38px,17cqw,52px);height:auto;aspect-ratio:1;border:1px solid #dbdbdb;padding:2px;border-radius:50%;overflow:hidden;background:#fff}.phone-highlights img{display:block;width:100%;height:100%;aspect-ratio:1;object-fit:cover;border-radius:50%}
.social-phone-screen .phone-tabs{height:34px;border-top:1px solid #eee;border-bottom:1px solid #e4e4e4}.phone-tabs>span{height:100%;flex:1;display:grid;place-items:center;color:#858585}.phone-tabs>span.phone-tab-active{border-bottom:2px solid #171717;color:#171717}.phone-tabs>span:first-child:after{display:none}.social-phone-screen .phone-tabs svg{width:18px;height:18px}
.social-phone-screen .phone-feed{flex:1;min-height:0;aspect-ratio:auto;background:#fff}.feed-grid{gap:2px;padding-bottom:2px}.feed-tile{aspect-ratio:1}.feed-campaign-detail{transform:scale(1.3)}
.social-phone-screen .phone-bottom{height:41px;background:#fff;color:#141414;border-top:1px solid #e6e6e6}.social-phone-screen .phone-bottom svg{width:21px;height:21px}.phone-avatar{width:24px;height:24px;border:1.5px solid #111;padding:2px}.phone-avatar img{width:100%;height:100%;object-fit:contain;border-radius:50%}
.social-phone-screen .phone-home{height:17px;background:#fff}.phone-home:after{background:#171717;width:32%;height:4px}
@media(max-width:380px){.social-phone-screen .phone-status{padding-left:16px;padding-right:16px}.social-phone-screen .phone-account{font-size:11px;padding:0 9px}.phone-profile{padding:4px 10px;gap:6px}.phone-story-avatar{flex-basis:45px;width:45px;height:45px}.phone-profile-facts b{font-size:8px}.phone-profile-facts>span{font-size:7px}.phone-highlights{gap:5px;padding-top:7px}.phone-highlights a{font-size:8px}.phone-bio{font-size:7px}.phone-bio strong{font-size:8px}.phone-profile-actions a{height:22px}}
.social-mobile-arrow,.mobile-social-break{display:none}
.social-work-link .social-click-desktop,.social-work-link .social-click-mobile{font:inherit}
.social-work-link .social-click-mobile{display:none}
@media(max-width:800px){
  .social-work-link .social-click-desktop{display:none}
  .social-work-link .social-click-mobile{display:inline}
  .social-work-link,.social-work-link>span{text-decoration:none}
  .social-work-link>span::after{clip-path:inset(0 0 50% 0)}
}
@media(max-width:800px){
  .social-showcase{row-gap:0}
  .social-showcase .social-copy{padding-bottom:0;text-align:center}
  .social-showcase .social-copy h2{font-size:clamp(25px,7.5vw,48px)}
  .social-showcase .mobile-social-break{display:initial}
  .social-showcase .social-description{margin-bottom:0}
  .social-showcase .social-stage{width:calc(100% + 32px);max-width:none;height:600px;margin-top:-48px;justify-self:center;place-items:center}
  .social-showcase .social-phone{width:230px;padding:8px;left:24px}
  .social-showcase .social-phone-shadow{display:none}
  .social-showcase .phone-status{height:26px;padding:8px 14px 0;font-size:8px}
  .social-showcase .phone-island{height:18px;top:3px}
  .social-showcase .phone-island::after{width:5px;height:5px;top:6px;right:9px}
  .social-showcase .phone-status-icons svg{width:9px;height:9px}
  .social-showcase .phone-status-icons svg:last-child{width:13px}
  .social-showcase .phone-account{height:26px;padding:0 8px;gap:4px;font-size:9px;letter-spacing:-.2px}
  .social-showcase .phone-account svg{width:15px;height:15px}
  .social-showcase .phone-profile{padding:4px 9px;gap:7px}
  .social-showcase .phone-story-avatar{flex-basis:38px;width:38px;height:38px;padding:2px}
  .social-showcase .phone-story-avatar>span{padding:2px;border-width:1px}
  .social-showcase .phone-profile-facts{gap:4px}
  .social-showcase .phone-profile-facts>span{font-size:7px;gap:2px}
  .social-showcase .phone-profile-facts b{font-size:9px}
  .social-showcase .phone-bio{padding:2px 10px 5px;font-size:7px;line-height:1.3;gap:1px}
  .social-showcase .phone-bio strong{font-size:7px}
  .social-showcase .phone-profile-actions{padding:0 9px 6px;gap:4px}
  .social-showcase .phone-profile-actions a{height:21px;border-radius:4px;font-size:8px}
  .social-showcase .phone-highlights{padding:4px 9px 6px;gap:5px}
  .social-showcase .phone-highlights a{gap:4px;font-size:7px}
  .social-showcase .phone-highlights a>span{width:30px;padding:2px}
  .social-showcase .phone-tabs{height:24px}
  .social-showcase .phone-tabs svg{width:14px;height:14px}
  .social-showcase .phone-bottom{height:28px}
  .social-showcase .phone-bottom svg{width:17px;height:17px}
  .social-showcase .phone-avatar{width:19px;height:19px;padding:1px}
  .social-showcase .phone-home{height:10px}
  .social-showcase .phone-home::after{height:3px}
  .social-stage>.social-platforms{position:absolute;inset:0;display:block;margin:0;z-index:3;pointer-events:none}
  .social-stage>.social-platforms .social-platform{position:absolute;width:50px;height:50px;pointer-events:auto;border-radius:50%;box-shadow:inset 0 0 0 1px #ffffff30,0 7px 16px #26213425}
  .social-stage>.social-platforms>:nth-child(1){left:calc(12% - 8px);top:7%}
  .social-stage>.social-platforms>:nth-child(2){left:-4px;top:21%}
  .social-stage>.social-platforms>:nth-child(3){left:4px;top:39%}
  .social-stage>.social-platforms>:nth-child(4){right:24px;bottom:39%}
  .social-stage>.social-platforms>:nth-child(5){right:calc(12% + 12px);bottom:7%}
  .social-stage>.social-platforms>:nth-child(6){right:16px;bottom:21%}
  .social-showcase>.social-work-link{justify-self:start;margin:-80px 0 0 0}
  .social-showcase>.social-work-link svg{display:none}
  .social-stage>.social-mobile-arrow{display:block;position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:3;pointer-events:none;transform:translate(48px,48px) rotate(12deg);transform-box:fill-box;transform-origin:center}
  .social-mobile-arrow path{fill:none;stroke:#171717;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
}

/* Hide the lower edge artifact while preserving the curved underline. */
#intro .social-work-link>span::after{clip-path:inset(0 0 50% 0)}
