/* Orange-One Home Phase 1 — intentionally scoped to the real Home page only. */
body.home.page-id-10 {
	--oo-teal-dark: #156b75;
	--oo-teal: #1d8c9b;
	--oo-teal-light: #39a8b5;
	--oo-orange: #f47a20;
	--oo-text-dark: #203547;
	--oo-bg-light: #f7f8f9;
	--oo-border-neutral: #dce2e6;

	/* Feed the existing Home/header components without changing their markup. */
	--ooc-header-orange: var(--oo-orange);
	--ooc-header-blue: var(--oo-teal);
	--ooc-header-text: var(--oo-text-dark);
}

/* Home hero image only; preserve Elementor's existing position, size and overlay. */
body.home.page-id-10 .elementor-10 .elementor-element.elementor-element-b147f27:not(.elementor-motion-effects-element-type-background),
body.home.page-id-10 .elementor-10 .elementor-element.elementor-element-b147f27 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
	background-image: url('https://orange-one.com/wp-content/uploads/2026/09/DC4B9105-3C44-4556-9887-FC4D360BA2BF.png') !important;
}

/* Existing navy/blue Home controls. Orange identity controls remain orange. */
body.home.page-id-10 .header-main-wrap .main-nav .nav-link,
body.home.page-id-10 .header-main-wrap .login-register-nav a,
body.home.page-id-10 .header-main-wrap .logged-in-nav > a,
body.home.page-id-10 #nav-mobile .nav-mobile-trigger,
body.home.page-id-10 #nav-mobile .mobile-navbar-nav a {
	color: var(--oo-teal-dark) !important;
}

body.home.page-id-10 .header-main-wrap .main-nav .nav-link:hover,
body.home.page-id-10 .header-main-wrap .main-nav .nav-link:focus-visible,
body.home.page-id-10 .header-main-wrap .main-nav .nav-link.active,
body.home.page-id-10 .header-main-wrap .login-register-nav a:hover,
body.home.page-id-10 .header-main-wrap .login-register-nav a:focus-visible,
body.home.page-id-10 .header-main-wrap .logged-in-nav > a:hover,
body.home.page-id-10 .header-main-wrap .logged-in-nav > a:focus-visible,
body.home.page-id-10 #nav-mobile .mobile-navbar-nav a:hover,
body.home.page-id-10 #nav-mobile .mobile-navbar-nav a:focus-visible {
	color: var(--oo-teal-light) !important;
}

body.home.page-id-10 .header-main-wrap .dropdown-menu,
body.home.page-id-10 #nav-mobile .mobile-navbar-nav .dropdown-menu,
body.home.page-id-10 .ooc-home-geo-results {
	border-color: var(--oo-border-neutral) !important;
}

body.home.page-id-10 .elementor-element-de02c12 form.ooc-home-search-restored .houzez-search-button,
body.home.page-id-10 .header-main-wrap .btn-create-listing,
body.home.page-id-10 #header-mobile .ooc-mobile-cta {
	background-color: var(--oo-orange) !important;
	border-color: var(--oo-orange) !important;
}

body.home.page-id-10 .elementor-element-de02c12 form.ooc-home-search-restored .houzez-search-button:hover,
body.home.page-id-10 .elementor-element-de02c12 form.ooc-home-search-restored .houzez-search-button:focus-visible,
body.home.page-id-10 .header-main-wrap .btn-create-listing:hover,
body.home.page-id-10 .header-main-wrap .btn-create-listing:focus-visible,
body.home.page-id-10 #header-mobile .ooc-mobile-cta:hover,
body.home.page-id-10 #header-mobile .ooc-mobile-cta:focus-visible {
	background-color: var(--oo-orange) !important;
	border-color: var(--oo-orange) !important;
}

body.home.page-id-10 .slick-prev.btn-primary-outlined,
body.home.page-id-10 .slick-next.btn-primary-outlined {
	color: var(--oo-teal) !important;
	border-color: var(--oo-teal) !important;
}

body.home.page-id-10 .slick-prev.btn-primary-outlined:hover,
body.home.page-id-10 .slick-prev.btn-primary-outlined:focus-visible,
body.home.page-id-10 .slick-next.btn-primary-outlined:hover,
body.home.page-id-10 .slick-next.btn-primary-outlined:focus-visible {
	color: #fff !important;
	background-color: var(--oo-teal-light) !important;
	border-color: var(--oo-teal-light) !important;
}

body.home.page-id-10 .item-listing-wrap a:hover,
body.home.page-id-10 .item-listing-wrap a:focus-visible,
body.home.page-id-10 .blog-post-item a:hover,
body.home.page-id-10 .blog-post-item a:focus-visible {
	color: var(--oo-teal) !important;
}

body.home.page-id-10 .ooc-home-footer__bottom {
	background: var(--oo-teal-dark);
}

body.home.page-id-10 .ooc-home-footer__column h2,
body.home.page-id-10 .ooc-home-info__copy h2 {
	color: var(--oo-text-dark);
}

body.home.page-id-10 .ooc-home-info {
	padding-top: 52px;
	background: var(--oo-bg-light);
}

body.home.page-id-10 .ooc-home-info__item {
	border: 1.5px solid rgba(29, 140, 155, 0.68);
	background: #fff;
	box-shadow: 0 3px 12px rgba(32, 53, 71, 0.08);
}

body.home.page-id-10 .ooc-home-info__item:hover,
body.home.page-id-10 .ooc-home-info__item:focus-within {
	border-color: rgba(29, 140, 155, 0.9);
}

/*
 * The existing header controller moves this wrapper below the hero on
 * DOMContentLoaded. Keep its pre-move copy out of normal flow so the hero and
 * search occupy their final coordinates from the first rendered frame.
 */
body.home.page-id-10 .header-main-wrap:not(.ooc-home-header-below-hero) {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	visibility: hidden;
	pointer-events: none;
}

body.home.page-id-10 .ooc-home-info__icon {
	color: var(--oo-orange);
	background: rgba(244, 122, 32, 0.1);
}

body.home.page-id-10 .ooc-home-info__highlight,
body.home.page-id-10 .ooc-home-info__cta,
body.home.page-id-10 .ooc-home-footer__brand-link,
body.home.page-id-10 .ooc-home-footer__column a:hover,
body.home.page-id-10 .ooc-home-footer__column a:focus-visible {
	color: var(--oo-orange) !important;
}

body.home.page-id-10 .ooc-home-info__cta {
	border-color: var(--oo-orange);
}

body.home.page-id-10 .ooc-home-info__cta:hover,
body.home.page-id-10 .ooc-home-info__cta:focus-visible {
	color: var(--oo-orange) !important;
	background: rgba(244, 122, 32, 0.08);
	border-color: var(--oo-orange);
}

@media (max-width: 991.98px) {
	body.home.page-id-10 .ooc-home-info {
		padding-top: 34px;
	}
}

@media (max-width: 767.98px) {
	body.home.page-id-10 .ooc-home-info {
		padding-top: 24px;
	}
}
