/* 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}

/* Nov 8, 2026 audit: <main id="content"> wrapper (src/site/audit-fixes.php) takes focus from "Skip to content" without a box around the page */
main.cc-main{display:block}
main.cc-main:focus{outline:0}


/* Nov 10, 2026: desktop header with seven top-level items (Team, Matches, News, Shop, About, Community + Join). Between
   1025px and 1500px the Join button dropped to a second row (the logo column takes 34.5% of the bar). Here the logo
   column narrows to 26% (the logo keeps its 251px), the gap before each item scales with the window (7px at 1025,
   14px at 1100, 30px from about 1272) and so does the gap before Join (12px to 44px). Join's own look, the dropdowns
   and the phone/tablet menu (1024px and down) are untouched. Measured in signed-out 1025 to 1500px frames: one row,
   27px or more to spare. */
@media (min-width:1025px) and (max-width:1500px){
 body:not(#hud) .elementor-155 .elementor-element-66c85d1c{--width:26%;width:26%!important}
 body:not(#hud) .elementor-155 .elementor-element-50abd190 .elementskit-navbar-nav>li>a{padding-left:clamp(7px,calc(7px + (100vw - 1025px)*.0933),30px)!important}
 body:not(#hud) .elementor-155 .elementor-element-50abd190 .elementskit-navbar-nav>li.cc-nav-cta{margin-left:0!important}
 body:not(#hud) .elementor-155 .elementor-element-50abd190 .elementskit-navbar-nav>li.cc-nav-cta>a.ekit-menu-nav-link{padding-left:22px!important;margin-left:clamp(12px,calc(12px + (100vw - 1025px)*.08),44px)!important}
}
@media (min-width:1025px) and (max-width:1099px){
 body:not(#hud) .elementor-155 .elementor-element-50abd190 .elementskit-navbar-nav>li:not(.cc-nav-cta)>a{font-size:13px!important}
}