/* 
  Theme Name:  Twenty Twenty Child 
  Description:  A child theme of Twenty Twenty WordPress theme. 
  Author:       TwentyTwenty-child 
  Template:     twentytwenty 
  Text Domain:  twentytwenty-child 
  Version:      2.0.0 
  License:      GNU General Public License v2 or later License 
  URI:  http://www.gnu.org/licenses/gpl-2.0.html */

@import url("../twentytwenty/style.css");
body {
  background: transparent;
  margin:0 auto;
  max-width:unset;
}

section {
  padding: 0rem 0;
}
.custom_header {	
    transition: 1s all !important;	
}
/* .custom_header {	
    position: fixed !important;	
    z-index: 99 !important;	
    transition: 1s all !important;	
}	 */
.custom_header.sticky {
    background: #ffffff !important;
    top: 0!important;
    box-shadow: 2px 2px 10px 0 #dbdbdb;
}
.custom_header .head-logo img{	
	transition: .5s all !important;	
}	
.custom_header.sticky .head-logo img {	
    max-width: 250px !important;	
	transition: .5s all !important;	
}

/** short code css **/
/* Simple Office Locations - Clean CSS Styles */


.office-locations-widget {
    max-width: 100%;
    background: white;
    border-radius: 30px;
    padding: 36px 30px;
    margin: 0 auto;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

/* Header Styles */
.header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.header h1 {
    font-size: 24px !important;
    font-weight: 700;
    color: #024802;
    margin: 0;
}

.toggle-buttons {
    display: flex;
    gap: 10px;
}

.toggle-btn {
    padding: 8px 15px  !important;
    border-radius: 5px  !important;
    border: 2px solid #024802;
    font-size: 16px  !important;
    font-weight: 600  !important;
    cursor: pointer  !important;
    transition: all 0.3s ease;
    display: flex  !important;
    align-items: center  !important;
    gap: 8px  !important;
    background: white  !important;
    color: #024802  !important;
}

.toggle-btn.active {
    background: #024802;
    color: white;
}

.toggle-btn:hover {
    opacity: 0.8;
}

.toggle-btn .icon {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

/* Map Container */
.map-container {
    display: none;
    width: 100%;
    height: 500px;
    border-radius: 15px;
    overflow: hidden;
    margin-bottom: 20px;
    border: 2px solid #024802;
}

.map-container.active {
    display: block;
}

#map {
    width: 100%;
    height: 100%;
}

.map-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    background: #f8f9fa;
    color: #666;
    text-align: center;
    padding: 40px 20px;
}

.map-placeholder-icon {
    width: 64px;
    height: 64px;
    fill: #024802;
    margin-bottom: 16px;
}

.map-placeholder p {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 8px;
    color: #024802;
}

.map-placeholder small {
    font-size: 14px;
    color: #666;
}

/* Content Container */
.content-container {
    display: block;
/* 	    max-height: 400px !important; */
	max-height: 100% !important;
}

@media (max-width: 767px) {
	.office-locations-widget {
		margin: 20px 0;
	}
}

.content-container.hidden {
    display: none;
}

/* Main Office Styles */
.main-office {
    background: white;
    border: 2px solid #024802;
    border-radius: 10px;
    padding: 24px;
    margin-bottom: 40px;
    box-shadow: 4px 8px 10px rgba(0, 0, 0, 0.25);
    display: flex;
    gap: 20px;
    align-items: flex-start;
	max-width: 928px;
	margin: 0 auto;
}

.office-icon {
    width: 43px;
    height: 43px;
    background: #024802;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.office-icon svg {
    width: 24px;
    height: 24px;
    fill: white;
}

.office-content {
    flex: 1;
}

.office-title {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #000 !important;
    margin-bottom: 12px !important;
    margin: 0 !important;
}
.office-address {
    font-size: 16px !important;
    color: #000 !important;
    line-height: 1.4 !important;
    margin-bottom: 10px !important;
}

.contact-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}
.contact-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    font-size: 16px !important;
    color: #000 !important;
}
.contact-icon {
    width: 30px !important;
    height: 30px !important;
    background: #024802 !important;
    border-radius: 3px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.contact-icon svg {
    width: 16px !important;
    height: 16px !important;
    fill: white !important;
}

.contact-icon.phone svg {
    transform: rotate(-10deg);
}

/* Section Title */
.section-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #024802 !important;
    margin:10px 0 !important;
    margin-bottom: 30px;
}
.pp-card-slider-dots-bottom .swiper-pagination {
    bottom: -35% !important;
}
/*Home page custom start*/
.team-member h4.pp-tm-name {
    margin-top: 20px !important;
}
.swiper-button-next, .swiper-button-prev {
    bottom: 0 !important;
    transform: translate(0px, 90%) !important;
}
.swiper-button-next{
    right: 43% !important;
}
.swiper-button-prev {
    left:43% !important;
}
.pp-card-slider-item {
    justify-content: space-between !important;
}
.pp-card-slider-image img {
    object-fit: contain !important;
}
.investmentboxes h3.elementor-icon-box-title {
    margin: 0;
    margin-bottom: 8px !important;
}
.investment_boxes .elementor-widget-container {
    height: 100% !important;
    min-height: 190px !important;
}
span.pp-card-slider-button-text:after {
    content: "\f0a9";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}


/* Offices Grid */
.offices-grid {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.office-main {
	 display: flex;
    gap: 20px;
    align-items: flex-start;
	
	 background: white;
    border: 2px solid #024802;
    border-radius: 10px;
    padding: 12px;
   height: 100%;
}

.office-card {
  padding: 0 10px; 
}

.office-card .office-main:hover,
.office-card.highlighted .office-main {
    background: #e7f2dc;
	cursor: pointer;
}

.office-card .office-title {
	  font-family: "Montserrat", sans-serif;
    font-size: 24px;
    margin-bottom: 12px;
}

.office-card .office-address {
	font-family: "Lato", sans-serif;
    font-size: 18px;
    margin-bottom: 0;
}

.office-title {
	 font-family: "Montserrat", sans-serif !important;
}
.office-address {
	font-family: "Lato", sans-serif;
}

.content-container {
	padding-right: 10px;
  scrollbar-width: thin; /* For Firefox */
  scrollbar-color: #024802 transparent; /* thumb | track */
}

/* For Chrome, Edge, Safari */
.content-container::-webkit-scrollbar {
  width: 8px; /* scrollbar thickness */
}

.content-container::-webkit-scrollbar-track {
  background: transparent; /* track background */
}

.content-container::-webkit-scrollbar-thumb {
  background-color: #024802; /* scrollbar thumb */
  border-radius: 10px;       /* round edges */
}


@media (max-width: 1025px) {
	.header h1 {
    font-size: 20px !important;
	}
	.office-address {
		font-size: 14px !important;
	}
	body.elementor-kit-16 {
		padding: 0;
	}
}


/* Responsive Design */
@media (max-width: 768px) {
    body {
        padding: 10px;
    }
    
    .office-locations-widget {
        padding: 20px;
        border-radius: 20px;
    }

    .header {
        flex-direction: column;
        gap: 20px;
        align-items: flex-start;
    }

    .header h1 {
        font-size: 20px;
    }

    .toggle-buttons {
        width: 100%;
        justify-content: center;
    }

    .toggle-btn {
        flex: 1;
        justify-content: center;
        font-size: 16px;
        padding: 10px 16px;
    }

    .main-office,
    .office-card {
        flex-direction: column;
        text-align: center;
        gap: 16px;
    }

    .office-icon {
        align-self: center;
    }

    .office-title {
        font-size: 20px;
    }

    .office-address,
    .contact-item {
        font-size: 16px;
    }

    .section-title {
        font-size: 20px;
    }

    .contact-info {
        align-items: start;
    }
}

@media (max-width: 480px) {
    .office-locations-widget {
        padding: 16px;
    }

    .main-office,
    .office-card {
        padding: 16px;
    }

    .office-icon {
        width: 35px;
        height: 35px;
    }

    .office-icon svg {
        width: 20px;
        height: 20px;
    }

    .toggle-btn {
        padding: 8px 12px;
        font-size: 14px;
    }

    .map-container {
        height: 300px;
    }
}

.office-content-flex {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.office-content-flex .detail {
	max-width: 461px;
	width: 100%;
	padding-right: 10px;
}
/* Initial state */
.custom_header .main-header {
	transform: translateY(0);  /* start at normal position */
	opacity: 1;
	transition: transform 0.4s ease, opacity 0.4s ease, box-shadow 0.4s ease, background-color 0.4s ease;
}

/* Sticky state */
.custom_header.header-sticky .main-header {
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	transform: translateY(-100%); /* slide up initially */
	animation: slideDown 0.4s forwards; /* slide down effect */
	background-color: #fff; /* optional */
	box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

/* Keyframes for slide-down effect */
@keyframes slideDown {
	from {
		transform: translateY(-100%);
		opacity: 0;
	}
	to {
		transform: translateY(0);
		opacity: 1;
	}
}

.elementor-button:hover {
	text-decoration: none !important;	
}

/* office location widget */
.office-locations-widget .toggle-buttons {
	position: absolute;
    right: 30px;
}

.office-locations-widget .header {
	padding: 0 250px;
	justify-content: center;
}

.office-locations-widget .offices-grid {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 0;
	margin: 0 -10px;
}

.office-locations-widget .offices-grid .office-card {
	width: 50%;
	margin: 0 0 20px 0;
}

.content-container .section-title {
	margin-bottom: 20px !important;
	margin-top: 20px !important;
}

@media (max-width: 1199px) {
	.ctm-icon-box .elementor-column-wrap {
		padding: 0 0 30px 0 !important;
	}
	.office-locations-widget .toggle-buttons {
		position: relative;
		right: 0;
		
	}
	.office-locations-widget .header {
		padding: 0;
		justify-content: space-between;
		gap: 10px;
	}
	.office-locations-widget .offices-grid .office-card {
		width: 100%;
		margin: 0;
		padding-bottom: 10px;
	}
	
	.content-container .section-title {
		margin-top: 20px !important;
		margin-bottom: 10px !important;
	}
	
	.office-locations-widget .main-office, .office-locations-widget .office-card {
		text-align: left;
	}
	
	.office-locations-widget .office-icon {
		align-self: flex-start;
	}
}

.ctm-accordion a {
	font-weight: 700;
	color:#008628;
}

.ctm-accordion a:hover {
	color: #000;
}