/* Theme Name: Matejic Child Theme URI: https://mcgx.com.au Description: Child theme of "Matejic" used as the home for MCGx self-managed front-end tweaks (custom JS/CSS overrides). Keep this theme ACTIVE. If the site ever visually reverts after any theme work, the first thing to check is whether "Matejic Child" is still the active theme under Appearance > Themes. Author: MCGx Template: matejic Version: 1.0.1 */ /* =========================================================================== STAGE 0 — Baseline recovery --------------------------------------------------------------------------- These rules were previously held in Appearance > Customise > Additional CSS against the PARENT theme. They were lost from the front end the moment the child theme was activated (Additional CSS is stored per-theme). Moving them here restores the site to its known-good appearance and versions them with the theme so this can't happen again. NOTE on the hero block below: it is currently a CSS workaround that forces the hero's end-state. It is retained here for now so the site looks correct. In Stage 1 a JS fix will stop the SplitText init from running, at which point this block stops "fighting" GSAP and simply declares the resting state as a safety net. Do not delete it without the Stage 1 JS in place. =========================================================================== */ /* ===== CASE STUDY IMAGE FIXES (case studies listing page only) ===== */ /* Card on case studies listing page only — square corners */ .category-case-studies .card, .category-case-studies .default.light.card { border-radius: 0 !important; overflow: hidden; } /* Image container on case studies listing page → 16:9, transparent, with padding */ .category-case-studies .card .image, .category-case-studies .default.light.card .image { aspect-ratio: 16 / 9 !important; height: auto !important; padding: 5px !important; background: transparent !important; border-radius: 0 !important; overflow: hidden; box-sizing: border-box !important; position: relative; } /* Image inside case study cards → constrained to padded area */ .category-case-studies .card .image img, .category-case-studies .default.light.card .image img { position: relative !important; width: 100% !important; height: 100% !important; max-width: 100% !important; max-height: 100% !important; min-width: 0 !important; min-height: 0 !important; object-fit: contain !important; aspect-ratio: auto !important; border-radius: 0 !important; } /* Hover zoom amount on case study thumbnail cards only */ .category-case-studies .card:hover .image img, .category-case-studies .default.light.card:hover .image img { transform: scale(1.03) !important; } /* Hero image on individual case study post — square corners */ .single-post .feature-image, .single-post .feature-image img { border-radius: 0 !important; } /* ============================================ BANNER TEXT LEGIBILITY ============================================ */ /* 1. GLOBAL — soft shadow on all banner headings. text-shadow inherits, so targeting .tile-inner covers the heading without needing its exact tag. */ .header-tile .tile-inner { text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55), 0 2px 14px rgba(0, 0, 0, 0.45); } /* 2. CONTACT PAGE ONLY (page-id-505) — gradient scrim darkening the bottom-left behind the text, fading to clear so the bright desk on the right stays bright. */ body.page-id-505 .header-tile { position: relative; } body.page-id-505 .header-tile .background::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top right, rgba(0, 0, 0, 0.40) 0%, rgba(0, 0, 0, 0.25) 35%, transparent 60%); pointer-events: none; } body.page-id-505 .header-tile .tile-inner { position: relative; z-index: 1; /* keeps the text above the scrim */ } /* 3. ABOUT US PAGE (page-id-489) — stronger shadow + radial scrim, raised to sit over the text */ body.page-id-489 .header-tile { position: relative; } body.page-id-489 .header-tile::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 65% 75% at left 67%, rgba(0, 0, 0, 0.68) 0%, rgba(0, 0, 0, 0.32) 30%, transparent 62%); pointer-events: none; } body.page-id-489 .header-tile .tile-inner { text-shadow: 0 0 2px rgba(0, 0, 0, 0.9), 0 1px 3px rgba(0, 0, 0, 0.75), 0 2px 16px rgba(0, 0, 0, 0.55); position: relative; z-index: 1; } /* ===== CASE STUDY BODY JUSTIFICATION ===== */ /* Justify all case study post bodies */ .blog-post .content p { text-align: justify; hyphens: auto; } body.parent-pageid-515 .cols-1 .col.text .entry-content p { text-align: justify !important; text-align-last: center; -webkit-hyphens: auto; hyphens: auto; } /* ============================================ HOME HERO HEADING — reveal suppression (CSS workaround) Stage 0: retained as-is so the hero renders correctly. Stage 1: a JS fix will stop SplitText initialising; after that this block is a passive end-state safety net only. ============================================ */ /* Home hero heading only (the video banner) — kill the reveal + the cleanup shift */ .home .header-tile .text-stagger, .home .header-tile .text-stagger * { opacity: 1 !important; visibility: visible !important; transform: none !important; translate: none !important; transition: none !important; animation: none !important; } .home .header-tile .text-stagger span { display: inline !important; } /* ============================================ CONCERTINA (Typical Engagements) — desktop only Scoped to .horizontal-concertina so it never touches the home-page tabs-concertina. ============================================ */ @media (min-width: 1024px) { /* Group icon + text, trim side padding */ .horizontal-concertina .content .reveal { justify-content: flex-start !important; gap: 1.25rem; padding-left: 24px !important; padding-right: 24px !important; } /* Shift title + description up */ .horizontal-concertina .content .reveal .text { transform: translateY(-62px); } /* Shorter tiles */ .horizontal-concertina .concertina-content, .horizontal-concertina .concertina-content .content, .horizontal-concertina .concertina-content .trigger { height: 440px !important; min-height: 0 !important; aspect-ratio: auto !important; } } /* ============================================ CONCERTINA TILES — watermark atom (desktop) Faint MCGx mark fills the open tile, behind the text. ============================================ */ @media (min-width: 1024px) { .horizontal-concertina .content.open { position: relative; overflow: hidden; } .horizontal-concertina .content.open > * { position: relative; z-index: 1; } .horizontal-concertina .content.open::after { content: ""; position: absolute; right: -38px; bottom: -48px; width: 300px; height: 300px; background: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20101%2082%22%20fill%3D%22%23ffffff%22%3E%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M81.8711%2016.1959C84.231%208.08485%2083.3379%202.43213%2079.4209%200.685979C74.4912%20-1.5104%2068.3077%201.95279%2062.9076%205.62998C57.0306%209.63242%2051.4749%2015.2064%2050.7456%2015.9477C39.9831%2010.4747%2030.335%206.97211%2022.0669%205.53411C13.4956%204.04304%208.3479%205.12667%205.53888%206.29762C2.95929%207.3727%201.15653%209.03154%200.464922%2010.9643C-0.641318%2014.0543%200.235479%2018.3015%203.00026%2023.2438C5.56837%2027.8386%209.6885%2032.9401%2014.9149%2037.9988C16.126%2039.1714%2017.3699%2040.3047%2018.6351%2041.4003C13.9234%2048.9071%2010.6702%2056.2905%206.58448%2068.4382C6.38945%2068.4091%206.18951%2068.3937%205.98629%2068.3937C3.68531%2068.3937%201.82027%2070.3419%201.82027%2072.7454C1.82027%2075.1489%203.68531%2077.0971%205.98629%2077.0971C8.28727%2077.0971%2010.1523%2075.1489%2010.1523%2072.7454C10.1523%2071.0215%209.19192%2069.5322%207.80052%2068.8268C11.8125%2056.9068%2015.0165%2049.6226%2019.6266%2042.2494C29.1862%2050.3211%2039.8421%2056.282%2047.5104%2060.269C46.2649%2061.5187%2038.2033%2069.5647%2034.7452%2071.9905C30.6169%2074.8887%2025.9822%2077.8589%2023.2305%2076.3918C20.1625%2074.7552%2020.7542%2069.1521%2021.7916%2064.7405C23.0142%2059.5329%2026.2952%2052.7452%2026.328%2052.6784L26.3952%2052.5397L25.7986%2052.1683L25.7118%2052.2573C22.9388%2055.0819%2020.2969%2060.37%2018.817%2066.0587C17.3043%2071.8723%2017.3338%2076.6349%2018.8941%2078.8021C20.4313%2080.9369%2022.2914%2082%2024.6744%2082C26.9098%2082%2029.6057%2081.0636%2032.9228%2079.1942C40.5747%2074.8836%2047.3892%2069.2257%2054.3675%2061.3869C61.3343%2053.5617%2066.5214%2047.1147%2072.4148%2037.3191C75.5024%2032.3837%2079.7799%2023.6684%2081.8727%2016.1942L81.8711%2016.1959ZM52.5582%2054.4776C41.2598%2048.6794%2029.4287%2040.5786%2023.8271%2035.9975C25.1529%2034.1401%2026.5951%2032.2005%2028.1799%2030.1188C28.7961%2030.4955%2029.5123%2030.7129%2030.2777%2030.7129C32.5754%2030.7129%2034.4437%2028.7613%2034.4437%2026.3612C34.4437%2023.9611%2032.5754%2022.0095%2030.2777%2022.0095C27.98%2022.0095%2026.1117%2023.9611%2026.1117%2026.3612C26.1117%2027.4842%2026.5214%2028.5114%2027.1933%2029.2834C25.6069%2031.3651%2024.163%2033.3064%2022.8339%2035.1656C22.5356%2034.9105%2022.2619%2034.6674%2022.0178%2034.4431C17.288%2030.1034%2010.7456%2023.718%208.5626%2018.3923C7.75955%2016.4338%207.78741%2014.7117%208.64782%2013.2737C9.93761%2011.1166%2013.0859%209.75568%2017.2847%209.54169C17.7731%209.51601%2018.2729%209.50403%2018.7843%209.50403C26.3886%209.50403%2036.507%2012.2722%2048.8969%2017.7452C48.1086%2018.7346%2044.1475%2023.7437%2042.4791%2026.6111L42.7315%2026.8097C45.5897%2023.5674%2049.4623%2019.0976%2050.0638%2018.4025C50.8111%2018.7774%2055.3262%2021.0611%2059.1382%2023.3174C62.8519%2025.5155%2065.5315%2027.3045%2066.9721%2028.2666C67.1638%2028.395%2067.3375%2028.5097%2067.4899%2028.6107C68.2307%2029.102%2068.8404%2028.9102%2069.1157%2028.5028C69.4156%2028.0594%2069.3681%2027.2822%2068.5585%2026.6214C67.2048%2025.5172%2058.5482%2019.7276%2051.9206%2016.5503C53.1137%2015.3707%2060.3363%208.33308%2065.9904%205.101C71.4347%201.98874%2075.4631%201.88945%2077.333%204.82024C78.7998%207.11763%2077.8214%2012.5906%2074.6518%2019.8371C69.3664%2031.6613%2060.0888%2046.204%2052.5598%2054.4759L52.5582%2054.4776ZM95.0394%208.35876C91.7453%208.35876%2089.0739%2011.1492%2089.0739%2014.5901C89.0739%2016.706%2090.0835%2018.5737%2091.6273%2019.7002C90.5407%2022.482%2087.2941%2030.3962%2082.7593%2037.8772C79.7094%2035.0286%2076.8823%2032.697%2075.8892%2032.0704L75.7564%2031.9865L74.5502%2033.957L74.6617%2034.0494C74.6944%2034.0768%2077.9001%2036.7422%2081.3532%2040.1113C75.2385%2049.5045%2066.2575%2059.2179%2065.2971%2060.2485C61.9391%2058.9748%2059.6102%2057.9305%2059.5873%2057.9203L59.4824%2057.8741L54.5936%2063.5097L54.8051%2063.5987C62.9388%2067.0242%2073.0605%2071.2869%2084.6342%2071.3006H84.6735C90.054%2071.3006%2093.8758%2070.0183%2096.0309%2067.4898C97.9271%2065.2644%2098.0812%2062.616%2097.8747%2060.7826C97.8599%2060.5481%2097.4223%2054.416%2091.3372%2046.9161C89.4689%2044.6136%2087.1613%2042.1245%2084.4769%2039.5155C85.1111%2038.574%2085.7093%2037.6461%2086.2567%2036.7559C89.8622%2030.8841%2093.1809%2023.9799%2094.6559%2020.8061C94.7821%2020.8146%2094.9083%2020.8198%2095.0345%2020.8198C98.3286%2020.8198%20101%2018.0293%20101%2014.5884C101%2011.1475%2098.3286%208.35705%2095.0345%208.35705L95.0394%208.35876ZM85.3881%2044.314C92.904%2053.103%2093.453%2058.3859%2093.1121%2060.7535C92.9417%2061.933%2092.3812%2062.8951%2091.447%2063.6141C89.4427%2065.1548%2085.8355%2065.5212%2080.7271%2064.7011C75.8433%2063.9171%2070.3317%2062.1093%2066.4837%2060.6936C73.2801%2053.8545%2078.8195%2047.4708%2082.9544%2041.7102C83.8426%2042.6175%2084.6604%2043.494%2085.3864%2044.3157L85.3881%2044.314Z%22%2F%3E%3C%2Fsvg%3E') no-repeat center / contain; opacity: 0.07; z-index: 0; pointer-events: none; } } /* Mobile: stop a concertina bar holding the pressed (navy) fill when a press turns into a scroll instead of a tap */ @media (max-width: 1023px) { .horizontal-concertina .trigger:not(.open) { background-color: transparent !important; } .horizontal-concertina .trigger:not(.open), .horizontal-concertina .trigger:not(.open) * { color: #114659 !important; } }