.elementor-42 .elementor-element.elementor-element-b2109cf{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-8f35758{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-df86554{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-de357f2{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-1c13fe0{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:stretch;--padding-top:120px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-d984dd7{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-b08fdde{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:120px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-b08fdde:not(.elementor-motion-effects-element-type-background), .elementor-42 .elementor-element.elementor-element-b08fdde > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F2EDE4;}.elementor-42 .elementor-element.elementor-element-fb0af7a{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-aef1638{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-1c7f989{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:120px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-cb781cb{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:120px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-2145eb0{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-2d138ae{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:120px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-91a552c{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:120px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-3646bbc{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}@media(max-width:1024px){.elementor-42 .elementor-element.elementor-element-1c13fe0{--padding-top:90px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-b08fdde{--padding-top:90px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-1c7f989{--padding-top:90px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-cb781cb{--padding-top:0px;--padding-bottom:90px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-2d138ae{--padding-top:90px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-91a552c{--padding-top:0px;--padding-bottom:90px;--padding-left:0px;--padding-right:0px;}}@media(max-width:767px){.elementor-42 .elementor-element.elementor-element-1c13fe0{--padding-top:80px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-b08fdde{--padding-top:80px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-1c7f989{--padding-top:80px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-cb781cb{--padding-top:0px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-2d138ae{--padding-top:80px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-42 .elementor-element.elementor-element-91a552c{--padding-top:0px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}}/* Start custom CSS *//* Hero: full-bleed ink collage sits at z-index -1 behind dark type. */ .pixor-hero .bg-image::after, .hero-section-s2 .bg-image::after{content:"";position:absolute;inset:0;background:rgba(242,237,228,.78);pointer-events:none} .pixor-hero .hero-wrap, .hero-section-s2 .hero-wrap{position:relative;z-index:2} /* The header is position:absolute over the hero, so the hero has to reserve room for it. Pixor's .title only pads 80px at mobile against an 84px bar, which buried the first line of the headline. */ @media (max-width:991.98px){ .pixor-hero .title, .hero-section-s2 .title{padding-top:132px !important} } @media (max-width:575.98px){ .pixor-hero .title, .hero-section-s2 .title{padding-top:124px !important;padding-bottom:72px !important} } /* -- Contact card --------------------------------------------------------- Switched to the theme's style-one layout: rounded card with the rotating badge on the left. The palette pass had forced .contact-wrap to cream, but the theme prints the heading, field text and badge in white - white on cream is invisible, which is what the old form styling was working around. Put the card back on brand red instead. White on #E90C0C measures 4.64:1 and clears 4.5:1; the usual #F2EDE4 cream would only reach 3.98:1, so the ink in this card is pure white rather than the site's cream. */ .contact-section .contact-wrap{background-color:#E90C0C !important;border:0 !important} /* Underline fields, as in the reference - no filled boxes. */ html body .contact-section .contact-wrap input[type="text"], html body .contact-section .contact-wrap input[type="email"], html body .contact-section .contact-wrap input[type="tel"], html body .contact-section .contact-wrap textarea, html body .contact-section .contact-wrap select{ background-color:transparent !important; color:#FFFFFF !important; border:0 !important; border-bottom:1px solid rgba(255,255,255,.55) !important; border-radius:0 !important; box-shadow:none !important; padding:10px 0 !important; } .contact-section .contact-wrap ::placeholder{color:#FFFFFF !important;opacity:.85} /* There was no visible focus state; white on red is unmistakable. */ html body .contact-section .contact-wrap input:focus, html body .contact-section .contact-wrap textarea:focus, html body .contact-section .contact-wrap select:focus{ border-bottom-color:#FFFFFF !important; outline:2px solid #FFFFFF !important; outline-offset:3px !important; } /* The dropdown list itself is painted by the OS, so the options need their own ground or they inherit white-on-white. */ .contact-section .contact-wrap select option{color:#121725;background:#FFFFFF} /* Submit: the old red button would disappear on a red card. White pill with dark ink, as in the reference - 17.9:1. Pixor's body.elementor-page-42 rule is (0,3,2) and beats shorter body.elementor-page-42s even with !important, hence the depth. */ html body .contact-section .contact-wrap .wpcf7 form.wpcf7-form input.wpcf7-submit, html body .contact-section .contact-wrap .wpcf7 form.wpcf7-form input[type="submit"]{ background-color:#FFFFFF !important;border-color:#FFFFFF !important;color:#121725 !important; } html body .contact-section .contact-wrap .wpcf7 form.wpcf7-form input.wpcf7-submit:hover, html body .contact-section .contact-wrap .wpcf7 form.wpcf7-form input[type="submit"]:hover{ background-color:#121725 !important;border-color:#121725 !important;color:#FFFFFF !important; } /* CF7 prints validation text in red, which vanishes on this card. */ .contact-section .contact-wrap .wpcf7-not-valid-tip, .contact-section .contact-wrap .wpcf7-response-output{ color:#FFFFFF !important;border-color:rgba(255,255,255,.7) !important; } /* Decorative watermark behind the projects grid. */ .pixor-project .marquee h2, .project-section-s2 .marquee h2{color:#E6DFD1 !important} /* Accessible H1: Pixor's hero hardcodes an H2 and exposes no heading-level control. */ .dl-sr-h1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0} /* Blog card links sit below the large-text threshold; #D40A0A measures 4.68:1. */ .blog-card .content a, .blog-card .content a span, .blog-card .content h3 a, .blog-section-s2 .blog-card .content a, .blog-section-s3 .blog-card .content a{color:#D40A0A !important} /* About section image pair. Each image was rendering at its own aspect ratio, so the row came out 253px tall on the left and 1057px on the right. Both now share one height and crop to fill. The portrait Galata Tower collage sits in the narrow left slot and the landscape windmill in the wide right slot, which is the pairing that loses least of each composition; object-position keeps the tower and the windmill inside the visible window. */ @media (min-width:992px){ .about-section-s2 .top-img .row img{ display:block; width:100%; height:clamp(340px,36vw,530px); object-fit:cover; } .about-section-s2 .top-img .row .col-lg-5 img{object-position:50% 58%} .about-section-s2 .top-img .row .col-lg-7 img{object-position:70% 50%} } @media (max-width:991.98px){ .about-section-s2 .top-img .row img{ display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; } .about-section-s2 .top-img .row .col-lg-5 img{object-position:50% 45%} .about-section-s2 .top-img .row .col-lg-7 img{object-position:70% 50%} } /* "How We Think" collage. The images are uploaded at 2x for retina and the theme renders them at intrinsic size, so pin them back to the layout dimensions the section expects. */ .award-section .image .shape.image-1 img{width:238px;height:267px;object-fit:cover} .award-section .image .shape.image-2 img{width:238px;height:205px;object-fit:cover} .award-section .image .shape.image-3 img{width:238px;height:392px;object-fit:cover} @media (max-width:991.98px){ .award-section .image .shape img{max-width:100%;height:auto} } /* Work showcase band. The page runs one flat cream from the services block all the way down, so the portfolio had nothing setting it apart. #EAE4D8 is the page ground darkened about 8% at the same hue - enough to read as its own panel without becoming a colour block. */ .elementor-element-b08fdde, .elementor-element-fb0af7a, .elementor-element-fb0af7a .project-section-s2{background-color:#EAE4D8 !important} /* Both red items in this band are small text by WCAG - an 18px bold eyebrow and a 17px link - so they need 4.5:1. #E90C0C was already short at 3.98:1 on the cream ground and falls to 3.67:1 on the tint. #C90808 measures 4.71:1 and is indistinguishable from the brand red at this size. */ .elementor-element-b08fdde .section-title-s2 .title>p, .elementor-element-b08fdde .section-title-s2 .title-bottom a, .elementor-element-b08fdde .section-title-s2 .title-bottom a span{color:#C90808 !important}/* End custom CSS */