/* MulligansGuide — rules for classes genuinely absent from the extracted style.css (new structural wrappers introduced for our own content, plus unavoidable CSS-only substitutes for Webflow IX2/JS behavior). Every class already defined in style.css is used as-is and NOT duplicated here. */

.mg-page-wrapper{overflow-x:hidden}
.mg-main{display:block}
.mg-white{color:var(--_colors---white)}

/* Real .mg-banner-news-title / .mg-video-news-left-title / .mg-short-video-title sit in an
   absolute, bottom-anchored overlay box (.mg-banner-typography etc, inset:auto auto 0% 0%)
   whose container height is fixed by the thumbnail image. The source site's own short
   headlines never overflow that box; several of our real article titles are longer and
   would overflow past the top of the image and get clipped by the link block's
   overflow:hidden. Clamping to a fixed line count keeps the real absolute/bottom-anchored
   layout intact for any headline length instead of reintroducing the fixed-height
   overlap bug already fixed once on GoldTested. */
.mg-banner-news-title,.mg-video-news-left-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.mg-short-video-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}

/* mobile nav-menu panel: real .mg-w-nav[data-collapse="medium"] .mg-w-nav-menu{display:none}
   has specificity (0,3,0) — a plain .mg-nav-menu.mg-is-open override (0,2,0) loses to it.
   ID selector (1,0,0) always wins regardless. */
@media screen and (max-width:991px){
  #mg-nav-menu.mg-is-open{display:block}
}

/* hand-coded hamburger-to-X morph, substituting the template's Lottie animation */
.mg-hamburger-icon{width:22px;height:16px;position:relative}
.mg-hamburger-icon span{position:absolute;left:0;width:100%;height:2px;background:var(--_colors---white);border-radius:2px;transition:transform .35s ease,opacity .35s ease,top .35s ease}
.mg-hamburger-icon span:nth-child(1){top:0}
.mg-hamburger-icon span:nth-child(2){top:7px}
.mg-hamburger-icon span:nth-child(3){top:14px}
.mg-hamburger-icon.mg-is-open span:nth-child(1){top:7px;transform:rotate(45deg)}
.mg-hamburger-icon.mg-is-open span:nth-child(2){opacity:0}
.mg-hamburger-icon.mg-is-open span:nth-child(3){top:7px;transform:rotate(-45deg)}

/* author-image social row: always visible in the source (no hover reveal exists) */
.mg-author-social-media-wrapper{column-gap:15px;background-image:linear-gradient(rgba(255,255,255,0),rgba(0,0,0,.7) 80%);justify-content:center;align-items:center;width:100%;padding:20px 10px;display:flex;position:absolute;inset:auto auto 0 0}

.mg-breaking-news-ticker-single{width:100%;max-width:972px;overflow:hidden;display:flex;justify-content:flex-start;align-items:center}
.mg-news-title-inner-ticker-wrapper{flex:none;justify-content:flex-start;align-items:center;display:flex}

/* generic content grids used across section listings — per-section gap/column values
   confirmed against the real .latest-news-collection-list / .short-video-collection-list /
   .podcast-collection-list rules via live CSSOM inspection at 768px (Tablet QA pass) */
.mg-grid-3-column{display:grid;grid-template-columns:repeat(3,1fr);grid-column-gap:24px;grid-row-gap:24px;width:100%}
.mg-grid-4-column{display:grid;grid-template-columns:repeat(4,1fr);grid-column-gap:24px;grid-row-gap:24px}
@media screen and (max-width:991px){
  .mg-latest-news-content .mg-grid-3-column{grid-template-columns:repeat(2,1fr);grid-column-gap:20px;grid-row-gap:30px}
  .mg-podcast-content .mg-grid-3-column,.mg-articles-content .mg-grid-3-column{grid-template-columns:repeat(2,1fr)}
  .mg-grid-4-column{grid-template-columns:repeat(3,1fr);grid-column-gap:16px;grid-row-gap:20px}
}
@media screen and (max-width:767px){
  .mg-latest-news-content .mg-grid-3-column,.mg-podcast-content .mg-grid-3-column,.mg-articles-content .mg-grid-3-column{grid-template-columns:1fr}
  .mg-grid-4-column{grid-template-columns:repeat(2,1fr);grid-row-gap:16px}
}
@media screen and (max-width:479px){
  .mg-latest-news-content .mg-grid-3-column{grid-row-gap:24px}
  .mg-grid-3-column{grid-template-columns:1fr}
  .mg-grid-4-column{grid-template-columns:1fr}
}
.mg-main-news-categories-collection-list{display:grid;grid-row-gap:20px}

/* inline text link used inside rich-text/notes */
.mg-inline-link{color:var(--_colors---primary);font-weight:600;text-decoration:underline}

/* inner banner (category/static page header) — genuinely absent from source, matches inner-banner container styling */
.mg-inner-banner-content{text-align:center}
.mg-inner-banner-desc{color:var(--_colors---black);opacity:.7;margin-top:8px}

/* article/team-details images need explicit width — source markup relies on a
   fixed image asset size rather than a width rule */
.mg-blog-details-image{width:100%;border-radius:8px}
.mg-blog-details-content{row-gap:40px;flex-flow:column;display:flex}
.mg-blog-details-top-content,.mg-blog-details-bottom-content{animation:mg-fade-in .5s ease both}
@keyframes mg-fade-in{from{opacity:0}to{opacity:1}}
.mg-blog-details-top-content{width:100%;max-width:740px}
.mg-blog-details-title{margin-bottom:20px}
.mg-blog-details-image-wrapper{margin-bottom:40px}
.mg-team-details-image{width:100%;border-radius:8px}

/* article page 2-column split — real values confirmed via live CSSOM inspection
   (a text/regex search of the minified source missed this rule entirely) */
.mg-blog-details-bottom-content{column-gap:15px;justify-content:space-between;align-items:flex-start;display:flex}
.mg-blog-details-left-content{width:100%;max-width:740px}
.mg-blog-details-right-content{row-gap:60px;flex-flow:column;width:100%;max-width:376px;display:flex}
@media screen and (max-width:991px){
  .mg-blog-details-bottom-content{flex-flow:column;row-gap:40px}
  .mg-blog-details-left-content,.mg-blog-details-right-content{max-width:100%}
}

/* static content pages (about/contact/legal) */
.mg-static-content{max-width:760px;margin:0 auto;padding:60px 0}
.mg-rich-text h2{font-size:22px;margin:32px 0 12px}
.mg-rich-text p,.mg-rich-text li{color:var(--_colors---gray-1);line-height:1.7;font-size:15px}
.mg-form-label{display:block;margin-bottom:16px;font-weight:600;font-size:14px}
.mg-form-input{display:block;width:100%;margin-top:6px;padding:12px 16px;border:1px solid var(--_colors---gray-2);border-radius:8px;font-size:15px;font-family:var(--_font-family---inter)}
.mg-textarea{resize:vertical}
.mg-contact-form{max-width:520px;margin:32px auto 0;display:flex;flex-direction:column}
.mg-category-card{display:block;background:var(--_colors---gray-4);border-radius:10px;padding:32px;text-align:center;text-decoration:none;transition:background .3s}
.mg-category-card:hover{background:var(--_colors---secondary)}
.mg-category-card-name{font-weight:700;color:var(--_colors---black)}

/* 404 */
.mg-error-section{padding:120px 0;text-align:center}
.mg-error-content{display:flex;flex-direction:column;align-items:center}
.mg-error-title{font-size:96px;font-weight:900;color:var(--_colors---primary);margin:0}
.mg-error-text{color:var(--_colors---gray-1);margin:16px 0 28px}

/* affiliate disclosure note on article pages */
.mg-affiliate-note{margin-top:28px;padding:16px;border-left:3px solid var(--_colors---primary);background:var(--_colors---gray-4);font-size:13px;color:var(--_colors---gray-1)}