/* Phase 3A: component styling only. Home 2 content/data and section order are preserved. */
/* Engitech's Bootstrap stylesheet uses a 10px root; restore user-default rem units. */
html { font-size: 100%; }
body.lavinty-brand {
  color: var(--lavinty-text);
  background: var(--lavinty-background);
  font-family: var(--lavinty-font-body);
  font-size: var(--lavinty-text-body);
  line-height: var(--lavinty-line-body);
}
.lavinty-brand.elementor-kit-6 {
  --e-global-color-primary: var(--lavinty-navy);
  --e-global-color-secondary: var(--lavinty-silver);
  --e-global-color-text: var(--lavinty-navy);
  --e-global-color-accent: var(--lavinty-teal);
}
.lavinty-brand #page :is(p, button, input, select, textarea, .octf-btn, .elementor-button,
  .elementor-heading-title, .elementor-icon-box-title, .elementor-icon-box-description,
  .ot-heading, .font-main, .font-second, .main-navigation, .mobile_mainmenu, .ot-counter,
  .ot-counter2, .footer-menu, .elementor-icon-list-text) {
  font-family: var(--lavinty-font-body);
}
.lavinty-brand #page :is(h1, h2, h3, h4, h5, h6) {
  font-family: var(--lavinty-font-body);
  font-weight: var(--lavinty-weight-bold);
  line-height: var(--lavinty-line-heading);
  letter-spacing: -0.025em;
  color: var(--lavinty-navy);
}
.lavinty-brand #page h1 { font-size: var(--lavinty-text-h1); }
.lavinty-brand #page h2 { font-size: var(--lavinty-text-h2); }
.lavinty-brand #page h3 { font-size: var(--lavinty-text-h3); }
.lavinty-brand #page h4 { font-size: var(--lavinty-text-h4); }
.lavinty-brand #page h5 { font-size: var(--lavinty-text-h5); }
.lavinty-brand #page h6 { font-size: var(--lavinty-text-h6); }
.lavinty-brand #content .elementor-2451 > .elementor-section:first-child h2 {
  font-size: var(--lavinty-text-display);
  line-height: 1.08;
}
.lavinty-brand #page a { color: var(--lavinty-link); }
.lavinty-brand #page a:hover { color: var(--lavinty-navy); }
.lavinty-brand #page :is(.ot-heading > span, .btn-details, .btn-details:visited) { color: var(--lavinty-link); }
.lavinty-brand #page .page-header { background-color: var(--lavinty-navy); background-blend-mode: multiply; }
.lavinty-brand #page .page-header :is(h1, .breadcrumbs, .breadcrumbs a) { color: var(--lavinty-white); }
.lavinty-brand #page :is(.ot-heading h2, .elementor-heading-title) { text-wrap: balance; }
.lavinty-brand #page a:focus-visible,
.lavinty-brand #page :is(button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--lavinty-navy);
  outline-offset: 4px;
  box-shadow: 0 0 0 3px var(--lavinty-white);
}

/* Approved Lavinty Tech logo (PNG copies of assets/brand/Logo/PNG). Never stretched, cropped or recoloured.
   Brand minimum width for the horizontal logo is 180px; width is set, height follows the 560:150 ratio. */
.lavinty-brand #page .lavinty-logo {
  display: inline-block;
  line-height: 0;
  text-decoration: none;
  border: 0;
}
.lavinty-brand #page .lavinty-logo__img {
  display: block;
  width: 200px;
  max-width: 100%;
  height: auto;
  aspect-ratio: 560 / 150;
}

/* Existing header layout and menu IDs are retained. */
.lavinty-brand #site-header .lavinty-topbar { color: var(--lavinty-silver); background-color: var(--lavinty-navy); }
.lavinty-brand #site-header :is(.elementor-element-755e8132, .elementor-element-55212198) { background-color: var(--lavinty-white); border-color: var(--lavinty-border); }
.lavinty-brand #site-header .lavinty-topbar a { color: var(--lavinty-white); }
.lavinty-brand #site-header .lavinty-topbar a:hover { color: var(--lavinty-teal); }
.lavinty-contact-row, .lavinty-identity { display: flex; flex-wrap: wrap; align-items: center; gap: var(--lavinty-space-5); }
.lavinty-identity { justify-content: flex-end; }
.lavinty-brand #site-header .lavinty-topbar { font-size: var(--lavinty-text-small); line-height: 1.5; }
.lavinty-brand #site-header .lavinty-topbar .elementor-widget-container { padding-block: var(--lavinty-space-2); }
.lavinty-brand #site-header .main-navigation > ul > li > a {
  color: var(--lavinty-navy);
  font-family: var(--lavinty-font-body);
  font-weight: var(--lavinty-weight-semibold);
  font-size: 0.9375rem;
  padding-inline: var(--lavinty-space-3);
}
.lavinty-brand #site-header .main-navigation > ul > li.current-menu-item > a { color: var(--lavinty-link); }
.lavinty-brand #site-header .main-navigation > ul > li { margin-inline: var(--lavinty-space-2); }
.lavinty-brand #site-header .main-navigation > ul > li::before { background: var(--lavinty-link); }
.lavinty-brand #site-header .main-navigation li:focus-within > ul { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); transition: none; }
.lavinty-brand #site-header .main-navigation li.lavinty-menu-collapsed > ul { opacity: 0; visibility: hidden; pointer-events: none; }
.lavinty-brand #site-header .main-navigation ul ul { background: var(--lavinty-white); border-color: var(--lavinty-border); }
.lavinty-brand #site-header .main-navigation ul ul a { color: var(--lavinty-navy); }
.lavinty-brand #site-header .main-navigation ul ul a:hover { color: var(--lavinty-link); }
.lavinty-brand #site-header .lavinty-header-phone { display: flex; flex-direction: column; align-items: flex-start; font-size: var(--lavinty-text-small); line-height: 1.4; white-space: nowrap; }
.lavinty-brand #site-header .lavinty-header-phone::before { content: var(--lavinty-call-label, 'Call us'); display: block; color: var(--lavinty-muted); }
.lavinty-brand #site-header .lavinty-header-phone a { color: var(--lavinty-navy); font-weight: var(--lavinty-weight-semibold); }
.lavinty-brand #site-header .octf-search .toggle-search { color: var(--lavinty-navy); cursor: pointer; }
.lavinty-brand #site-header .elementor-widget-isearch { margin: 0; }
.lavinty-brand #site-header .elementor-element-1534b56a > .elementor-widget-wrap { padding-inline: var(--lavinty-space-1); }
.lavinty-brand #site-header .mmenu-wrapper { background: var(--lavinty-navy); }
.lavinty-brand #site-header .mmenu-wrapper :is(a, .arrow, i) { color: var(--lavinty-white); }
.lavinty-brand #site-header .mmenu-wrapper a:hover { color: var(--lavinty-teal); }
.lavinty-brand #site-header .mmenu-wrapper .arrow { cursor: pointer; }
.lavinty-brand #site-header .mmenu-wrapper .mobile_mainmenu li a { font-weight: var(--lavinty-weight-medium); border-color: var(--lavinty-silver); }
.lavinty-brand #site-header :is(.mmenu-close, .toggle-search, .mmenu-toggle button) { min-width: var(--lavinty-control-height); min-height: var(--lavinty-control-height); }
.lavinty-brand #site-header .mmenu-toggle button { position: relative; padding: 0; border: 0; background: transparent; }
.lavinty-brand #site-header .mmenu-toggle button::before,
.lavinty-brand #site-header .mmenu-toggle button::after { left: 10px; right: auto; width: 24px; background: var(--lavinty-navy); margin: 0; }
.lavinty-brand #site-header .mmenu-toggle:not(.active) button::before { top: 14px; height: 10px; background: transparent; border-block: 2px solid var(--lavinty-navy); transform: none; }
.lavinty-brand #site-header .mmenu-toggle:not(.active) button::after { top: 30px; bottom: auto; height: 2px; transform: none; }
.lavinty-brand #site-header .mmenu-toggle.active button::before { top: 21px; height: 2px; border: 0; transform: rotate(45deg); }
.lavinty-brand #site-header .mmenu-toggle.active button::after { top: 21px; bottom: auto; height: 2px; transform: rotate(-45deg); }

/* Flat button variants; dark navy text on bright teal meets the contrast target. */
.lavinty-brand #page :is(.octf-btn, .elementor-button, button[type=submit], input[type=submit], .search-submit, .lavinty-btn) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--lavinty-control-height);
  padding: var(--lavinty-space-3) var(--lavinty-space-5);
  color: var(--lavinty-white);
  background: var(--lavinty-navy);
  border: 1px solid var(--lavinty-navy);
  border-radius: var(--lavinty-radius-control);
  font-family: var(--lavinty-font-body);
  font-size: 0.9375rem;
  font-weight: var(--lavinty-weight-semibold);
  line-height: 1.4;
  letter-spacing: 0;
  text-decoration: none;
  box-shadow: none;
  transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
}
.lavinty-brand #page :is(.octf-btn, .elementor-button, button[type=submit], input[type=submit], .search-submit, .lavinty-btn):hover {
  color: var(--lavinty-on-accent);
  background: var(--lavinty-teal);
  border-color: var(--lavinty-link);
}
.lavinty-brand #page :is(.octf-btn.octf-btn-second, .lavinty-btn.lavinty-btn-secondary),
.lavinty-brand #page .lavinty-btn-secondary :is(.octf-btn, .elementor-button) {
  color: var(--lavinty-navy);
  background: var(--lavinty-white);
  border-color: var(--lavinty-navy);
}
.lavinty-brand #page :is(.octf-btn.octf-btn-second, .lavinty-btn.lavinty-btn-secondary):hover,
.lavinty-brand #page .lavinty-btn-secondary :is(.octf-btn, .elementor-button):hover { color: var(--lavinty-white); background: var(--lavinty-navy); }
.lavinty-brand #page .lavinty-btn.lavinty-btn-accent,
.lavinty-brand #page .lavinty-btn-accent :is(.octf-btn, .elementor-button) { color: var(--lavinty-navy); background: var(--lavinty-teal); border-color: var(--lavinty-link); }
.lavinty-brand #page :is(.octf-btn, .elementor-button) :is(i, span) { color: inherit; }
.lavinty-brand #page :is(.btn-details, .btn-link):hover { text-decoration: underline; text-underline-offset: 0.2em; }
.lavinty-brand #page .video-popup a { background: var(--lavinty-navy); color: var(--lavinty-white); }
.lavinty-brand #page .video-popup a i { color: inherit; }
.lavinty-brand #page .video-popup a:hover { background: var(--lavinty-teal); color: var(--lavinty-navy); }
.lavinty-brand #page .video-popup a::before,
.lavinty-brand #page .video-popup a::after { animation: none; box-shadow: none; border-color: var(--lavinty-border); }

/* Forms and cards share tokens without resetting Elementor section dimensions. */
.lavinty-brand #page :is(input:not([type=checkbox]):not([type=radio]):not([type=submit]), textarea, select) {
  color: var(--lavinty-navy);
  background: var(--lavinty-white);
  border: 1px solid var(--lavinty-muted);
  border-radius: var(--lavinty-radius-control);
  min-height: var(--lavinty-control-height);
  padding: var(--lavinty-space-3) var(--lavinty-space-4);
  font-size: 1rem;
}
.lavinty-brand #page :is(input, textarea)::placeholder { color: var(--lavinty-muted); opacity: 1; }
.lavinty-brand #page .wpcf7 .main-form { background: var(--lavinty-navy); border-radius: var(--lavinty-radius-panel); }
.lavinty-brand #page .wpcf7 .main-form :is(h2, h3, p, label) { color: var(--lavinty-white); }
.lavinty-brand #page .wpcf7 .main-form button { color: var(--lavinty-navy); background: var(--lavinty-teal); border-color: var(--lavinty-teal); }
.lavinty-brand #page .lavinty-field-label { display: block; margin-block-end: var(--lavinty-space-2); font-size: var(--lavinty-text-small); font-weight: var(--lavinty-weight-medium); }
.lavinty-brand #page .lavinty-surface-dark { --lavinty-link: var(--lavinty-teal); background: var(--lavinty-navy); color: var(--lavinty-silver); }
.lavinty-brand #page .lavinty-surface-dark :is(h1,h2,h3,h4,h5,h6) { color: var(--lavinty-white); }
.lavinty-brand #page :is(.wpcf7 .main-form, .support-box .overlay) { --lavinty-link: var(--lavinty-teal); }
.lavinty-brand #page :is(.lavinty-surface-dark, .wpcf7 .main-form, .support-box .overlay) a:not(.lavinty-btn):not(.octf-btn):not(.elementor-button):hover { color: var(--lavinty-white); }
.lavinty-brand #page :is(.post-cat a, .blog-post .share-post a, .project-slider .projects-box:hover .portfolio-info .btn-link) { color: var(--lavinty-white); }
.lavinty-brand #page .project-slider .portfolio-info .btn-link i { color: inherit; }
.lavinty-brand #page :is(.icon-box-s1, .support-box, .ot-pricing-table .inner-table, .post-box .inner-post) { border-radius: var(--lavinty-radius-card); }
.lavinty-brand #page :is(.projects-box img, .team-wrap img) { border-radius: var(--lavinty-radius-card); }
.lavinty-brand #page :is(.ot-counter, .ot-counter2 .s-num, .service-box .big-number, .serv-box-2 .big-number) { font-weight: var(--lavinty-weight-bold); }
.lavinty-brand #page .support-box h3 { color: var(--lavinty-white); }
.lavinty-brand #page .support-box .inner-box { box-shadow: none; }
.lavinty-brand #page .support-box .number-box { font-family: var(--lavinty-font-body); }
.lavinty-brand #page .support-box .overlay { background: var(--lavinty-navy); color: var(--lavinty-silver); }
.lavinty-brand #page .support-box .overlay .btn-details { color: var(--lavinty-teal); }
.lavinty-brand #page .support-box:focus-within .inner-box { transform: rotateY(180deg); }
.lavinty-brand #page .support-box:focus-within .content-box { opacity: 0; }

/* Existing Home 2 surfaces only; no post data, imagery or section ordering is changed. */
.lavinty-brand #content :is(.elementor-element-9f02940, .elementor-element-0de210b, .elementor-element-132194b) { background-color: var(--lavinty-off-white); }
.lavinty-brand #content .elementor-element-67682de { background-color: var(--lavinty-navy); }
.lavinty-brand #content :is(.elementor-element-67682de, .elementor-element-5e43404, .elementor-element-d074110) :is(h1,h2,h3,h4,h5,h6) { color: var(--lavinty-white); }
.lavinty-brand #content :is(.elementor-element-67682de, .elementor-element-5e43404, .elementor-element-d074110) .ot-heading > span { color: var(--lavinty-teal); }
.lavinty-brand #content .elementor-element-67682de .tech-box { border-color: var(--lavinty-silver); }
.lavinty-brand #content .elementor-element-67682de .tech-box:hover { background: var(--lavinty-teal); border-color: var(--lavinty-teal); }
.lavinty-brand #content .elementor-element-67682de .tech-box:hover :is(h5,i) { color: var(--lavinty-navy); }
.lavinty-brand #content :is(.elementor-element-5e43404, .elementor-element-d074110) .octf-btn { background: var(--lavinty-teal); color: var(--lavinty-navy); border-color: var(--lavinty-teal); }
.lavinty-brand #content :is(.elementor-element-5e43404, .elementor-element-d074110) .octf-btn:hover { background: var(--lavinty-white); color: var(--lavinty-navy); }

/* Footer identity content is driven by central WordPress contact settings. */
.lavinty-brand #site-footer { color: var(--lavinty-silver); }
.lavinty-brand #site-footer .elementor-top-section { background-color: var(--lavinty-navy); }
.lavinty-brand #site-footer :is(a, h3) { color: var(--lavinty-white); }
.lavinty-brand #site-footer a:hover { color: var(--lavinty-teal); }
.lavinty-brand #site-footer .lavinty-logo__img { width: 240px; }
.lavinty-brand #site-footer .lavinty-contact-card { padding-block: var(--lavinty-space-5); border-block-start: 1px solid var(--lavinty-silver); }
.lavinty-brand #site-footer .lavinty-contact-card h3 { font-size: var(--lavinty-text-small); font-weight: var(--lavinty-weight-medium); letter-spacing: 0.03em; margin-block-end: var(--lavinty-space-3); color: var(--lavinty-silver); }
.lavinty-brand #site-footer .lavinty-contact-link { font-size: 1rem; overflow-wrap: anywhere; }
.lavinty-brand #site-footer .lavinty-copyright { color: var(--lavinty-silver); margin: 0; font-size: var(--lavinty-text-small); }
.lavinty-brand #site-footer .footer-menu ul { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--lavinty-space-3) var(--lavinty-space-5); padding: 0; }
.lavinty-brand #site-footer .footer-menu li { padding: 0; }
.lavinty-brand #side-panel { background: var(--lavinty-off-white); color: var(--lavinty-navy); }
.lavinty-brand #side-panel .lavinty-contact-link { overflow-wrap: anywhere; }
.lavinty-brand #page .lavinty-page-contact .lavinty-contact-card { padding-block: var(--lavinty-space-4); border-block-end: 1px solid var(--lavinty-border); }
.lavinty-brand #page .lavinty-page-contact h3 { font-size: var(--lavinty-text-small); color: var(--lavinty-muted); margin-block-end: var(--lavinty-space-2); }
.lavinty-brand #page .lavinty-page-contact a { overflow-wrap: anywhere; font-weight: var(--lavinty-weight-semibold); }

/* Language preparation only: no Arabic page, translation or WPML activation. */
.lavinty-brand:lang(ar), .lavinty-brand [lang^=ar], .lavinty-brand[dir=rtl], html[dir=rtl] .lavinty-brand, .lavinty-brand.rtl {
  --lavinty-font-body: var(--lavinty-font-ar);
  --lavinty-weight-semibold: 500;
  font-family: var(--lavinty-font-ar);
  letter-spacing: normal;
}
:is(html[dir=rtl] .lavinty-brand, .lavinty-brand.rtl, .lavinty-brand[dir=rtl]) { text-align: start; }
:is(html[dir=rtl] .lavinty-brand, .lavinty-brand.rtl, .lavinty-brand[dir=rtl]) #page :is(h1,h2,h3,h4,h5,h6) { letter-spacing: normal; }
:is(html[dir=rtl] .lavinty-brand, .lavinty-brand.rtl, .lavinty-brand[dir=rtl]) .lavinty-contact-row { flex-direction: row; }
:is(html[dir=rtl] .lavinty-brand, .lavinty-brand.rtl, .lavinty-brand[dir=rtl]) .main-navigation ul ul { left: auto; right: 0; }
:is(html[dir=rtl] .lavinty-brand, .lavinty-brand.rtl, .lavinty-brand[dir=rtl]) .main-navigation ul ul ul { right: 100%; }
:is(html[dir=rtl] .lavinty-brand, .lavinty-brand.rtl, .lavinty-brand[dir=rtl]) .mmenu-wrapper.on-right { right: auto; left: 0; }
:is(html[dir=rtl] .lavinty-brand, .lavinty-brand.rtl, .lavinty-brand[dir=rtl]) .mmenu-wrapper.on-right:not(.mmenu-open) { transform: translateX(-100%); }
:is(html[dir=rtl] .lavinty-brand, .lavinty-brand.rtl, .lavinty-brand[dir=rtl]) .mmenu-wrapper.mmenu-open { transform: translateX(0); }

@media (max-width: 1365px) and (min-width: 1280px) {
  .lavinty-brand #site-header .main-navigation > ul > li > a { font-size: 0.875rem; }
}
@media (max-width: 1279px) {
  .lavinty-brand #site-header .header-desktop { display: none; }
  .lavinty-brand #site-header .header-mobile { display: block; }
  .lavinty-brand #site-header .lavinty-header-phone { font-size: 0.8125rem; }
  .lavinty-brand #site-header .elementor-widget-imenu_mobile { margin-inline-start: var(--lavinty-space-3); }
}
@media (max-width: 1024px) {
  .lavinty-brand #site-header .lavinty-logo__img { width: 190px; }
}
@media (max-width: 767px) {
  .lavinty-brand { --lavinty-text-body: 1rem; }
  .lavinty-brand #page .lavinty-logo__img { width: 184px; }
  .lavinty-brand #site-footer .lavinty-logo__img { width: 220px; }
  .lavinty-brand #site-footer .lavinty-contact-card { padding-block: var(--lavinty-space-4); }
  .lavinty-brand #page :is(.octf-btn, .elementor-button) { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .lavinty-brand #page :is(.octf-btn, .elementor-button, .mmenu-wrapper, .support-box .inner-box, .support-box .inner-box > div) { transition: none; }
}

/* Desktop header: give the approved horizontal logo room to be legible (brand minimum 180px; ~125px of the file is artwork). */
@media (min-width: 1280px) {
  .lavinty-brand #site-header .header-desktop .lavinty-logo__img { width: 200px; max-width: none; }
}
@media (min-width: 1440px) {
  .lavinty-brand #site-header .header-desktop .lavinty-logo__img { width: 220px; }
}

/* Footer: larger approved dark logo (navy-plate variant) for legibility of the symbol and the TECH line. */
.lavinty-brand #site-footer .lavinty-logo__img { width: 300px; }
@media (max-width: 767px) {
  .lavinty-brand #site-footer .lavinty-logo__img { width: 260px; }
}