/* Visual polish batch (Nov 7, 2026), from claude/visual-audit-2026-11.md. wp_head 240, after every page layer.
   Each block names the audit item it fixes. */

/* #3 Upcoming matches (home + Matches): the 4-column grid left half the row empty with 2 matches. Cards now share the row. */
body:not(#hud) .cc-up .cc-up__list{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}

/* #3 FAQs on Community and Hatch: one 860px column -> two columns on desktop */
@media (min-width:900px){
 body:not(#hud) .ccm-faq,body:not(#hud) .cch-faq{max-width:none;display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;align-items:start}
 body:not(#hud) .ccm-faq > :not(details),body:not(#hud) .cch-faq > :not(details){grid-column:1/-1}
}

/* #5 Content column: player pages, product pages and the Join hero ran ~10-16px from the screen edge at laptop widths.
   Same 1140px column as the header, homepage and shop. */
@media (min-width:768px){
body.parent-pageid-208:not(.page-id-471):not(#hud) [data-elementor-type="wp-page"] > .e-con-boxed > .e-con-inner,
body.single-product:not(#hud) .elementor-element-41824f5e > .e-con-inner,
body.page-id-8917:not(#hud) .elementor-element-7c4e434c > .e-con-inner{max-width:min(1140px,calc(100% - 32px))!important;margin-left:auto!important;margin-right:auto!important}
}

/* #6 Phone homepage: section headings, intros and buttons left-aligned like the rest of the site (merch banner stays centred) */
@media (max-width:767px){
 body.home:not(#hud) :is(.elementor-element-cc112uk,.elementor-element-cc112uh,.elementor-element-997030c,.elementor-element-7f68592,.elementor-element-57b7bf80,.elementor-element-4092ff2c,.elementor-element-55be3520,.elementor-element-872219c,.elementor-element-55bedff,.elementor-element-e84d1e7,.elementor-element-cc112pk,.elementor-element-826f678,.elementor-element-cc112vr),
 body.home:not(#hud) :is(.elementor-element-cc112uk,.elementor-element-cc112uh,.elementor-element-997030c,.elementor-element-7f68592,.elementor-element-57b7bf80,.elementor-element-4092ff2c,.elementor-element-55be3520,.elementor-element-872219c,.elementor-element-55bedff,.elementor-element-e84d1e7,.elementor-element-cc112pk,.elementor-element-826f678,.elementor-element-cc112vr) :is(.elementor-heading-title,.elementor-widget-container,p){text-align:left!important;justify-content:flex-start!important;margin-left:0!important}
 body.home:not(#hud) :is(.elementor-element-cc112ub,.elementor-element-72841c8,.elementor-element-cc112nb,.elementor-element-cc112fb){align-self:flex-start!important}
 body.home:not(#hud) :is(.elementor-element-cc112ub,.elementor-element-72841c8,.elementor-element-cc112nb,.elementor-element-cc112fb) .elementor-button-wrapper{text-align:left!important;justify-content:flex-start!important}
 /* hero stats: number above label, so "$39,250 / prize money won" no longer wraps into three lines */
 body.home:not(#hud) .cc-hp-proof .cc2-stats li{flex-direction:column!important;align-items:flex-start!important;gap:4px!important}
}

/* #7 The Coop hub (603): closing button bar sat on the footer line */
body.page-id-603:not(#hud) .elementor-element-tc4{padding-bottom:88px!important}
@media (max-width:767px){body.page-id-603:not(#hud) .elementor-element-tc4{padding-bottom:56px!important}}

/* #8 News: Instagram feed in house style (left heading, HUD buttons instead of the plugin's grey and blue) */
body:not(#hud) .elementor-element-de79550 .elementor-heading-title{text-align:left!important}
body:not(#hud) .elementor-element-85db005{padding-bottom:72px!important}
body:not(#hud) #sb_instagram .sbi_load_btn,body:not(#hud) #sb_instagram .sbi_follow_btn a{border-radius:0!important;box-shadow:none!important;font:700 13px/1 Poppins,sans-serif!important;letter-spacing:.06em!important;text-transform:uppercase!important;padding:14px 22px!important;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%);transition:background .15s,color .15s,transform .15s!important}
body:not(#hud) #sb_instagram .sbi_load_btn{background:transparent!important;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)!important}
body:not(#hud) #sb_instagram .sbi_load_btn:hover{box-shadow:inset 0 0 0 1px #EE212E!important}
body:not(#hud) #sb_instagram .sbi_follow_btn a{background:#EE212E!important;color:#fff!important}
body:not(#hud) #sb_instagram .sbi_follow_btn a:hover{background:#ff3d4a!important;transform:translateY(-2px)}

/* #9 Lone cards */
/* player pages "In the news": first story big (2x2), the other four in a 2x2 beside it */
@media (min-width:1025px){
 body:not(#hud) .cc-news{grid-template-columns:repeat(4,1fr)!important}
 body:not(#hud) .cc-news > :first-child{grid-column:span 2!important;grid-row:span 2!important}
}
/* Community "What happens in the Coop": 5th card spans the row instead of sitting alone */
body:not(#hud) .ccm-grid > .ccm-card:nth-child(5):last-child{grid-column:1/-1}
/* Shop category tiles: share the row instead of three small tiles on the left */
body:not(#hud) ul.products:has(> li.product-category){grid-template-columns:repeat(auto-fit,minmax(200px,1fr))!important}

/* #14 Smallest labels (10-10.5px) up a step on phones */
@media (max-width:767px){
 body:not(#hud) :is(.tc-date,.tc-meta,.cc-from,.ccv-badge){font-size:11.5px!important}
}

/* #15 Old red (#EC323F) on staff page buttons -> Fiery Red */
body:not(#hud) :is(.elementor-element-ab000041,.elementor-element-ac000041,.elementor-element-ad000041,.elementor-element-ae000041) .elementor-button{background-color:#EE212E!important}
body:not(#hud) :is(.elementor-element-ab000041,.elementor-element-ac000041,.elementor-element-ad000041,.elementor-element-ae000041) .elementor-button:hover{background-color:#ff3d4a!important}

/* #12 Sign in (9421): form + "Inside My Coop" panel side by side; the shortcode's title is the page H1 */
body.page-id-9421:not(#hud) .cc-signin-wrap.cc-si{max-width:1040px!important;margin:56px auto 80px!important;padding:0 20px!important;display:grid;grid-template-columns:minmax(0,520px) minmax(0,1fr);gap:28px;align-items:stretch}
body.page-id-9421:not(#hud) .cc-si .roost-signin{height:100%;margin:0}
body.page-id-9421:not(#hud) .cc-si h1.roost-h{font:800 clamp(26px,3vw,34px)/1.05 Poppins,sans-serif;text-transform:uppercase;letter-spacing:-.015em;color:#fff;margin:0 0 10px}
body.page-id-9421:not(#hud) .cc-si__why{position:relative;overflow:hidden;background:#1d1d1d linear-gradient(150deg,rgba(238,33,46,.18),transparent 55%);border:1px solid rgba(255,255,255,.09);padding:32px 30px;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%);color:#fff;font-family:Poppins,sans-serif}
body.page-id-9421:not(#hud) .cc-si__why::before{content:"";position:absolute;right:-40px;bottom:-40px;width:240px;height:240px;background:url("/wp-content/uploads/2024/12/logo-on-black-1024x1024.png") center/contain no-repeat;opacity:.07;pointer-events:none}
body.page-id-9421:not(#hud) .cc-si__why::after{content:"";position:absolute;top:0;right:0;width:23px;height:23px;background:linear-gradient(to top right,transparent calc(50% - 1.5px),#EE212E calc(50% - 1.5px),#EE212E calc(50% + 1.5px),transparent calc(50% + 1.5px))}
body.page-id-9421:not(#hud) .cc-si__kicker{display:block;color:#EE212E;font:700 12px/1.3 Poppins,sans-serif;letter-spacing:.1em;text-transform:uppercase;margin:0 0 10px}
body.page-id-9421:not(#hud) .cc-si__why h2{font:800 clamp(24px,2.6vw,30px)/1.05 Poppins,sans-serif;text-transform:uppercase;letter-spacing:-.015em;color:#fff;margin:0 0 20px}
body.page-id-9421:not(#hud) .cc-si__why ul{list-style:none;margin:0;padding:0;display:grid;gap:14px;position:relative}
body.page-id-9421:not(#hud) .cc-si__why li{border-left:3px solid #EE212E;padding:2px 0 2px 14px;font:400 15px/1.55 Poppins,sans-serif;color:#cfcfcf}
body.page-id-9421:not(#hud) .cc-si__why li b{display:block;color:#fff;font-weight:700;text-transform:uppercase;font-size:14px;letter-spacing:.03em;margin-bottom:2px}
body.page-id-9421:not(#hud) .cc-si__why p{position:relative;margin:22px 0 0;font:500 14px/1.6 Poppins,sans-serif;color:#a6a6a6}
body.page-id-9421:not(#hud) .cc-si__why a{color:#fff;text-decoration:underline;text-decoration-color:#EE212E;text-underline-offset:3px}
@media (max-width:860px){
 body.page-id-9421:not(#hud) .cc-signin-wrap.cc-si{grid-template-columns:1fr;margin:32px auto 56px!important;padding:0 16px!important}
 body.page-id-9421:not(#hud) .cc-si__why{padding:26px 22px}
}

/* #4 Hero consistency: posts (template 352) left-aligned to the article column, like the unified page hero */
body.single-post:not(#hud) .elementor-element-cc352hr > .e-con-inner{max-width:min(1220px,100%)!important;align-items:flex-start!important;padding-left:20px!important;padding-right:20px!important}
body.single-post:not(#hud) .elementor-element-cc352hr :is(.elementor-heading-title,.elementor-widget-container,.elementor-post-info,h1,p){text-align:left!important;justify-content:flex-start!important}
body.single-post:not(#hud) .elementor-element-cc352hr .elementor-widget{align-self:stretch!important}
body.single-post:not(#hud) .elementor-element-cc352hr :is(h1,ul,.elementor-widget-container > *){margin-left:0!important;margin-right:auto!important}
body.single-post:not(#hud) .elementor-element-cc352hr h1{max-width:900px!important}
/* #4 Community hero: heading left, live leaderboard right (same split as Hatch) on desktop */
@media (min-width:1025px){
 body:not(#hud) .ccm-hero .ccm-wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);gap:48px;align-items:start}
 body:not(#hud) .ccm-hero .ccm-hero__head{text-align:left!important;position:sticky;top:120px;padding-top:24px}
 body:not(#hud) .ccm-hero .ccm-hero__head > *{text-align:left!important;margin-left:0!important;margin-right:0!important;justify-content:flex-start!important}
 body:not(#hud) .ccm-hero .ccm-board{margin:0!important;max-width:none!important;width:100%!important}
}

/* #10 Posts: the "Back the Flock" box stays in view while reading (short enough for any screen) */
@media (min-width:1025px){
 body.single-post:not(#hud) .elementor-element-492bd753{position:sticky;top:110px}
}

/* #15 reCAPTCHA on dark forms: dark look without changing the widget */
body:not(#hud) iframe[title="reCAPTCHA"]{filter:invert(.9) hue-rotate(180deg);border-radius:3px}
