{"version":3,"file":"TeamCardCode.CjwrVfdN.mjs","names":["useState","useRef","_Fragment"],"sources":["https:/framerusercontent.com/modules/lbeD9KZE8qsbWNol8ssn/U6bbxdcVL4YkgnT9xPOE/TeamCardCode.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import{useEffect,useRef,useState}from\"react\";export default function CollapsibleProfileCard(props){const{name,position,image,excerpt,description,query,tabQuery,fonts}=props;const{primaryFont,secondaryFont}=fonts;const[isExpanded,setIsExpanded]=useState(false);const cardRef=useRef(null);const scrollWithOffset=(element,offset=120)=>{const y=element.getBoundingClientRect().top+window.pageYOffset-offset;window.scrollTo({top:y,behavior:\"smooth\"});};useEffect(()=>{const params=new URLSearchParams(window.location.search);const q=params.get(\"q\");if(q&&q.toLowerCase()===query?.toLowerCase()){setIsExpanded(true);setTimeout(()=>{if(cardRef.current){scrollWithOffset(cardRef.current,120)// 👈 offset = menu height\n;}},300);}},[query]);// ✅ Toggle expand + update URL + scroll\nconst handleToggle=()=>{const newState=!isExpanded;setIsExpanded(newState);const params=new URLSearchParams(window.location.search);if(newState){params.set(\"q\",query?.toLowerCase());if(tabQuery){params.set(\"tab\",tabQuery);}}else{params.delete(\"q\");params.delete(\"tab\");}const newUrl=`${window.location.pathname}?${params.toString()}`;window.history.pushState({},\"\",newUrl);if(newState){setTimeout(()=>{cardRef.current?.scrollIntoView({behavior:\"smooth\",block:\"start\"});},300);}};return /*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(\"style\",{children:`\n\n                .profile-card {\n                    background: linear-gradient(105.086deg, rgba(27, 32, 45, 0.55) 0%, rgba(77, 87, 113, 0.55) 100%);\n                    backdrop-filter: blur(63.8px);\n                    border-radius: 16px;\n                    border: 2px solid rgb(53, 64, 95);\n                    padding: 24px;\n                    transition: all 0.3s ease;\n                    font-family: ${secondaryFont?.fontFamily}\n                }\n\n                .profile-card:hover {\n                    background: linear-gradient(105.086deg, rgba(27, 32, 45, 0.65) 0%, rgba(77, 87, 113, 0.65) 100%);\n                }\n\n                .profile-card.expanded {\n                    background: linear-gradient(105.086deg, rgba(105, 42, 11, 0.3) 25%, rgba(255, 94, 0, 0.3) 100%);\n                    border: 2px solid rgb(255, 94, 0);\n                }\n\n                .profile-card-content {\n                    display: flex;\n                    gap: 24px;\n                    align-items: center;\n                }\n\n                .profile-image-container {\n                    flex-shrink: 0;\n                    display: flex;\n                    align-items: flex-start;\n                    gap: 16px;\n                }\n\n                .profile-header-mobile {\n                    display: none;\n                }\n\n                .profile-header {\n                    display: block;\n                }\n\n                .profile-image-wrapper {\n                    border-radius: 28px;\n                    overflow: hidden;\n                    aspect-ratio: 5/6;\n                }\n\n                .profile-image {\n                    width: 100%;\n                    height: 100%;\n                    object-fit: cover;\n                }\n\n                .profile-content {\n                    flex: 1;\n                    min-width: 0;\n                }\n\n                .profile-name {\n                    font-family: ${primaryFont?.fontFamily}\n                    font-size: 24px;\n                    font-weight: 300;\n                    color: #ffffff;\n                    margin: 0 0 4px 0;\n                    line-height: 1.2;\n                }\n\n                .profile-title {\n                    color: #60a5fa;\n                    font-size: 20px;\n                    font-weight: 500;\n                    margin: 0 0 12px 0;\n                    line-height: 1.2;\n                }\n\n                .profile-description {\n                    color: #ffffff;\n                    font-size: 18px;\n                    line-height: 1.6;\n                    margin-bottom: 35px;\n                }\n\n                .expandable-content {\n                    overflow: hidden;\n                    transition: all 0.3s ease;\n                    max-height: 0;\n                    opacity: 0;\n                    margin-bottom: 0;\n                }\n\n                .expandable-content.expanded {\n                    max-height: fit-content;\n                    opacity: 1;\n                    margin-bottom: 16px;\n                }\n\n                .expanded-text {\n                    color: #ffffff;\n                    font-size: 18px;\n                    line-height: 1.6;\n                    margin: 0;\n                }\n\n                .learn-more-button {\n                    display: inline-flex;\n                    align-items: center;\n                    gap: 8px;\n                    padding: 16px 25px;\n                    background: transparent;\n                    border: 1px solid #f97316;\n                    color: #ffffff;\n                    font-size: 16px;\n                    line-height: 1em;\n                    font-weight: 500;\n                    font-family: ${secondaryFont?.fontFamily};\n                    border-radius: 9999px;\n                    cursor: pointer;\n                    transition: all 0.2s ease;\n                    text-decoration: none;\n                    justify-content: center;\n                }\n\n                .learn-more-button:hover {\n                    border-color: #ea580c;\n                    box-shadow: 0 4px 12px rgba(249, 115, 22, 0.25);\n                }\n\n\n                .color-orange {\n                    color: #f97316;\n                }\n\n                /* Responsive Typography */\n                @media (min-width: 810px) {\n                    .profile-image-wrapper {\n                        width: 320px;\n                        height: 385px;\n                        max-width: none;\n                        aspect-ratio: 5/6;\n                    }\n                    \n                    .profile-name {\n                        font-size: 48px;\n                    }\n                    \n                    .profile-title {\n                        font-size: 28px;\n                    }\n                    \n                    .profile-description {\n                        font-size: 22px;\n                        margin-bottom: 44px;\n                    }\n                    \n                    .expanded-text {\n                        font-size: 20px;\n                    }\n                }\n\n                @media (min-width: 1200px) {\n                    .profile-card {\n                        padding: 55px;\n                    }\n                    .profile-image-wrapper {\n                        width: 434px;\n                        height: 522px;\n                        aspect-ratio: 5/6;\n                    }\n                    \n                    .profile-name {\n                        font-size: 60px;\n                    }\n                    \n                    .profile-title {\n                        font-size: 40px;\n                    }\n                    \n                    .profile-description {\n                        font-size: 26px;\n                        margin-bottom: 64px;\n                    }\n                    \n                    .expanded-text {\n                        font-size: 24px;\n                    }\n\n                    .learn-more-button {\n                    font-size: 25px;                \n                    }\n                }\n\n                \n\n                .button-icon {\n                    width: 16px;\n                    height: 16px;\n                }\n\n                @media (max-width: 810px) {\n                    .profile-card-content {\n                        flex-direction: column;\n                        gap: 16px;\n                        align-items: flex-start;\n                    }\n\n                    .profile-image-wrapper {\n                    width: 42%;\n                    max-width: 203px;\n                    min-width: 112px;\n                    aspect-ratio: 5/6;\n                }\n                    \n                    .profile-name {\n                        font-size: 28px;\n                    }\n                    \n                    .profile-title {\n                        font-size: 20px;\n                    }\n                    \n                    .profile-description {\n                        font-size: 18px;\n                    }\n                    \n                    .expanded-text {\n                        font-size: 18px;\n                    }\n                    \n                    .profile-content {\n                        display: flex;\n                        flex-direction: column;\n                    }\n                    \n                    .profile-header {\n                        display: none;\n                    }\n                    \n                    .profile-header-mobile {\n                        display: block;\n                    }\n                    \n                    .profile-text-content {\n                        flex: 1;\n                    }\n                    \n                    .profile-description,\n                    .expandable-content,\n                    .learn-more-button {\n                        margin-top: 16px;\n                    }\n\n\n                }\n            `}),/*#__PURE__*/_jsx(\"div\",{ref:cardRef,className:`profile-card ${isExpanded?\"expanded\":\"\"}`,children:/*#__PURE__*/_jsxs(\"div\",{className:\"profile-card-content\",children:[/*#__PURE__*/_jsxs(\"div\",{className:\"profile-image-container\",children:[/*#__PURE__*/_jsx(\"div\",{className:\"profile-image-wrapper\",children:/*#__PURE__*/_jsx(\"img\",{className:\"profile-image\",src:image?.src,srcSet:image?.srcSet,alt:image?.alt})}),/*#__PURE__*/_jsx(\"div\",{className:\"profile-header-mobile\",children:/*#__PURE__*/_jsxs(\"div\",{className:\"profile-text-content\",children:[/*#__PURE__*/_jsx(\"h2\",{className:\"profile-name\",children:name}),/*#__PURE__*/_jsx(\"h3\",{className:\"profile-title\",children:position})]})})]}),/*#__PURE__*/_jsxs(\"div\",{className:\"profile-content\",children:[/*#__PURE__*/_jsx(\"div\",{className:\"profile-header\",children:/*#__PURE__*/_jsxs(\"div\",{className:\"profile-text-content\",children:[/*#__PURE__*/_jsx(\"h2\",{className:\"profile-name\",children:name}),/*#__PURE__*/_jsx(\"h3\",{className:\"profile-title\",children:position})]})}),/*#__PURE__*/_jsx(\"p\",{className:\"profile-description\",children:excerpt}),/*#__PURE__*/_jsx(\"div\",{className:`expandable-content ${isExpanded?\"expanded\":\"\"}`,children:/*#__PURE__*/_jsx(\"div\",{className:\"expanded-text\",dangerouslySetInnerHTML:{__html:description?.replace(/\\n/g,\"<br/>\")}})}),/*#__PURE__*/_jsxs(\"button\",{onClick:handleToggle,className:\"learn-more-button\",children:[/*#__PURE__*/_jsx(\"span\",{className:\"color-orange\",children:isExpanded?\"−\":\"+\"}),isExpanded?`Show less`:`Learn more about ${name?.split(\" \")[0]}`]})]})]})})]});}CollapsibleProfileCard.defaultProps={name:\"Ryan Blair\",position:\"CEO\",image:{src:\"https://framerusercontent.com/images/QEKjqAxTNnz5EpXSsNqrp0dS1c.webp?scale-down-to=2048\"},excerpt:\"Ernst & Young Entrepreneur of the Year; NYT #1 Bestselling Author; $2B in Revenue and $1B in Exits\",description:\"Ryan is a Serial Entrepreneur with over $2 billion in sales and $1 billion in exits. Ryan led a $792M exit as the former CEO of ViSalus–known for the Body by Vi 90-Day Challenge. His first book, Nothing To Lose, Everything To Gain, became a #1 New York Times Best Seller and is translated into 11 languages. He later published a follow-up, From Rock Bottom to Rockstar. Ryan was named Ernst & Young’s Entrepreneur of the year in 2012 and received a number of notable accolades and awards along the way.\",query:\"ryan\",tabQuery:\"default-1\"};addPropertyControls(CollapsibleProfileCard,{name:{type:ControlType.String},position:{type:ControlType.String},image:{type:ControlType.ResponsiveImage},excerpt:{type:ControlType.String},description:{type:ControlType.String,displayTextArea:true},query:{type:ControlType.String},tabQuery:{type:ControlType.String},fonts:{type:ControlType.Object,controls:{primaryFont:{type:ControlType.Font,controls:\"extended\"},secondaryFont:{type:ControlType.Font,controls:\"extended\"}}}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"CollapsibleProfileCard\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./TeamCardCode.map"],"mappings":"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"}