/*
 * SHARM JOY | Tourism Identity Refresh 1.3.0
 * Presentation-only overrides — no ACF, qTranslate-XT, database or CPT changes.
 * Brand colors from client-supplied palette, all screen sizes and 4 languages.
 * Loaded after the identity styles; scoped layout fixes follow in v1.4.
 */
:root {
    --brand-light-blue: #8ECAE6;
    --brand-yellow: #FFB703;
    --brand-sky: #2571BC;
    --brand-ocean: #003060;
    --brand-ivory: #F3F8FC;
    --brand-turquoise: #8ECAE6; /* bridge for legacy v1 selectors */
    --brand-azure: #2571BC;
    --brand-azure-dark: #1B5799;
    --brand-turquoise-dark: #205A89;
    --brand-ink: #002348;
    --brand-deep: #003060;
    --brand-muted: #C9DEEC;
    --brand-surface: #0A416F;
    --main-color: #8ECAE6;
    --sec-color: #2571BC;
    --dark-color: #003060;
    --bg-grid: linear-gradient(125deg, #114B7C 0%, #003060 59%, #002447 100%);
    --btn-grid: linear-gradient(115deg, #2571BC 0%, #195994 100%);
    --slt-text: #F6FAFF;
    --slt-text-muted: #C7DCEB;
    --slt-line: rgba(142,202,230,.24);
}

/* Restore text contrast and eliminate the residual purple/green identity. */
body { color: var(--slt-text); }
body, .breadcrumb, .banner-h, .single-help.body-inner {
    background-color: var(--brand-ocean);
}
a:hover { color: var(--brand-light-blue); }
p, .text-banner p, .text-about p, .body-inner .text-about p,
.text-foot p, .text-single p, .text-help p {
    color: var(--slt-text-muted);
}
h1, h2, h3, h4, h5, h6 { text-wrap: pretty; }
img, video { max-width: 100%; }
::selection { background: var(--brand-yellow); color: var(--brand-ocean); }

/* Header: align logo, menu and calls to action without sticky-header jumps. */
header.sticky { z-index: 90; }
header.sticky .header-top { background: rgba(0,31,61,.84); border-bottom: 1px solid var(--slt-line); }
header.sticky .header-top::after { opacity: 0; pointer-events: none; }
header.sticky .header-bottom { background: rgba(0,34,64,.48); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.head-inner { display: flex; align-items: center; gap: clamp(14px,1.5vw,24px); }
.head-inner .logo-h { flex: 0 0 auto; }
.head-inner .logo-h .logo { max-width: clamp(150px,15vw,200px); width: 100%; }
.head-inner .logo-h .logo img { display: block; width: 100%; height: auto; object-fit: contain; }
.head-inner .nav-menu { min-width: 0; margin-inline-start: auto; }
.head-inner .nav-menu ul { margin: 0; display: flex; align-items: center; gap: clamp(9px,1.25vw,22px); }
.head-inner .nav-menu ul li { margin: 0; }
.head-inner .nav-menu ul li a { font-size: clamp(13px,1.1vw,16px); font-weight: 500; line-height: 1.45; white-space: nowrap; color: #F8FCFF; }
.head-inner .nav-menu ul li a:hover,
.head-inner .nav-menu ul li.current-menu-item > a { color: var(--brand-light-blue); }
.head-inner .nav-menu ul li a::after {
    background: var(--brand-yellow) !important;
    width: 18px; height: 3px; border-radius: 6px;
    bottom: -10px;
}
.head-inner .nav-menu ul li.menu-item-has-children::after { color: var(--brand-light-blue); }
.head-inner .nav-menu ul.sub-menu { background: #003060; border: 1px solid var(--slt-line); border-radius: 14px; box-shadow: 0 20px 38px rgba(0,18,40,.3); }
.head-inner .nav-menu ul.sub-menu li a { white-space: normal; font-size: 14px; }
.head-inner .nav-menu ul.sub-menu li a:hover { background: #164E80 !important; color: #fff !important; }
.head-inner .nav-right { flex: 0 0 auto; display:flex; align-items:center; gap:clamp(8px,1vw,18px); padding: 0; }
.head-inner .nav-right .btn-search { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; min-height: 40px; margin: 0; padding: 0; color: #fff; }
.head-inner .nav-right .btn-search:hover { color: var(--brand-yellow); }
.head-inner .nav-right .btn { margin: 0; }
.head-top { align-items: center; gap: 22px; }
.head-top .time-info { display:flex; flex-wrap: nowrap; align-items: center; gap: 20px; margin:0; padding:0; border:0; }
.head-top .time-info .date-h, .head-top .time-info .time-h {
    display: inline-flex; align-items:center; margin:0; white-space: nowrap; font-size: 14px; color: #E9F4FD;
}
.head-top .time-info i { color: var(--brand-light-blue) !important; margin-inline-end: 10px; }
.social-h { display: flex; align-items:center; gap: 3px; }
.social-h a { width: 34px; height: 34px; margin: 0 3px; border-radius: 50%; display: inline-flex; justify-content:center; align-items:center; color:#E8F4FF; transition: background .2s ease,color .2s ease; }
.social-h a:hover { color: #003060; background: var(--brand-light-blue); }

/* qTranslate-XT 4-language dropdown. Markup and URL generation are left intact. */
.header-top, .header-top .container-fluid, .header-top .row, .head-top, .head-top .time-info { overflow: visible; }
.language-switcher {
    position: relative; z-index: 200;
    display: inline-block; flex: 0 0 auto;
    margin-inline-start: 0; padding-inline-start: 20px;
    border-inline-start: 1px solid rgba(142,202,230,.32);
    line-height: 1.35;
}
.language-switcher summary { list-style:none; }
.language-switcher summary::-webkit-details-marker { display:none; }
.language-switcher__toggle {
    display:inline-flex; align-items:center; justify-content:space-between;
    gap: 12px; min-width: 148px; min-height: 43px; height:auto;
    padding: 8px 16px; border:1px solid rgba(142,202,230,.48);
    border-radius: 999px; background: rgba(142,202,230,.12);
    color: #fff; font-size: 14px; font-weight: 600;
    box-shadow: 0 4px 17px rgba(0,14,34,.12);
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
    cursor: pointer;
}
.language-switcher__toggle:hover, .language-switcher[open] .language-switcher__toggle {
    background: #174F81; border-color: var(--brand-light-blue);
    box-shadow: 0 9px 26px rgba(0,15,33,.25);
}
.language-switcher__toggle > .fa-globe { color: var(--brand-yellow) !important; flex:0 0 auto; }
.language-switcher__chevron { color: var(--brand-light-blue); flex:0 0 auto; }
.language-switcher__menu {
    position:absolute; z-index:300; top:calc(100% + 10px); inset-inline-end:0;
    width:max-content; min-width:210px; max-width:calc(100vw - 24px);
    padding:8px; border-radius:18px;
    border:1px solid rgba(142,202,230,.25);
    background:#003060; box-shadow:0 20px 40px rgba(0,18,42,.42);
    overflow:visible;
}
.language-switcher__option {
    display:flex; align-items:center; justify-content:space-between;
    gap:14px; min-height:43px; margin:2px 0; padding:11px 14px;
    color:#F6FAFF !important; background:transparent;
    font-size:14px; font-weight:500; border-radius:12px; white-space:nowrap;
}
.language-switcher__option:hover, .language-switcher__option:focus-visible {
    color: #FFFFFF !important; background:#195C95 !important; transform:none;
}
.language-switcher__option.is-current { background:#174F81 !important; color:var(--brand-yellow) !important; }
.language-switcher__option .fa-check { color:var(--brand-yellow) !important; }
.language-switcher__toggle:focus-visible, .language-switcher__option:focus-visible {
    outline: 3px solid var(--brand-yellow) !important; outline-offset: 2px;
}
.language-switcher select { display:none !important; }
.language-switcher [lang="ar"] { font-family: 'bahij', 'Almarai', sans-serif; }

/* Modern, consistent CTA: legacy pseudo layers caused incorrect sizing and overlays. */
a.btn:not(.btn-border):not(.go-home), button.btn:not(.btn-border) {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 172px; min-height: 48px; width: auto; max-width:100%;
    padding: 10px 24px; border-radius: 999px;
    background: linear-gradient(115deg, #2571BC, #195994) !important;
    border: 1px solid rgba(142,202,230,.33);
    color: #fff !important; font-weight: 600; font-size: 15px;
    text-align:center; line-height:1.55; white-space:normal;
    overflow:visible; box-shadow: 0 8px 22px rgba(0,18,45,.22) !important;
    transition:transform .2s ease,background .2s ease,box-shadow .2s ease;
}
a.btn:not(.btn-border):not(.go-home)::before,
a.btn:not(.btn-border):not(.go-home)::after,
button.btn:not(.btn-border)::before,
button.btn:not(.btn-border)::after { content:none !important; display:none !important; }
a.btn:not(.btn-border):not(.go-home) span,
button.btn:not(.btn-border) span { position:relative; z-index:1; text-align:center; }
a.btn:not(.btn-border):not(.go-home):hover,
a.btn:not(.btn-border):not(.go-home):focus-visible,
button.btn:not(.btn-border):hover {
    color: #fff !important; background: linear-gradient(115deg, #1B5A96, #003E79) !important;
    box-shadow: 0 13px 27px rgba(0,27,55,.32) !important;
    transform:translateY(-2px);
}
a.btn.btn-big:not(.btn-border) { background:linear-gradient(110deg, #FFB703, #F5A900) !important; color:#003060 !important; }
a.btn.btn-big:not(.btn-border):hover { background:linear-gradient(110deg, #F3B000, #DB9200) !important; color:#003060 !important; }
a.btn.btn-big span { color:inherit; }
.mobile-nav-toggler, .goTop { background:var(--btn-grid) !important; border-radius:12px; box-shadow:0 8px 22px rgba(0,20,48,.28); }
.goTop { border-radius:50%; }

/* Keep the header compact on the final fullPage section (same behavior as 2–6). */
.fp-viewing-7Page header.sticky .header-top { display: none; }

/* Destination-inspired section surfaces, readable atop photographs. */
.banner-h, .breadcrumb, .single-help.body-inner {
    background-image: radial-gradient(ellipse at 77% 19%, rgba(37,113,188,.28), transparent 48%),
                      linear-gradient(115deg, #0C426F, #003060 68%, #00244A) !important;
}
.banner-h::after { pointer-events:none; background:radial-gradient(circle at 88% 72%, rgba(142,202,230,.10), transparent 34%); }
.banner-h .container-fluid { position:relative; z-index:3; }
.banner-h .text-banner { position:relative; z-index:2; }
.text-banner h1 { color:#fff; font-weight:700; letter-spacing:0; }
.text-banner p { max-height:none; color:var(--slt-text-muted); line-height:1.75; }
.img-banner .img img {
    -webkit-mask-box-image: none !important;
    -webkit-mask-image: url('../images/sharmjoy-mask-v1.4.svg');
    mask-image: url('../images/sharmjoy-mask-v1.4.svg');
    -webkit-mask-size:100% 100%; mask-size:100% 100%;
    -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
}
.about-h .overlay-img::after, .services-h .overlay-img::after,
.projects-h .overlay-img::after, .partners-h .overlay-img::after,
.vision-h .overlay-img::after, .values-h .overlay-img::after,
footer .overlay-img::after, .overlay-img::after {
    background:linear-gradient(105deg, rgba(0,38,79,.93) 0%, rgba(0,48,96,.84) 54%, rgba(8,66,106,.77) 100%) !important;
    opacity: .91;
}
.breadcrumb { margin:0; padding: clamp(194px, 20vw, 230px) 0 90px; border-radius:0; }
.breadcrumb .overlay-img::after { background:linear-gradient(118deg,#093A68,#002D57) !important; }
.breadcrumb .img-bottom { display:none !important; } /* decorative legacy logo/broken-image area */
.breadcrumb .text-bread { display:flex; align-items:center; min-width:0; }
.breadcrumb .text-bread h1 { margin:0; line-height:1.25; overflow-wrap:anywhere; font-size:clamp(32px,3.15vw,52px); }
.title h3 { color:#fff; line-height:1.4; }
.title h3::after { background:linear-gradient(90deg,#FFB703 0%,rgba(255,183,3,.08) 100%) !important; }
.text-about ul li::before { background:var(--brand-yellow); }
.goSec i { color:var(--brand-yellow) !important; }
.img-about { max-width:100%; }
.img-about .img video { width:100%; height:100%; object-fit:cover; display:block; border-radius:50%; }
.img-about .dot::after { background:var(--brand-yellow); }
.img-about { border-color:rgba(142,202,230,.45); }

/* About / participation: place action after actual content, never on top of paragraphs. */
.about-h .text-about, .about-page .text-about {
    display:flex; flex-direction:column; align-items:flex-start;
    gap:clamp(12px,1.6vw,20px); width:100%; position:relative; z-index:2;
}
.about-h .text-about p, .about-page .text-about p,
.body-inner .text-about p {
    margin:0 !important; max-height:none !important; overflow:visible !important;
    width:100%; letter-spacing:0.1px; line-height:1.75;
}
.about-h .text-about ul, .about-page .text-about ul,
.body-inner .text-about ul { margin:0 !important; width:100%; row-gap:8px; }
.about-h .text-about .btn, .about-page .text-about .btn,
.body-inner .text-about .btn { align-self:flex-start; margin:8px 0 0 !important; }
.about-h:not(.about-page) { padding-top:clamp(125px,16vh,185px); padding-bottom:clamp(45px,6vh,85px); }
.about-h.about-page.body-inner { padding-top:clamp(75px,8vw,130px); padding-bottom:clamp(75px,8vw,130px); }
.body-inner .text-about ul li { width:100%; max-width:100%; flex:0 0 100%; }

/* Old editorial highlight colors are remapped to the destination palette. */
.about-con h2 { color: var(--brand-ocean) !important; }
.about-con h2::after, .about-con li::before { background-color: var(--brand-yellow) !important; }
.list-inner { background: var(--brand-surface); }
.line-item.two::before, .line-item.four::before { background-color: var(--brand-yellow); }

/* Other identity touchpoints. Keep existing ACF-driven content and markup. */
.serv-block .img::after, .pro-block .img-block::after,
.slt-3d-carousel .serv-block .img::after, .slt-3d-carousel .pro-block .img-block::after {
    background:linear-gradient(180deg,rgba(0,48,96,0) 12%,rgba(0,48,96,.86) 100%) !important;
}
.slt-3d-carousel .owl-item.is-3d-center .serv-block,
.slt-3d-carousel .owl-item.is-3d-center .pro-block { border-color:rgba(142,202,230,.7); box-shadow:0 25px 55px rgba(0,24,54,.38); }
.slt-3d-carousel .serv-block, .slt-3d-carousel .pro-block { background:rgba(0,48,96,.33); }
.slt-3d-carousel .owl-nav button.owl-prev, .slt-3d-carousel .owl-nav button.owl-next {
    background:#104B7E !important; border-color:rgba(142,202,230,.48) !important;
}
.slt-3d-carousel .owl-nav button:hover { background:#2571BC !important; }
.owl-carousel .owl-dots .owl-dot.active span { background:var(--brand-yellow) !important; }
.form-group .form-control:focus, .wpcf7 input:focus, .wpcf7 textarea:focus, .wpcf7 select:focus {
    border-color:var(--brand-sky) !important; box-shadow:0 0 0 3px rgba(142,202,230,.2) !important;
}
.accordion-item .accordion-header button:not(.collapsed) { color:#003060 !important; background:var(--brand-light-blue) !important; }
.pagination .page-item.active .page-link { color:#003060 !important; background:#8ECAE6 !important; }
footer .footer-bottom { border-top:1px solid var(--slt-line); }
footer .text-foot h1 span { color:var(--brand-light-blue) !important; }
.links-f a:hover, .links-s a:hover { color:var(--brand-light-blue) !important; }

/* Prevent long translations from overlapping at intermediate screen widths. */
@media (max-width: 1250px) and (min-width: 992px) {
    .head-inner .logo-h .logo { max-width:155px; }
    .head-inner .nav-menu ul { gap:10px; }
    .head-inner .nav-menu ul li a { font-size:13px; }
    .head-inner .nav-right { gap:6px; }
    .head-inner .nav-right .btn { min-width:150px; padding-inline:15px; }
}
@media (max-width: 1199px) {
    .head-inner .nav-menu { display:none !important; }
    .head-inner .nav-right { margin-inline-start:auto; }
    .head-inner .nav-right > .btn { display:none !important; }
    .mobile-nav-toggler { display:block !important; margin-inline-start:0; cursor:pointer; }
    .header-bottom { padding:12px 0; }
}
@media (max-width: 991px) {
    .head-top { justify-content:space-between; flex-direction:row-reverse; gap:10px; }
    .head-top .time-info { gap:0; padding:0; margin:0; border:0; }
    .head-top .time-info .date-h, .head-top .time-info .time-h { display:none; }
    .language-switcher { border:0; padding:0; margin:0; }
    .language-switcher__toggle { min-width:126px; min-height:40px; padding:8px 12px; }
    .language-switcher__menu { top:calc(100% + 8px); inset-inline-end:0; }
    .head-inner .logo-h .logo { max-width:170px; }
    .head-inner .nav-right { padding:0; }
    .banner-h { height:auto; min-height:100vh; }
    .banner-h .text-banner { padding-top:135px; }
    .breadcrumb { padding:175px 0 65px !important; }
    .about-h:not(.about-page) { height:auto !important; padding:68px 0 72px; }
    .about-h.about-page.body-inner, .vision-h.about-page.body-inner,
    .values-h.about-page.body-inner { height:auto !important; padding:68px 0 !important; }
    .text-about ul li { font-size:16px; line-height:1.6; }
    .about-h .text-about .btn, .about-page .text-about .btn { margin-top:8px !important; }
    .text-bread { display:block; }
}
@media (max-width: 767px) {
    header.sticky .header-top { padding:7px 0; }
    .social-h a { width:31px; height:31px; margin-inline:2px; font-size:15px; }
    .header-bottom { padding:11px 0; }
    .head-inner .logo-h .logo { max-width:155px; }
    .head-inner .nav-right { gap:10px; }
    .head-inner .nav-right .btn-search { min-width:36px; min-height:36px; font-size:17px; }
    .language-switcher__toggle { min-width:119px; min-height:37px; padding:7px 10px; gap:7px; font-size:13px; }
    .language-switcher__menu { position:absolute; top:calc(100% + 9px); inset-inline-end:0; min-width:182px; width:max-content; max-width:min(230px,calc(100vw - 24px)); }
    .language-switcher__option { min-height:42px; padding:9px 12px; }
    .breadcrumb { padding:155px 0 55px !important; }
    .breadcrumb .text-bread h1 { font-size:clamp(29px,7vw,40px); line-height:1.3; }
    .banner-h .text-banner { padding-top:145px; }
    .banner-h .text-banner h1 { font-size:clamp(29px,7vw,40px); line-height:1.28; margin-bottom:18px; }
    .banner-h .text-banner p { font-size:15px; line-height:1.7; max-height:none; }
    .banner-h .img-banner { max-width:min(340px,90vw); height:300px; margin-top:32px; }
    .body-inner .title h3, .about-h .title h3 { font-size:clamp(22px,5.8vw,29px); }
    .about-h .text-about p, .about-page .text-about p { font-size:15px; line-height:1.75; }
    .text-about ul { gap:7px; }
    .about-h .text-about ul li, .about-page .text-about ul li {
        max-width:100%; flex:0 0 100%; width:100%; margin:0; padding-inline-start:22px;
    }
    .img-about { margin:35px auto 0; width:min(330px,85vw); height:auto; aspect-ratio:1; }
    .about-h:not(.about-page) { padding:56px 0 60px; }
    .about-h.about-page.body-inner, .vision-h.about-page.body-inner,
    .values-h.about-page.body-inner { padding:55px 0 !important; }
    .services-h, .projects-h, .partners-h { padding-block:55px; }
    .text-bread .img-bottom { display:none !important; }
    .slt-3d-carousel .owl-item, .slt-3d-carousel .owl-item.active { transform:none !important; }
    a.btn:not(.btn-border):not(.go-home) { min-height:46px; padding:9px 20px; }
}
@media (max-width: 390px) {
    .head-inner .logo-h .logo { max-width:132px; }
    .head-inner .nav-right { gap:4px; }
    .head-inner .nav-right .btn-search { min-width:30px; }
    .mobile-nav-toggler { width:37px; height:37px; line-height:37px; }
    .social-h a { width:27px; height:27px; margin-inline:1px; }
    .language-switcher__toggle { min-width:111px; padding-inline:9px; }
}
@media (prefers-reduced-motion: reduce) {
    .language-switcher__toggle, .language-switcher__option, a.btn, .social-h a { transition:none !important; animation:none !important; }
    a.btn:hover { transform:none !important; }
}