/* El Nawawy - header logo legibility guard. 25 Aug 2026. * Darkens the top 130px behind the transparent header so the white ELNAWAWY * wordmark stays legible on light hero images. Colour only, no layout change. * NOTE: single-colon :after is deliberate - LiteSpeed UCSS strips every * double-colon ::after rule, so ::after never reaches UCSS-served pages. */ header.elementor-location-header{position:relative} header.elementor-location-header:after{content:"";position:absolute;left:0;right:0;top:0;height:130px;background:linear-gradient(180deg,rgba(9,20,43,.58) 0%,rgba(9,20,43,.22) 60%,rgba(9,20,43,.012) 100%);pointer-events:none;z-index:0} /* ================================================================== EL NAWAWY - BRAND FONTS. Applied 26 Aug 2026. Family only: no font sizes, weights, line-heights, letter-spacing or colours are changed anywhere in this block. Body copy -> Inter (self-hosted, see @import above) Headings -> Playfair Display (unchanged) Hero tagline -> Rouge Script (unchanged, 5 homepages) The @import is at the very TOP of this box on purpose: CSS ignores @import unless it precedes every other rule. To remove: delete the @import line and this whole block, then Publish. ================================================================== */ /* 1. Body copy on one face */ body,p,li,dd,dt,td,th,a,figcaption,blockquote,label,input,select,textarea,button, .elementor-widget-text-editor,.elementor-widget-text-editor p, .elementor-icon-list-text,.elementor-post__excerpt,.elementor-post__title, .elementor-post__read-more,.elementor-post-date,.elementor-post__meta-data, .elementor-button-text,.elementor-nav-menu a,.elementor-tab-content, .elementor-icon-box-description,.elementor-image-box-description, [class*="enw-"],[class*="eln-"],[class*="lux-"],[class*="elna-"]{ font-family:"Inter","Segoe UI",system-ui,-apple-system,Arial,sans-serif!important; } /* 2. Headings keep the display face. The h1[class] selectors are needed as well as the bare h1 because some headings carry their own class (e.g. .enw-de-final-cta__title) which would outrank a plain element. */ h1,h2,h3,h4,h5,h6,.elementor-heading-title, /* Elementor display widgets that set no font-family of their own and therefore used to inherit Playfair from the page. Keep them Playfair. */ .elementor-headline,.elementor-headline *, .elementor-slide-heading,.elementor-slide-heading *, h1[class],h2[class],h3[class],h4[class],h5[class],h6[class], h1 *,h2 *,h3 *,h4 *,h5 *,h6 *,.elementor-heading-title *, h1 [class],h2 [class],h3 [class],h4 [class],h5 [class],h6 [class], .elementor-heading-title [class]{ font-family:"Playfair Display",Georgia,serif!important; } /* 3. Icon fonts must never inherit a text face */ .fa,.fas,.far,.fal,.fad,[class^="fa-"],[class*=" fa-"]{font-family:"Font Awesome 5 Free"!important} .fab{font-family:"Font Awesome 5 Brands"!important} .eicon,[class^="eicon-"],[class*=" eicon-"]{font-family:eicons!important} .dashicons,[class^="dashicons-"],[class*=" dashicons-"]{font-family:dashicons!important} /* 4. Keep the hero script tagline exactly as it is. One rule covers all five languages - the widget ID is identical on every homepage, only the page-ID wrapper differs (EN 821, DE 3430, FR 3385, ES 3592, IT 3420). This rule must stay LAST: it deliberately overrides rule 2 above. */ .elementor-element-53e63d02 .elementor-heading-title, .elementor-element-53e63d02 .elementor-heading-title *{ font-family:"Rouge Script","Segoe Script",cursive!important; } /* ------------------------------------------------------------------ EL NAWAWY - BUTTON SIZE. Applied 26 Aug 2026. Elementor core ships .elementor-button{font-size:14px}, which is the only off-scale value left that is not in the site's own data. Low specificity and no !important on purpose: a per-widget button size still overrides this. ------------------------------------------------------------------ */ .elementor-button{font-size:16px} /* ------------------------------------------------------------------ EL NAWAWY - PLUGIN DEFAULTS. Applied 26 Aug 2026. These sizes ship inside plugin stylesheets, so they cannot be fixed in the page data like everything else. Snapped to the scale here. Elementor Pro slides : 35px / 23px -> 36px / 24px Timeline addon label : 22px -> 24px No !important on purpose: per-widget settings still override. ------------------------------------------------------------------ */ .elementor-slides .swiper-slide-inner .elementor-slide-heading{font-size:36px} @media (max-width:767px){.elementor-slides .swiper-slide-inner .elementor-slide-heading{font-size:24px}} .twae-label-big,.twae-timeline .twae-label-big{font-size:24px} /* EL NAWAWY - POST CARD TITLE: card titles inherit ~21px from an em value; pin to the scale. */ .elementor-post__title,.elementor-post__title a{font-size:20px}/* ------------------------------------------------------------------ EL NAWAWY - FOOTER ROW WRAP. Applied 26 Aug 2026. Footer row could not wrap between ~770 and 810px, rendering the page about twice the viewport width and collapsing the third column to 0. Inert at phone and desktop widths - verified 390 / 1280 unchanged. ------------------------------------------------------------------ */ .elementor-element-6565ba1c > .e-con-inner{flex-wrap:wrap!important} /* ------------------------------------------------------------------ EL NAWAWY - TOUCH TARGETS. Applied 26 Aug 2026. WCAG 2.2 target size: standalone links were 14-22px tall on mobile. Links inside sentences are deliberately excluded (inline exception). ------------------------------------------------------------------ */ a[href^="tel:"],a[href^="mailto:"], .elementor-post__read-more,.enw-contact-line, .enw-product-card a,.enw-link-card a, [class*="breadcrumb"] a,.elementor-widget-breadcrumbs a{ display:inline-block;padding-top:5px;padding-bottom:5px} /* ------------------------------------------------------------------ EL NAWAWY - TARGET SPACING. Applied 26 Aug 2026. Header social icons were touching (0px gap); footer phone links were 5-6px apart. WCAG asks for 8px between adjacent targets. ------------------------------------------------------------------ */ .elementor-location-footer a[href^="tel:"],.elementor-location-footer a[href^="mailto:"], footer a[href^="tel:"],footer a[href^="mailto:"]{margin-bottom:4px} /* ------------------------------------------------------------------ EL NAWAWY - FOOTER BLEED. Applied 26 Aug 2026. Elementor's .elementor-inline-items has -8px side margins; its empty margin box reached 379px on a 375px viewport, giving every page a few px of sideways scroll on phones. Clipping the footer removes the phantom width. Verified: link positions and footer height unchanged. ------------------------------------------------------------------ */ .elementor-location-footer{overflow-x:clip} /* ------------------------------------------------------------------ EL NAWAWY - SLIDER FIT. Applied 26 Aug 2026. .eln-pp-slider declares width:100% but is a grid item, so its default min-width:auto let the inner flex track (flex:0 0 100% slides) push it to 369px inside a 343px column - 24px of sideways scroll on phones. min-width:0 lets the declared width:100% apply. 5 pages affected. ------------------------------------------------------------------ */ .eln-pp-slider{min-width:0} /* ------------------------------------------------------------------ EL NAWAWY - HEADING WRAP. Applied 26 Aug 2026. German compound words in hand-written headings ran off screen on phones (/de/unsere-produkte/ was 22px wide of the viewport). break-word only acts where text would otherwise overflow, so this is inert on every page that already fits - verified on 7 pages. ------------------------------------------------------------------ */ h1,h2,h3,h4,h5,h6,h1 *,h2 *,h3 *,h4 *,h5 *,h6 *, .elementor-heading-title,.elementor-heading-title *{overflow-wrap:break-word} /* ------------------------------------------------------------------ EL NAWAWY - ES TABLET ROW. Applied 26 Aug 2026. Post 3565 only. Two nowrap rows had a flex-shrink:0 child at 100% width, starving its sibling to 0px; the sibling's text then spilled 188px off-screen and stretched the page to 12,533px tall at 768px. Bounded to <=800px: from 801px up the two-column layout is correct. ------------------------------------------------------------------ */ @media (max-width:800px){ .elementor-element-4550fe8,.elementor-element-c1f18d4{flex-wrap:wrap} } /* ------------------------------------------------------------------ EL NAWAWY - TITLE+BREADCRUMB UNIFY. Applied 26 Aug 2026. One title treatment and one breadcrumb treatment everywhere except the five language homepages, whose hero styling is kept deliberately. title Playfair Display 48/700 -> 32/700 at <=800px breadcrumb Playfair Display 14/400 -> 12 at <=800px line-height intentionally left untouched. Broadened 26 Aug 2026 to every non-home h1 (incl. hand-written hero titles in HTML widgets, 22 pages). Colour deliberately not forced. ------------------------------------------------------------------ */ body:not(.home) h1:not(#elnawawy-none), body:not(.home) h1 *:not(#elnawawy-none){ font-family:"Playfair Display",Georgia,serif!important; font-size:48px!important;font-weight:700!important; letter-spacing:0!important;text-transform:none!important} .elementor-widget-breadcrumbs,.elementor-widget-breadcrumbs *, .rank-math-breadcrumb,.rank-math-breadcrumb *{ font-family:"Playfair Display",Georgia,serif!important; font-size:14px!important;font-weight:400!important; letter-spacing:0!important} @media (max-width:800px){ body:not(.home) h1:not(#elnawawy-none), body:not(.home) h1 *:not(#elnawawy-none){font-size:32px!important} .elementor-widget-breadcrumbs,.elementor-widget-breadcrumbs *, .rank-math-breadcrumb,.rank-math-breadcrumb *{font-size:12px!important} } /* ------------------------------------------------------------------ EL NAWAWY - FOCUS VISIBLE. Applied 27 Aug 2026. Several components removed the focus outline with no replacement, leaving keyboard users with no visible indicator. This restores one everywhere. :focus-visible = keyboard only, so pointer users are unaffected. 3px / 2px offset per the handbook. ------------------------------------------------------------------ */ a:focus-visible,button:focus-visible,summary:focus-visible, input:focus-visible,select:focus-visible,textarea:focus-visible, [tabindex]:focus-visible,[role="button"]:focus-visible, .elementor-tab-title:focus-visible,.elementor-accordion .elementor-tab-title:focus-visible, .elementor-toggle .elementor-tab-title:focus-visible, .piano-nav:focus-visible,.btn-cta:focus-visible,.faq-block summary:focus-visible{ outline:3px solid #C99700!important;outline-offset:2px!important} /* ------------------------------------------------------------------ EL NAWAWY - REDUCED MOTION. Applied 27 Aug 2026. Completes existing coverage: adds animation-duration and animation-iteration-count resets for custom keyframe animations that do not carry Elementor's .animated class. Inert unless the visitor has requested reduced motion. ------------------------------------------------------------------ */ @media (prefers-reduced-motion: reduce){ *,*::before,*::after{ animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; scroll-behavior:auto!important} } /* ------------------------------------------------------------------ EL NAWAWY - HOMEPAGE TYPE SCALE. Applied 27 Aug 2026. Restores a strict H1 > H2 > H3 order on the front page only. Measured on the live page before this change: 1440px H1 36 H2 24/32/36/48 H3 24/32 -> H2 "Valuable Topics" at 48px was larger than the H1 1009px H1 36 H2 24/36/48 H3 24/36 -> an H3 at 36px matched an H2 at 36px 375px H1 20 H2 20/24 H3 20/24 -> H1, H2 and H3 all rendered at 20px; an H3 at 24px was larger than the H1 After: 1440px H1 56 H2 36 H3 30 1009px H1 47 H2 27 H3 23 375px H1 32 H2 26 H3 20 Scoped to body.home; no other page is affected. Specificity is (0,4,2), which beats Elementor's per-widget (0,4,0) rules without needing !important. line-height is set explicitly because two of the widgets (cceafbc, 89e9b05) carry a fixed 34px line-height that would clip once the font-size rises. H3 caps at 30px rather than 24px on purpose: at 24px three of the five product-card headings drop from two lines to one, leaving that row ragged by 31px. At 30px all five stay at two lines and the row keeps the uniform height it has today. The posts-widget article titles (.elementor-post__title, 21px) are deliberately not matched by these rules and are unchanged. Verified on fresh page loads at 1440 / 1009 / 375: strict descending order at each width, document scrollWidth still equal to the viewport, no clipped containers, and no increase in the number of elements extending past the viewport. ------------------------------------------------------------------ */ body.home .elementor-widget-heading.elementor-element h1.elementor-heading-title{ font-size:clamp(32px,4.6vw,56px); line-height:1.1} body.home .elementor-widget-heading.elementor-element h2.elementor-heading-title{ font-size:clamp(26px,2.6vw,36px); line-height:1.18} body.home .elementor-widget-heading.elementor-element h3.elementor-heading-title{ font-size:clamp(20px,2.2vw,30px); line-height:1.25} /* ------------------------------------------------------------------ EL NAWAWY - BODY INK. Applied 29 Aug 2026 at the user's request ("choose the best for ui ux"), replacing the site default #060606 with #2A2F36. Why #2A2F36: - 13.48:1 on white, 12.64:1 on cream, 12.58:1 on the grey band. Clears AA (4.5) and AAA (7.0) on every ground the site uses. - The previous default sat at 20.26:1. Near-black on white causes halation and eye strain over long passages, and the product and article pages run 1,400-2,500 words. - Slate-biased rather than neutral, so it sits with the navy family (#1A3465, #0F2B46) instead of against it. - Not a new colour: it is already on the site as --enw-text. Mechanism: the site-wide body colour is a SINGLE inherited rule, `.elementor-kit-580{color:#060606}` at specificity (0,1,0). Every unstyled paragraph inherits from ; there are no inline colour attributes in the chain. `body.elementor-kit-580` is (0,2,1) and wins without !important. This is one declaration. Deleting it restores the previous ink exactly - no data was rewritten. SCOPE: covers text that inherits the Elementor default. The hand-coded pages set their own body colour (#54595F on the quality page, #2A2F36 in posts) and are NOT affected by this rule. ------------------------------------------------------------------ */ /* ------------------------------------------------------------------ EL NAWAWY - SUB-AA MUTED GREYS. Applied 29 Aug 2026. The last two text colours on the site below WCAG AA (4.5:1), both moved to #667085, which is already the muted value used elsewhere. #777777 4.48:1 -> #667085 4.97:1 #667085 4.29:1 -> #667085 4.97:1 #667085 also clears AA on the cream band (4.67:1), which is where some of these elements sit. 1. Article-card excerpts. Elementor's posts widget ships `.elementor-posts .elementor-post__excerpt p{color:#777777}` at (0,2,1). This appears wherever the posts widget is used - the homepage "Valuable Topics" grid and any archive listing. Overridden at (0,2,2). 2. Hand-coded page muted token. `.enq-wrap{--muted:#667085}` at (0,1,0) feeds `.enq-link-card span{color:var(--muted)}` on the quality page. Overridden at (0,1,1). Pages whose --muted is already #667085 (certifications) are unaffected in practice - the rule resolves to the value they already had. Neither rule needs !important; both win on specificity alone. Both are CSS only - no stored data was changed. ------------------------------------------------------------------ */ body .elementor-posts .elementor-post__excerpt p{color:#667085} body .enq-wrap{--muted:#667085} /* ------------------------------------------------------------------ EL NAWAWY - QUALITY + CERTIFICATIONS ONTO THE SHARED TOKEN SET. Applied 29 Aug 2026 at the user's request. Both pages ship their own private token block. Most of what they declare ALREADY matches the site system and is left untouched: --navy #1A3465 · --navy2 #0F2B46 · --gold #C99700 --line #E5E6EA · --cream #FCF7F0 · --wa/--green #128C7E --ok #027A48 · --warning #B54708 · --danger #B42318 Only the values that diverged are overridden below. QUALITY (.enq-wrap, specificity 0,1,0 -> overridden at 0,1,1) --text #54595F -> #2A2F36 dE 14.0, contrast 7.07 -> 13.48 66.5% of that page's text. This is the visible one, and it is the point of the exercise: the page previously read noticeably lighter than the homepage, about and posts. --muted #667085 -> #667085 dE 10.8, contrast 4.29 -> 4.97 Already applied on 29 Aug via a separate rule; declared here too so the token block is self-describing. Same value, so no additional visual change. CERTIFICATIONS (.enw-cert-page, 0,1,0 -> overridden at 0,1,1) --text #263244 -> #2A2F36 dE 5.6, contrast 12.95 -> 13.48 --soft #F7F9FC -> #FCF7F0 dE 5.3 A cool-white panel becomes the site's warm cream, which is what every other band on the site uses. .enw-section-head p #4B5565 -> #54595F dE 5.1 24.1% of that page's text. Hardcoded rather than tokenised; mapped to the secondary rung (7.54 -> 7.07), which preserves the intent that section intros sit lighter than body copy. SUPERSEDED 29 Aug (see ONE GOLD below): --gold2 was #E7B429. The shared system has no second gold; whatever uses it would break if it were dropped, so it stays until that page is rebuilt. All CSS, no stored data touched. Every rule wins on specificity alone - no !important anywhere. ------------------------------------------------------------------ */ body .enq-wrap{ --text:#2A2F36; --muted:#667085} body .enw-cert-page{ --text:#2A2F36; --soft:#FCF7F0} body .enw-cert-page .enw-section-head p{color:#54595F} /* Certifications FAQ answers: .enw-faq .faq-body (0,2,0) hardcodes #4B5565. These are primary reading content, so they take the body ink, not the secondary rung used for section intros. Overridden at (0,3,2). */ body .enw-cert-page .enw-faq .faq-body{color:#2A2F36} /* Certifications: two remaining off-system inks. .enw-meta-row span:last-child (0,2,1) hardcodes #263244 for metadata values - primary content, so it takes the body ink. Override (0,3,2). .enw-btn-gold keeps its own #102033: it is label text on a gold fill where dark ink is correct, and it is left as-is deliberately. */ body .enw-cert-page .enw-meta-row span:last-child{color:#2A2F36} /* ------------------------------------------------------------------ EL NAWAWY - CONTACT PAGE ONTO THE SHARED TOKEN SET. Applied 29 Aug 2026 at the user's request. The contact page's `:root` token block ALREADY matches the system on every value that matters: --enw-text #2A2F36 · --enw-muted #667085 · --enw-blue #1A3465 --enw-navy #0F2B46 · --enw-gold #C99700 · --enw-cream #FCF7F0 --enw-soft #FCF7F0 · --enw-border #E5E6EA · --enw-whatsapp #128C7E Nothing in that block needed changing. The problem was that the page barely USES its own tokens: 56.6% of its text is hardcoded slate values rather than var(--enw-text). Four different inks were doing one job, all at 16px/400 body copy: .enw-lead #394150 14.2% .enw-p / .enw-info-item span / a #3D4653 19.3% .enw-note #445061 2.6% .enw-product-card p / .enw-step span / .enw-trust-card p #4B5563 20.5% All four are body copy and all four now take the body ink #2A2F36 (13.48:1 on white, 12.64:1 on cream). Contrast improves in every case - the lightest of them was 7.56:1. Page rules sit at (0,1,0) and (0,1,1); a `body ` prefix takes these to (0,1,1) and (0,1,2), which wins without !important. NOT changed here - flagged to the user instead, because they are gold-family accents and the shared system has no compliant small gold to map them onto: #A77900 (--enw-gold-dark) eyebrows, 14 els - SINCE UNIFIED to #C99700 at 12px/800 and 16px/900. 3.90:1 on white, 3.66:1 on cream - below AA for text this size. #F1C04E one eyebrow - SINCE UNIFIED to #C99700 (see ONE GOLD below). ------------------------------------------------------------------ */ body .enw-lead, body .enw-p, body .enw-note, body .enw-info-item span, body .enw-info-item a, body .enw-product-card p, body .enw-step span, body .enw-trust-card p{color:#2A2F36} /* ------------------------------------------------------------------ EL NAWAWY - ONE GOLD. Applied 29 Aug 2026 at the user's request ("we need only one unified gold"). Six golds were in use. All five variants are now #C99700, the brand gold, consolidated in the database (212 _elementor_data rows and 66 page-content rows). Retired: #A77900, #E7B429, #F1C04E, #AA8A39, #F5AF00. The one rule below catches the last holdout: .enw-eyebrow carries a #F1C04E BORDER, written in a form the value replacement did not reach. Overridden at (0,1,1) against the page rule's (0,1,0). Contrast consequence, stated plainly: consolidating does NOT fix gold's contrast, because none of the six passed AA on a light ground to begin with (they ranged 1.69:1 to 3.90:1 on white). Three values improve, two get slightly worse: #F1C04E 1.69 -> 2.65 #E7B429 1.92 -> 2.65 #F5AF00 1.91 -> 2.65 #AA8A39 3.28 -> 2.65 #A77900 3.90 -> 2.65 No gold in the gold hue band clears 4.5:1 on white while still resembling #C99700 - the nearest compliant one measures dE2000 16.5 away, further than the darkened gold the user already rejected. So gold is governed by PLACEMENT, not by value: it works as a fill, as a border, and on dark grounds (5.85:1 on #1B252F), and it does not work as small text on white. ------------------------------------------------------------------ */ /* Last gold holdout: the eyebrow in the .enw-final CTA band carries a TRANSLUCENT border, rgba(241,192,78,.4), set through a variable - so neither the hex replacement nor a plain border-color override reached it. Matched at (0,2,2) and re-tinted to the brand gold at the same alpha, so the translucency is preserved and only the hue changes. */ /* Eyebrow borders: fixed at source instead. The base rule already used the brand gold at 34% alpha, rgba(201,151,0,.34) - the two override rules previously added here were unnecessary AND made 8 eyebrows fully opaque, losing that transparency. Both removed. The one genuine outlier was an inline style attribute carrying rgba(241,192,78,.4) on the .enw-final eyebrow across all five languages; that is now rgba(201,151,0,.4) in _elementor_data. */ /* ------------------------------------------------------------------ EL NAWAWY - FINAL PASS. Applied 29 Aug 2026 ("fix all"). Four Elementor / theme component defaults that are not stored in the database and so cannot be reached by a value replacement. Each ships at (0,4,0) or (0,5,0) widget specificity, which is why !important is used here - the same justification as the .orange-text override. 1. Post dates #ADADAD 2.24:1 (homepage) and #667085 4.29:1 (posts) -> #667085 4.97:1. Both were below AA; #ADADAD was the worst contrast on the site. 2. Post badges kept the orange fill #F47F20 and changed the LABEL from white (2.66:1) to navy (4.59:1). The orange is a distinct accent, not a gold, so it is preserved - only the text on it changes. This follows the logo kit's own rule: dark ink on orange, never white. 3. Read-more links #F47F20 as link text was 2.66:1 -> the link token #0066CC at 5.57:1. 4. Accordion titles #1F2124 (theme default, About page) -> the heading token #202020. ------------------------------------------------------------------ */ body .elementor-post-date{color:#667085!important} body .elementor-post__badge{color:#1A3465!important} body .elementor-post__read-more{color:#0066CC!important} body .e-n-accordion-item-title-text{color:#202020!important} /* ------------------------------------------------------------------ EL NAWAWY - WHITE-ON-GOLD LABELS. Applied 29 Aug 2026. Gold-filled buttons, badges and icon circles carried WHITE labels at 2.65:1. Navy on the same gold measures 4.59:1 and clears AA, so the gold fill is kept and only the label changes - the logo kit's own rule: dark ink on orange/gold, never white. The selectors below are the SAME ones that set the gold fill, taken from the page stylesheets rather than guessed. That matters: a blanket `.btn{color:#1A3465}` would have been wrong, because on /our-products/ `.btn` is navy-filled on 6 buttons and gold-filled on 6 others - navy text on the navy ones would have made them invisible. Matching the fill selector hits exactly the gold set. Each hand-coded page invented its own button class, hence the length of this list; it is not redundancy. `body ` prefix adds one element to each selector so it wins the tie against the page rule without !important. ------------------------------------------------------------------ */ body .enw-btn-mail, body .enw-btn-gold, body .enw-btn.gold, body .enw-yf-btn.gold, body .enw-mg-btn-gold, body .enw-de-final-cta__btn--email, body .btn-solid-gold, body .enw-ssl .btn-solid-gold, body .itq-btn.gold, body .frq-btn.gold, body .esq-btn.gold, body .deq-btn.gold, body .frp-btn.primary, body .enw-products .grid > article:nth-child(even) .card-actions .btn, body .enw-products .help-grid .box:nth-child(even) .btn, body .int-link, body .faq-qicon, body .enw-flax-page .enw-faq-icon, body .eln-faq .eln-icon, body .enw-ael .ael-fq .ael-badge, body .enw-ael .ael-em, body .enw-mg-lb-close, body .enw-mg-step::before{color:#1A3465!important} /* .enw-products .btn sets a white label with !important at (0,2,0), so the earlier (0,1,1) override lost even though it was also !important — with both important, specificity decides. Raised to (0,2,1). */ body .enw-products .btn-solid-gold, body .enw-products .btn.gold, body .enw-ssl .btn-solid-gold{color:#1A3465!important} /* .enw-ael .ael-quote a.ael-btn sets white with !important at (0,3,1), which outranked the earlier (0,2,1) override. Raised to (0,4,2). */ body .enw-ael .ael-quote a.ael-btn.ael-em{color:#1A3465!important} /* ------------------------------------------------------------------ EL NAWAWY - ACCENT-ORANGE BUTTON LABELS. Applied 29 Aug 2026. Elementor buttons filled with the accent orange #F47F20 carried white labels at 2.66:1. Navy on the same orange is 4.59:1, so the fill is kept and only the label changes - the logo kit rule again. The "202 elements" figure earlier was raw occurrences. Parsing the Elementor JSON properly resolves it to just EIGHT distinct button element IDs, repeated across five languages and their revisions. The rest of the 202 were badge/read-more settings (already handled in CSS) and a nested-tabs hover background. Elementor sets the label without !important, so !important here is sufficient regardless of its (0,4,0) specificity. ------------------------------------------------------------------ */ body .elementor-element-2664b3cf .elementor-button, body .elementor-element-29b6be25 .elementor-button, body .elementor-element-3113ce8 .elementor-button, body .elementor-element-35985ce .elementor-button, body .elementor-element-59479d4e .elementor-button, body .elementor-element-6a9e25d8 .elementor-button, body .elementor-element-754f8954 .elementor-button, body .elementor-element-75921ace .elementor-button{color:#1A3465!important} /* ------------------------------------------------------------------ EL NAWAWY - ELEMENTOR BUTTONS FILLED FROM THE GOLD ACCENT GLOBAL. Applied 29 Aug 2026. These buttons take their fill from Elementor global "accent" (#C99700) rather than a stored hex, so neither the hand-coded class sweep nor the #F47F20 JSON parse reached them. Found by parsing __globals__ in _elementor_data: 27 distinct element IDs. White label on gold is 2.65:1; navy is 4.59:1. Fill unchanged. ------------------------------------------------------------------ */ body .elementor-element-13836c5 .elementor-button, body .elementor-element-2354de2f .elementor-button, body .elementor-element-2a772507 .elementor-button, body .elementor-element-31b08d3 .elementor-button, body .elementor-element-3ae412c .elementor-button, body .elementor-element-3c0d131f .elementor-button, body .elementor-element-3d2e3403 .elementor-button, body .elementor-element-47a205ea .elementor-button, body .elementor-element-4ae77b0 .elementor-button, body .elementor-element-519fff02 .elementor-button, body .elementor-element-693dcd2c .elementor-button, body .elementor-element-6980e8e .elementor-button, body .elementor-element-6b9db75 .elementor-button, body .elementor-element-6c1957c0 .elementor-button, body .elementor-element-73d18ee8 .elementor-button, body .elementor-element-783116e1 .elementor-button, body .elementor-element-7b69713 .elementor-button, body .elementor-element-7f0500f .elementor-button, body .elementor-element-80a24c6 .elementor-button, body .elementor-element-9c4ba3e .elementor-button, body .elementor-element-a21f8e3 .elementor-button, body .elementor-element-a621126 .elementor-button, body .elementor-element-ad185f2 .elementor-button, body .elementor-element-c15ad74 .elementor-button, body .elementor-element-c4003ff .elementor-button, body .elementor-element-eb9d4b3 .elementor-button, body .elementor-element-f38ec8d .elementor-button{color:#1A3465!important} /* ------------------------------------------------------------------ EL NAWAWY - GOLD FILLS WITH WHITE LABELS, SITE-WIDE. Applied 29 Aug 2026. Gold #C99700 itself is UNCHANGED - only the label on it moves from white (2.65:1) to navy (4.59:1). Selectors enumerated by crawling all 201 published URLs and recording every element computing to gold background + white text. 25 distinct signatures, 543 elements. Not guessed, not sampled. TWO SIGNATURES DELIBERATELY EXCLUDED, because their fill is not always gold - navy text on them would be invisible: .btn.btn-primary fill is var(--col-cta) OR var(--col-primary) .enw-btn.enw-btn-primary fill is var(--enw-gold) OR var(--enw-blue) / var(--enw-navy) / var(--enw-navy-dark) A bare `a` signature (3 elements) is also excluded as too generic to target safely. ------------------------------------------------------------------ */ body a#cta-email-btn.elementor-button, body a#btn-cert-iso-22000.elementor-button, body a#btn-cert-iso-14001.elementor-button, body .ael-btn.ael-em, body .btn-cta.btn-mail, body .btn.btn-mail, body .btn.btn-solid-gold, body .btn.btn-accent, body .enq-btn.gold, body .hvl-btn.gold, body .elna-btn.elna-btn-gold, body .enw-gp-btn.enw-gp-btn-gold, body .eln-btn.eln-btn-primary, body .enw-license-btn.enw-license-btn-primary, body .enw-btn.enw-btn-product, body .faq-icon, body .fq-badge, body .enq-check, body .itq-check, body .deq-check, body .esq-check, body .frq-check{color:#1A3465!important} /* .enw-ael .ael-final a.ael-btn sets white with !important at (0,3,1). Raised to (0,4,2), scoped to the .ael-em gold variant only so the sibling WhatsApp button in the same block keeps its white label. */ body .enw-ael .ael-final a.ael-btn.ael-em, body .enw-ael .ael-cbtns a.ael-btn.ael-em{color:#1A3465!important} /* .btn-primary is GOLD by default — `.btn-primary{background:var(--col-cta)}` where --col-cta is #C99700 — and NAVY only inside two page wrappers: `.enw-flax .btn-primary` and `.enw-fr-lin .btn-primary` use var(--col-primary) = #1A3465. So: navy label by default (4.59:1 on gold), then white restored at higher specificity for the two navy-filled contexts (12.19:1). Verified from the stylesheets rather than assumed — a blanket rule here would have made the navy buttons invisible. */ /* .enw-hemp-b2b pairs a gold fill with a white label at (0,2,0): `.enw-hemp-b2b .enw-btn-primary{background:var(--enw-gold);color:var(--enw-white)}`. Scoped to that wrapper, where the fill is gold by the page's own rule — the bare .enw-btn-primary class is NOT safe to target, since elsewhere it resolves to var(--enw-navy) / var(--enw-blue). */ body .enw-hemp-b2b .enw-btn-primary{color:#1A3465!important} /* ------------------------------------------------------------------ EL NAWAWY - LAST WHITE-ON-GOLD LABELS. Applied 29 Aug 2026. From the final 201-URL crawl: 38 elements on 10 URLs. Gold #C99700 unchanged; only the label moves to navy (2.65:1 -> 4.59:1). 1. Inline gold fills. Some CTAs carry the fill in a style attribute: style="background:#C99700;color:#fff;...". An attribute selector matching that exact inline declaration is SELF-SCOPING - it can only ever match an element that inline-declares a gold background, so it cannot touch a navy-filled button. 2. .btn-primary on the ten specific pages where it renders gold. Scoped per post/page ID rather than globally: `.btn-primary` is navy inside .enw-flax, .enw-fr-lin and .en-hemp-jute, and a blanket rule made one of those invisible earlier. Static grep of the stylesheets did NOT reveal all three navy contexts - only the live crawl did - so this is scoped from crawl evidence. ------------------------------------------------------------------ */ body [style*="background:#C99700"]{color:#1A3465!important} body.postid-695 .btn.btn-primary, body.postid-714 .btn.btn-primary, body.postid-726 .btn.btn-primary, body.postid-3389 .btn.btn-primary, body.postid-3391 .btn.btn-primary, body.postid-3485 .btn.btn-primary, body.postid-10431 .btn.btn-primary, body.postid-11275 .btn.btn-primary, body.postid-11289 .btn.btn-primary, body.page-id-3490 .btn.btn-primary{color:#1A3465!important} /* ------------------------------------------------------------------ MYTH / FACT PILLS - on brand. Applied 29 Aug 2026. Was: myth #6B4E00 on #F3D9A4 (5.63:1), fact #2C5A2E on #D7E6D2 (6.19:1). Those two grounds measured 0.757 and 0.714 relative luminance - only 6% apart, so the states were nearly identical without colour. Navy and gold measure 0.036 and 0.346, so the pair now survives greyscale. Geometry is deliberately untouched: size, padding and radius all stay. ------------------------------------------------------------------ */ body .ael-my .ael-mx, body .enw-ael .ael-mx{background:#C99700;color:#1A3465} body .ael-my .ael-mc, body .enw-ael .ael-mc{background:#1A3465;color:#FFFFFF} /* Nested-accordion titles + icons: Elementor's #1F2124 default -> system heading ink #202020. deltaE2000 2.24 - imperceptible. Six custom properties, because the icons read from their own set. */ body .elementor-widget-n-accordion{ --n-accordion-title-normal-color:#202020; --n-accordion-title-hover-color:#202020; --n-accordion-title-active-color:#202020; --n-accordion-icon-normal-color:#202020; --n-accordion-icon-hover-color:#202020; --n-accordion-icon-active-color:#202020; } /* ------------------------------------------------------------------ FOOTER CONTACT BLOCK - was #000000 on #353535 = 1.71:1, on every page. Phone numbers, email and address were effectively unreadable. White on that ground is 12.27:1 and matches the rest of the footer, which is already white. The widget rule is (0,4,0) and is keyed to an element id, so !important is used rather than hard-coding that id. Scoped to footer: a 201-URL crawl found 40 .elementor-icon-box-title elements and ALL 40 are in the footer, so there is nothing else to hit. ------------------------------------------------------------------ */ body footer .elementor-icon-box-title{color:#FFFFFF!important} /* Footer policy links - were #0066CC on #1B252F = 2.79:1. #C9D4E8 is the system's existing light blue for text on dark grounds: 10.4:1. Deliberately (0,1,2): it beats the kit default `.elementor-kit-580 a` (0,1,1) which these links fall back to, while LOSING to the explicit white rule (0,3,1) on the contact links - so those stay white. */ body.elementor-kit-580 footer a{color:#C9D4E8} /* Hello Elementor's theme default figcaption{color:#333} -> system heading ink. Theme files are never edited; this overrides at (0,0,2). */ body figcaption{color:#202020} /* WhatsApp green fills set inline without a label colour inherit the kit link blue onto green. White is what every other WhatsApp button uses. Colour emoji ignore `color`, so nothing visible changes today - this protects the monochrome-fallback case, which would be blue on green at 1.35:1. Self-scoping: can only match elements that set this green inline. (0,2,1) beats `.elementor-kit-580 a` (0,1,1) regardless of stylesheet order. */ body.elementor-kit-580 [style*="background:#128C7E"]{color:#FFFFFF}