/* =========================================================================
   EGYMARKS — MODERN VISUAL REFRESH
   Loaded after main.css. Same brand colors/fonts/content — just a more
   modern feel: soft shadows, rounded corners, refined spacing & motion.
   Safe to delete this single file to fully revert.
   ========================================================================= */

:root {
    --brand-primary: #960d12;
    --brand-primary-soft: rgba(150, 13, 18, .12);
    --brand-secondary: #262425;
    --brand-dark: #010605;
    --ink-muted: #6b6768;
    --surface: #ffffff;
    --surface-alt: #f7f5f5;
    --border-soft: rgba(38, 36, 37, .1);
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 24px;
    --radius-pill: 999px;
    --shadow-sm: 0 4px 16px rgba(1, 6, 5, .06);
    --shadow-md: 0 12px 32px rgba(1, 6, 5, .10);
    --shadow-lg: 0 24px 60px rgba(1, 6, 5, .14);
    --shadow-brand: 0 12px 28px rgba(150, 13, 18, .22);
    --ease: cubic-bezier(.22, 1, .36, 1);
}

/* ---------- Base type & rhythm ---------- */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.7;
    color: var(--brand-dark);
}

h1, h2, h3, h4, h5, h6,
.main-title, .sec-title, .title {
    letter-spacing: -.01em;
    line-height: 1.25;
}

p { color: var(--ink-muted); }

::selection {
    background: var(--brand-primary);
    color: #fff;
}

/* Modern thin scrollbar, brand-tinted */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background: rgba(150, 13, 18, .35);
    border-radius: var(--radius-pill);
}
::-webkit-scrollbar-thumb:hover { background: var(--brand-primary); }

/* ---------- Section rhythm ---------- */
section, .section, .about-sec, .services-sec, .info-sec,
.form-sec, .news, .clients, .contact-sec, .gallery-sec {
    padding-top: 6rem;
    padding-bottom: 6rem;
}
@media (max-width: 768px) {
    section, .section, .about-sec, .services-sec, .info-sec,
    .form-sec, .news, .clients, .contact-sec, .gallery-sec {
        padding-top: 3.5rem;
        padding-bottom: 3.5rem;
    }
}

/* Modern section eyebrow / title accent (keeps existing markup, restyles the line) */
.sec-title {
    padding-bottom: .35rem;
}
.sec-title:after {
    height: 4px;
    border-radius: var(--radius-pill);
    background: linear-gradient(90deg, var(--brand-primary), rgba(150, 13, 18, .25));
}

/* ---------- Buttons ---------- */
.btn, .gradient-top {
    border-radius: var(--radius-pill) !important;
    font-weight: 600;
    letter-spacing: .01em;
    transition: transform .35s var(--ease), box-shadow .35s var(--ease), background-color .35s var(--ease), color .35s var(--ease) !important;
}
.gradient-top {
    box-shadow: var(--shadow-brand);
}
.gradient-top:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 36px rgba(150, 13, 18, .3);
}
.gradient-top.gradient-white {
    box-shadow: var(--shadow-sm);
}
.nav-pills .nav-link {
    border-radius: var(--radius-pill);
    transition: transform .3s var(--ease), box-shadow .3s var(--ease), background-color .3s var(--ease), color .3s var(--ease);
}
.nav-pills .nav-link:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); }

/* ---------- Navigation ---------- */
.menu.fixed-top {
    transition: background-color .4s var(--ease), box-shadow .4s var(--ease), backdrop-filter .4s var(--ease);
}
.menu .nav-link {
    border-radius: var(--radius-sm);
}
.menu .nav-item .dropdown-menu {
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--border-soft);
    margin-top: .5rem !important;
}
.menu .nav-item .dropdown-menu li {
    border-bottom: 1px solid var(--border-soft);
}
.scroll {
    box-shadow: var(--shadow-md) !important;
    backdrop-filter: saturate(180%) blur(14px);
    background-color: rgba(255, 255, 255, .85) !important;
}
.sidenav .overlay {
    backdrop-filter: blur(6px);
}

/* ---------- Cards: services, news, team, gallery, clients ---------- */
.news .post,
.services-cats .service,
.team .member,
.other-services,
.form-bg,
.archive-clients img,
.videos .video video,
.videos .video iframe,
.archive-services .form-bg {
    border-radius: var(--radius-md) !important;
}
.news .post {
    box-shadow: var(--shadow-sm);
    border: none !important;
    transition: transform .45s var(--ease), box-shadow .45s var(--ease);
}
.news .post:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-lg);
}
.news .post figure figcaption {
    border-radius: var(--radius-sm);
}
.services-cats .service {
    box-shadow: var(--shadow-sm) !important;
    transition: transform .45s var(--ease), box-shadow .45s var(--ease);
}
.services-cats .service:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg) !important;
}
.team .member {
    box-shadow: var(--shadow-sm);
    transition: transform .45s var(--ease), box-shadow .45s var(--ease);
}
.team .member:hover {
    box-shadow: var(--shadow-md);
}
.other-services .icon {
    box-shadow: var(--shadow-sm);
}
.gallery-sec .first-img:after {
    border-radius: var(--radius-md);
}

/* ---------- Forms ---------- */
.form-control {
    border-radius: var(--radius-sm) !important;
    padding: .8rem 1rem !important;
    transition: border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.form-control:focus {
    box-shadow: 0 0 0 4px var(--brand-primary-soft) !important;
    border-color: var(--brand-primary) !important;
}
.form-bg, .contact-page .form-control {
    box-shadow: var(--shadow-sm);
}
input[type=radio] + label:before,
input[type=checkbox] + label:before,
input[type=radio] + .wpcf7-list-item-label:before,
input[type=checkbox] + .wpcf7-list-item-label:before {
    transition: background-color .25s var(--ease), transform .25s var(--ease);
}
input[type=checkbox]:checked + label:before,
input[type=radio]:checked + label:before {
    transform: scale(1.05);
}

/* ---------- Floating whatsapp / social ---------- */
.whatsapp {
    box-shadow: var(--shadow-lg);
    transition: transform .35s var(--ease), box-shadow .35s var(--ease);
}
.whatsapp:hover {
    transform: scale(1.08) translateY(-2px);
}
.fixed-social .icon {
    border-radius: var(--radius-pill);
    box-shadow: var(--shadow-sm);
    transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.fixed-social .icon:hover {
    box-shadow: var(--shadow-brand);
}

/* ---------- Contact info pills ---------- */
.contact-sec .contact-info li svg,
.single-team .contact-info li svg {
    transition: transform .3s var(--ease), background-color .3s var(--ease), color .3s var(--ease);
}
.contact-sec .contact-info li:hover svg,
.single-team .contact-info li:hover svg {
    transform: translateY(-2px);
    box-shadow: var(--shadow-sm);
}
ul.contacts a span {
    box-shadow: var(--shadow-sm);
}

/* ---------- Timeline (about page) ---------- */
.timeline-new .text {
    box-shadow: var(--shadow-md);
}
.timeline .item .info:after {
    box-shadow: 0 0 0 6px rgba(150, 13, 18, .12);
}

/* ---------- Modals ---------- */
.modal .modal-content,
.modal-content {
    border-radius: var(--radius-lg) !important;
    overflow: hidden;
}
.search-modal .search-form {
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-lg);
}

/* ---------- Owl carousel controls ---------- */
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {
    box-shadow: var(--shadow-sm);
    transition: transform .3s var(--ease), background-color .3s var(--ease);
}
.owl-carousel .owl-nav button.owl-prev:hover,
.owl-carousel .owl-nav button.owl-next:hover {
    background: var(--brand-primary) !important;
    transform: scale(1.08);
}

/* ---------- Footer ---------- */
footer .copyright {
    border-top-color: rgba(255, 255, 255, .12);
}
footer ul.social li svg {
    transition: transform .3s var(--ease), color .3s var(--ease);
}
footer ul.social li:hover svg {
    transform: translateY(-3px);
    color: #fff;
}

/* ---------- Inner page header ---------- */
.inner-header {
    border-radius: 0 0 var(--radius-lg) var(--radius-lg);
    overflow: hidden;
}

/* ---------- Misc polish ---------- */
img {
    transition: transform .5s var(--ease);
}
.gallery .item, .archive-clients img {
    border-radius: var(--radius-sm);
    overflow: hidden;
}