/* Four open invitations. The story rings remain recognisable, while the whole
   message is an explicit, keyboard-accessible control. Load after social-tail.css. */
.social-highlights{padding:110px 0 125px;background:radial-gradient(ellipse at 14% 12%,#586b832c,transparent 54%),linear-gradient(130deg,#1c2027,#14161b 70%)}
.social-highlights:before{inset:19% -18% -24% 43%;background:linear-gradient(135deg,#b6312b,#701f27);box-shadow:-36px -25px 90px #491a2440}
.social-highlights-layout{grid-template-columns:1fr 1.08fr;gap:6%;align-items:center}
.social-highlights h2{font-size:clamp(54px,5.8vw,84px);line-height:.98;letter-spacing:-.035em;max-width:630px;text-wrap:balance}
.social-highlights h2 em{color:#ff8d83}
.social-highlights-intro>p{font-size:16px;line-height:1.7;max-width:470px;margin-top:27px;color:#d2d9e4}
.social-highlight-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 17px;max-width:565px;margin-top:31px;align-items:stretch}
.social-highlight-controls .highlight-invite{position:relative;display:grid;grid-template-columns:43px minmax(0,1fr);align-items:start;gap:11px;min-height:154px;padding:19px 16px 17px;text-align:left;background:#2c333e;color:#f4f5f6;border:0;border-radius:14px 14px 14px 3px;box-shadow:8px 15px 26px #03070d3d;transition:background .22s ease,transform .22s cubic-bezier(.16,.8,.2,1);isolation:isolate}
.social-highlight-controls .highlight-invite:nth-child(even){border-radius:14px 14px 3px 14px;transform:translateY(10px)}
.social-highlight-controls .highlight-invite .social-highlight-ring{width:43px;height:43px;background:#222933;border-color:#a6b3c99c;transform:none;box-shadow:none}
.highlight-invite .social-highlight-ring:after{inset:4px;border-color:#b7c5d72b}
.highlight-invite .social-highlight-ring svg{width:20px;height:20px;color:#d8e0ec}
.highlight-invite .social-highlight-ring img{width:35px;height:35px}
.highlight-message{display:flex;flex-direction:column;align-items:start;gap:0;min-width:0;width:100%}
.highlight-name{font-size:clamp(17px,1.55vw,22px);line-height:1.15;letter-spacing:-.02em;font-weight:700;padding-top:1px}
.highlight-question{display:block;font-size:12px;line-height:1.5;color:#cbd4e2;margin-top:10px;max-width:180px;min-height:36px;font-weight:400}
.highlight-open{display:flex;align-items:center;gap:9px;font-size:10px;line-height:1.3;color:#ffb8b1;margin-top:14px;min-height:20px;font-weight:600}
.highlight-open svg{width:14px;height:14px;stroke-width:1.7;transition:transform .22s cubic-bezier(.16,.8,.2,1)}
.social-highlight-controls .highlight-invite[aria-pressed=true]{background:#9f2d2a;color:#fff7f5}
.social-highlight-controls .highlight-invite[aria-pressed=true] .social-highlight-ring{background:#792322;border-color:#ffd5cd;box-shadow:none;transform:none}
.social-highlight-controls .highlight-invite[aria-pressed=true] .highlight-question{color:#ffe7e3}
.social-highlight-controls .highlight-invite[aria-pressed=true] .highlight-open,.social-highlight-controls .highlight-invite[aria-pressed=true] .social-highlight-ring svg{color:#fff}
.social-highlight-controls .highlight-invite:focus-visible{outline:3px solid #f4f5f6;outline-offset:5px}
.social-highlights-intro>.social-highlight-instruction{font-size:11px;line-height:1.6;margin-top:25px;color:#c2ccda}
.social-story-frame{padding:23px;box-shadow:24px 42px 75px #02070e8c;transform:perspective(1200px) rotateY(-4deg) rotateZ(2deg)}
.social-story-panel{min-height:560px;padding:31px}
.social-story-copy h3,.story-reach .social-story-copy h3{font-size:clamp(32px,3.15vw,45px);line-height:1.04;letter-spacing:-.03em;max-width:100%;text-wrap:balance}
.social-story-copy h3 em{color:#ffaaa0}
.social-story-copy p{font-size:14px;line-height:1.75;margin-top:23px;max-width:370px}
.social-story-copy .social-story-note{font-size:11px;line-height:1.7;color:#d0d8e3}
.social-story-copy .text-link{font-size:12px;font-weight:700;margin-top:23px;color:#ffe2db}
.story-reach .social-story-copy{max-width:83%}
.story-reach .social-story-copy h3{font-size:clamp(28px,2.85vw,41px)}
.social-story-proof{width:39%;height:49%;right:-17px;top:19px}
.story-reach:after{background:linear-gradient(0deg,#19202b 28%,#19202bd9 44%,#19202b66 67%,transparent 90%)}
.story-community .social-story-copy h3{max-width:100%}
.story-community:after{background:linear-gradient(0deg,#10141c 0%,#10141cf5 38%,#10141cc9 62%,#10141c24)}
.story-approach .social-story-copy h3 em{color:#fff0e8}
.story-approach .social-story-question{top:27px;right:25px;width:62%;min-height:132px}
.story-people .social-story-copy h3 em{color:#8d2727}
.story-people .social-story-copy p{color:#28394a}
.story-people .social-story-copy .text-link{color:#84252a}
.social-story-position{font-size:11px}
.social-story-next{font-size:12px;font-weight:600}
@media(hover:hover) and (pointer:fine){
 .social-highlight-controls .highlight-invite:hover{background:#384352;transform:translateY(-4px)}
 .social-highlight-controls .highlight-invite:nth-child(even):hover{transform:translateY(6px)}
 .social-highlight-controls .highlight-invite[aria-pressed=true]:hover{background:#b6312b}
 .social-highlight-controls .highlight-invite:hover .social-highlight-ring{transform:none}
 .social-highlight-controls .highlight-invite:hover .highlight-open svg{transform:translate(3px,-3px)}
}
@media(min-width:761px) and (max-width:1100px){
 .social-highlights-layout{grid-template-columns:1fr 1fr;gap:5%}
 .social-highlights h2{font-size:clamp(46px,5.8vw,64px)}
 .social-highlights-intro>p{font-size:14px}
 .social-highlight-controls{gap:12px;margin-top:25px}
 .social-highlight-controls .highlight-invite{grid-template-columns:1fr;gap:12px;min-height:186px;padding:16px}
 .social-highlight-controls .highlight-invite .social-highlight-ring{width:39px;height:39px}
 .highlight-invite .social-highlight-ring img{width:31px;height:31px}
 .highlight-name{font-size:18px}.highlight-question{font-size:11px;margin-top:8px;min-height:34px}.highlight-open{margin-top:12px}
 .social-story-frame{padding:16px}.social-story-panel{padding:25px;min-height:610px}
 .social-story-copy h3,.story-reach .social-story-copy h3{font-size:33px}
 .social-story-copy p{font-size:13px}.social-story-copy .social-story-note{font-size:10px}
 .story-reach .social-story-copy{max-width:100%}.social-story-proof{height:36%;width:48%}
}
@media(max-width:760px){
 .social-highlights{padding:72px 0 78px}
 .social-highlights-layout{display:block}
 .social-highlights h2{font-size:clamp(43px,11.4vw,70px);line-height:1.02}
 .social-highlights-intro>p{font-size:14px;margin-top:24px;max-width:500px}
 .social-highlight-controls{max-width:520px;gap:12px 11px;margin-top:27px}
 .social-highlight-controls .highlight-invite{grid-template-columns:1fr;gap:11px;padding:17px 15px;min-height:184px}
 .social-highlight-controls .highlight-invite:nth-child(even){transform:translateY(8px)}
 .social-highlight-controls .highlight-invite .social-highlight-ring{width:42px;height:42px}
 .highlight-invite .social-highlight-ring img{width:34px;height:34px}
 .highlight-name{font-size:20px;line-height:1.1}
 .highlight-question{font-size:12px;line-height:1.5;margin-top:8px;min-height:36px}
 .highlight-open{font-size:10px;margin-top:12px;gap:11px}
 .social-highlights-intro>.social-highlight-instruction{font-size:10px;margin-top:24px}
 .social-story-frame{padding:15px;margin-top:36px;transform:rotate(1deg)}
 .social-story-panel{min-height:510px;padding:24px}
 .social-story-copy h3,.story-reach .social-story-copy h3{font-size:clamp(30px,8.5vw,40px);line-height:1.05}
 .social-story-copy p{font-size:13px;line-height:1.75;margin-top:21px}
 .social-story-copy .social-story-note{font-size:10px;line-height:1.7}
 .social-story-copy .text-link{font-size:11px;gap:10px;margin-top:21px}
 .story-reach{flex-direction:column-reverse;align-items:stretch;gap:25px;min-height:0}
 .story-reach .social-story-copy{max-width:100%}
 .story-reach .social-story-proof{position:relative;inset:auto;width:100%;height:145px;object-fit:cover;object-position:center 34%;transform:none;opacity:1;z-index:1;box-shadow:none}
 .story-reach:after{display:none}
 .story-approach .social-story-question{width:65%;min-height:129px;top:27px;right:22px}
 .social-story-position{font-size:10px}.social-story-next{font-size:11px}
}
@media(max-width:370px){
 .social-highlights h2{font-size:41px}
 .social-highlight-controls{gap:11px 10px}
 .social-highlight-controls .highlight-invite{padding:15px 13px;min-height:190px}
 .highlight-name{font-size:18px}.highlight-question{font-size:11px;min-height:34px}
 .social-story-frame{padding:12px}.social-story-panel{padding:21px;min-height:530px}
 .social-story-copy h3,.story-reach .social-story-copy h3{font-size:29px}
 .story-reach{min-height:0}.story-reach .social-story-proof{height:135px}
 .social-story-copy p{font-size:12px}
}
/* The long German display word must stay intact inside the phone story.
   The newly added count supplies the large emphasis below this compact title. */
@media(max-width:760px){
 .story-reach .social-story-copy h3{font-size:clamp(23px,7.2vw,36px)}
}
@media(prefers-reduced-motion:reduce){
 .social-highlight-controls .highlight-invite,.social-highlight-controls .highlight-invite:nth-child(even),.social-story-frame{transform:none!important;transition:none!important}
 .highlight-open svg{transition:none!important;transform:none!important}
}
html[data-motion=reduced] .social-highlight-controls .highlight-invite,html[data-motion=reduced] .social-story-frame{transform:none!important;transition:none!important}