* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Inter', sans-serif;
    background: #fffcf2;
    color: #252422;
    line-height: 1.6;
    font-size: 16px;
    overflow-x: hidden;
}

.site-wrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.main-content {
    flex: 1;
    padding-top: 85px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 600;
    line-height: 1.2;
}

a {
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
}

.main-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: rgba(255, 252, 242, 0.95);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(204, 197, 185, 0.3);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.main-header.scrolled {
    background: rgba(255, 252, 242, 0.98);
    box-shadow: 0 4px 20px rgba(37, 36, 34, 0.08);
}

.header-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 85px;
}

.logo-section {
    flex-shrink: 0;
}

.site-logo {
    height: 42px;
    width: auto;
    display: block;
    transition: transform 0.3s ease;
}

.site-logo:hover {
    transform: scale(1.05);
}

.primary-nav {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.nav-items {
    display: flex;
    align-items: center;
    gap: 0.2rem;
}

.nav-item {
    position: relative;
}

.nav-link {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    color: #403d39;
    font-size: 15px;
    font-weight: 500;
    border-radius: 8px;
    transition: all 0.25s ease;
    background: transparent;
    border: none;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
}

.nav-link:hover {
    background: rgba(235, 94, 40, 0.1);
    color: #eb5e28;
}

.nav-icon {
    font-size: 20px;
}

.dropdown-arrow {
    font-size: 18px;
    transition: transform 0.3s ease;
}

.has-dropdown .nav-link:hover .dropdown-arrow {
    transform: rotate(180deg);
}

.dropdown-menu {
    position: absolute;
    top: calc(100% + 12px);
    left: 0;
    background: #fffcf2;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(37, 36, 34, 0.15);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    min-width: 240px;
    border: 1px solid rgba(204, 197, 185, 0.4);
}

.dropdown-menu.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-inner {
    padding: 8px;
}

.dropdown-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    color: #403d39;
    border-radius: 8px;
    transition: all 0.2s ease;
    font-size: 14.5px;
}

.dropdown-link:hover {
    background: rgba(235, 94, 40, 0.08);
    color: #eb5e28;
    transform: translateX(4px);
}

.dropdown-link .material-icons {
    font-size: 20px;
    color: #eb5e28;
}

.contact-btn {
    background: #eb5e28;
    color: #fffcf2;
    margin-left: 1rem;
}

.contact-btn:hover {
    background: #d94e1f;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(235, 94, 40, 0.3);
}

.mobile-toggle {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    color: #403d39;
    padding: 8px;
}

.mobile-toggle .material-icons {
    font-size: 28px;
}

@media (max-width: 1024px) {
    .nav-items {
        gap: 0;
    }
    
    .nav-link {
        padding: 8px 14px;
        font-size: 14px;
    }
    
    .nav-icon {
        font-size: 18px;
    }
}

@media (max-width: 768px) {
    .mobile-toggle {
        display: block;
    }
    
    .nav-items {
        position: fixed;
        top: 85px;
        left: 0;
        right: 0;
        background: #fffcf2;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        padding: 20px;
        box-shadow: 0 8px 24px rgba(37, 36, 34, 0.1);
        transform: translateY(-120%);
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        max-height: calc(100vh - 85px);
        overflow-y: auto;
    }
    
    .primary-nav.mobile-active .nav-items {
        transform: translateY(0);
    }
    
    .nav-item {
        width: 100%;
    }
    
    .nav-link {
        width: 100%;
        justify-content: flex-start;
        padding: 14px 16px;
    }
    
    .dropdown-menu {
        position: static;
        box-shadow: none;
        border: none;
        opacity: 1;
        visibility: visible;
        transform: none;
        background: rgba(235, 94, 40, 0.05);
        margin-top: 8px;
    }
    
    .contact-btn {
        margin-left: 0;
        margin-top: 8px;
    }
}

.site-footer {
    background: #252422;
    color: #ccc5b9;
    padding: 60px 0 30px;
    margin-top: 80px;
}

.footer-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 48px;
    margin-bottom: 48px;
}

.brand-col {
    padding-right: 2rem;
}

.footer-logo img {
    height: 38px;
    width: auto;
    margin-bottom: 1.5rem;
    filter: brightness(0) invert(1);
}

.footer-tagline {
    color: #ccc5b9;
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 24px;
}

.footer-contact {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.contact-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #ccc5b9;
}

.contact-item .material-icons {
    font-size: 18px;
    color: #eb5e28;
}

.contact-item a {
    color: #ccc5b9;
    transition: color 0.3s ease;
}

.contact-item a:hover {
    color: #eb5e28;
}

.footer-heading {
    font-size: 16px;
    font-weight: 600;
    color: #fffcf2;
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.footer-links {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footer-links a {
    color: #ccc5b9;
    font-size: 14px;
    transition: all 0.3s ease;
    display: inline-block;
}

.footer-links a:hover {
    color: #eb5e28;
    transform: translateX(4px);
}

.footer-bottom {
    padding-top: 32px;
    border-top: 1px solid rgba(204, 197, 185, 0.2);
    text-align: center;
}

.copyright {
    font-size: 13px;
    color: #ccc5b9;
}

@media (max-width: 1024px) {
    .footer-grid {
        grid-template-columns: 2fr 1fr 1fr;
        gap: 40px;
    }
    
    .footer-col:last-child {
        grid-column: 2 / 4;
    }
}

@media (max-width: 768px) {
    .site-footer {
        padding: 48px 0 24px;
        margin-top: 60px;
    }
    
    .footer-grid {
        grid-template-columns: 1fr;
        gap: 36px;
        margin-bottom: 36px;
    }
    
    .brand-col {
        padding-right: 0;
    }
    
    .footer-col:last-child {
        grid-column: 1;
    }
}

.cookie-notice {
    position: fixed;
    bottom: -200px;
    left: 50%;
    transform: translateX(-50%);
    background: #403d39;
    color: #fffcf2;
    padding: 24px 32px;
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(37, 36, 34, 0.3);
    z-index: 9999;
    max-width: 640px;
    width: 90%;
    transition: bottom 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.cookie-notice.visible {
    bottom: 32px;
}

.cookie-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.cookie-text h3 {
    font-size: 18px;
    color: #fffcf2;
    margin-bottom: 8px;
    font-weight: 600;
}

.cookie-text p {
    font-size: 14px;
    color: #ccc5b9;
    line-height: 1.5;
}

.cookie-actions {
    display: flex;
    gap: 12px;
    flex-shrink: 0;
}

.cookie-learn {
    padding: 10px 20px;
    background: transparent;
    color: #ccc5b9;
    border: 1px solid #ccc5b9;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.cookie-learn:hover {
    background: rgba(204, 197, 185, 0.1);
    color: #fffcf2;
    border-color: #fffcf2;
}

.cookie-accept {
    padding: 10px 24px;
    background: #eb5e28;
    color: #fffcf2;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.cookie-accept:hover {
    background: #d94e1f;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(235, 94, 40, 0.4);
}

@media (max-width: 640px) {
    .cookie-notice {
        padding: 20px 24px;
        border-radius: 12px;
    }
    
    .cookie-content {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }
    
    .cookie-actions {
        width: 100%;
        flex-direction: column;
    }
    
    .cookie-learn,
    .cookie-accept {
        width: 100%;
        text-align: center;
        padding: 12px;
    }
}

.hero-block {
    background: linear-gradient(135deg, #fffcf2 0%, #f5f1e8 100%);
    padding: 80px 0 100px;
}

.hero-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0px 3%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.hero-content-side {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.hero-text-container {
    max-width: 580px;
}

.hero-title {
    font-size: 52px;
    color: #252422;
    margin-bottom: 24px;
    line-height: 1.15;
    font-weight: 700;
}

.hero-description {
    font-size: 19px;
    color: #403d39;
    margin-bottom: 36px;
    line-height: 1.65;
}

.hero-buttons {
    display: flex;
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
}

.btn-primary-hero {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #eb5e28;
    color: #fffcf2;
    padding: 16px 32px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 16px;
    transition: all .3s ease;
}

.btn-primary-hero:hover {
    background: #d94e1f;
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(235, 94, 40, 0.35);
}

.btn-primary-hero .material-icons {
    font-size: 20px;
}

.btn-secondary-hero {
    display: inline-block;
    padding: 16px 32px;
    border: 2px solid #403d39;
    color: #403d39;
    border-radius: 10px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
}

.btn-secondary-hero:hover {
    background: #403d39;
    color: #fffcf2;
    transform: translateY(-3px);
}

.hero-image-side {
    position: relative;
}

.hero-img-wrapper {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(37,36,34,0.15);
}

.hero-image {
    width: 100%;
    height: auto;
    display: block;
}

@media (max-width: 1024px) {
    .hero-wrapper {
        grid-template-columns: 1fr;
        gap: 50px;
    }
    
    .hero-title {
        font-size: 44px;
    }
    
    .hero-description {
        font-size: 18px;
    }
}

@media (max-width: 640px) {
    .hero-block {
        padding: 50px 0 60px;
    }
    
    .hero-title {
        font-size: 36px;
    }
    
    .hero-description {
        font-size: 17px;
        margin-bottom: 28px;
    }
    
    .hero-buttons {
        flex-direction: column;
        align-items: stretch;
    }
    
    .btn-primary-hero,
    .btn-secondary-hero {
        justify-content: center;
        width: 100%;
    }
}

.stats-section {
    background: #252422;
    padding: 70px 0px;
}

.stats-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 40px;
}

.stat-box {
    text-align: center;
    padding: 20px;
}

.stat-number {
    font-size: 48px;
    font-weight: 700;
    color: #eb5e28;
    font-family: 'Space Grotesk',sans-serif;
    margin-bottom: 8px;
}

.stat-label {
    font-size: 15px;
    color: #ccc5b9;
    text-transform: lowercase;
}

@media (max-width: 768px) {
    .stats-container {
        grid-template-columns: repeat(2,1fr);
        gap: 30px;
    }
    
    .stat-number {
        font-size: 40px;
    }
}

@media (max-width: 480px) {
    .stats-container {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

.trust-factors {
    padding: 100px 0;
    background: #fffcf2;
}

.content-wrap {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.intro-block {
    text-align: center;
    margin-bottom: 60px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.section-heading {
    font-size: 42px;
    color: #252422;
    margin-bottom: 16px;
    font-weight: 700;
}

.section-subtext {
    font-size: 18px;
    color: #403d39;
    line-height: 1.6;
}

.factors-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 32px;
}

.factor-card {
    background: #fff;
    padding: 32px;
    border-radius: 16px;
    transition: all 0.3s ease;
    border: 1px solid rgba(204,197,185,0.3);
}

.factor-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 32px rgba(37, 36, 34, 0.12);
}

.factor-icon-wrap {
    width: 56px;
    height: 56px;
    background: rgba(235, 94, 40, .1);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.factor-icon-wrap .material-icons {
    font-size: 28px;
    color: #eb5e28;
}

.factor-heading {
    font-size: 20px;
    color: #252422;
    margin-bottom: 12px;
    font-weight: 600;
}

.factor-desc {
    font-size: 15px;
    color: #403d39;
    line-height: 1.7;
}

@media (max-width: 1024px) {
    .factors-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .trust-factors {
        padding: 70px 0;
    }
    
    .section-heading {
        font-size: 34px;
    }
    
    .factors-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

.positions-we-fill {
    padding: 100px 0;
    background: linear-gradient(180deg, #fffcf2 0%, #f5f1e8 100%);
}

.positions-intro {
    text-align: center;
    margin-bottom: 70px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.position-categories {
    display: flex;
    flex-direction: column;
    gap: 80px;
}

.category-block {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.category-block.reverse-cat {
    direction: rtl;
}

.category-block.reverse-cat > * {
    direction: ltr;
}

.category-visual {
    position: relative;
}

.category-image {
    width: 100%;
    height: auto;
    border-radius: 16px;
    box-shadow: 0 16px 48px rgba(37, 36, 34, 0.15);
}

.category-info {
    padding: 20px 0;
}

.category-title {
    font-size: 32px;
    color: #252422;
    margin-bottom: 18px;
    font-weight: 700;
}

.category-summary {
    font-size: 17px;
    color: #403d39;
    line-height: 1.7;
    margin-bottom: 28px;
}

.role-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 32px;
}

.role-tag {
    padding: 8px 16px;
    background: rgba(235, 94, 40, 0.1);
    color: #eb5e28;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
}

.category-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #eb5e28;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
}

.category-link:hover {
    gap: 12px;
}

.category-link .material-icons {
    font-size: 20px;
}

@media (max-width: 1024px) {
    .category-block {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .category-block.reverse-cat {
        direction: ltr;
    }
}

@media (max-width: 640px) {
    .positions-we-fill {
        padding: 70px 0;
    }
    
    .category-title {
        font-size: 28px;
    }
    
    .category-summary {
        font-size: 16px;
    }
}

.work-flow {
    padding: 100px 0;
    background: #fffcf2;
}

.flow-intro-section {
    text-align: center;
    margin-bottom: 60px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.flow-steps-container {
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.flow-step {
    display: flex;
    gap: 28px;
    align-items: flex-start;
}

.step-numbr-circle {
    flex-shrink: 0;
    width: 70px;
    height: 70px;
    background: #eb5e28;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.step-number {
    font-size: 24px;
    font-weight: 700;
    color: #fffcf2;
    font-family: 'Space Grotesk', sans-serif;
}

.step-details {
    flex: 1;
    padding-top: 8px;
}

.step-heading {
    font-size: 24px;
    color: #252422;
    margin-bottom: 12px;
    font-weight: 600;
}

.step-text {
    font-size: 16px;
    color: #403d39;
    line-height: 1.7;
}

@media (max-width: 640px) {
    .work-flow {
        padding: 70px 0;
    }
    
    .flow-step {
        gap: 20px;
    }
    
    .step-numbr-circle {
        width: 60px;
        height: 60px;
    }
    
    .step-number {
        font-size: 20px;
    }
    
    .step-heading {
        font-size: 20px;
    }
}

.client-feedback {
    padding: 100px 0;
    background: linear-gradient(180deg, #f5f1e8 0%, #fffcf2 100%);
}

.feedback-intro {
    text-align: center;
    margin-bottom: 60px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.feedback-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}

.feedback-card {
    background: #fff;
    padding: 36px;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(37, 36, 34, 0.08);
    transition: all 0.3s ease;
}

.feedback-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 32px rgba(37, 36, 34, 0.12);
}

.feedback-body {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.feedback-quote {
    font-size: 16px;
    color: #403d39;
    line-height: 1.75;
    font-style: italic;
}

.client-info-section {
    display: flex;
    gap: 16px;
    align-items: center;
    padding-top: 20px;
    border-top: 1px solid rgba(204, 197, 185, 0.3);
}

.client-avatar-wrap {
    flex-shrink: 0;
}

.client-avatar-img {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    object-fit: cover;
}

.client-name {
    font-size: 16px;
    font-weight: 600;
    color: #252422;
    margin-bottom: 4px;
}

.client-role {
    font-size: 14px;
    color: #403d39;
}

@media (max-width: 1024px) {
    .feedback-cards-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}

@media (max-width: 640px) {
    .client-feedback {
        padding: 70px 0;
    }
    
    .feedback-card {
        padding: 28px;
    }
}

.past-projects-showcase {
    padding: 100px 0;
    background: #fffcf2;
}

.projects-header {
    text-align: center;
    margin-bottom: 60px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.projects-grid-display {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-bottom: 50px;
}

.project-item {
    background: #fff;
    padding: 32px;
    border-radius: 16px;
    border: 1px solid rgba(204, 197, 185, 0.3);
    transition: all 0.3s ease;
}

.project-item:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 32px rgba(37, 36, 34, 0.12);
}

.project-label {
    display: inline-block;
    padding: 6px 14px;
    background: rgba(235, 94, 40, 0.1);
    color: #eb5e28;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 20px;
}

.project-name {
    font-size: 22px;
    color: #252422;
    margin-bottom: 14px;
    font-weight: 600;
}

.project-brief {
    font-size: 15px;
    color: #403d39;
    line-height: 1.7;
    margin-bottom: 24px;
}

.project-numbers {
    display: flex;
    gap: 24px;
    padding-top: 20px;
    border-top: 1px solid rgba(204, 197, 185, 0.3);
}

.number-block {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.number-val {
    font-size: 20px;
    font-weight: 700;
    color: #eb5e28;
    font-family: 'Space Grotesk', sans-serif;
}

.number-desc {
    font-size: 13px;
    color: #403d39;
}

.projects-cta-wrap {
    text-align: center;
}

.btn-secondary-large {
    display: inline-block;
    padding: 16px 36px;
    border: 2px solid #403d39;
    color: #403d39;
    border-radius: 10px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
}

.btn-secondary-large:hover {
    background: #403d39;
    color: #fffcf2;
    transform: translateY(-3px);
}

@media (max-width: 1024px) {
    .projects-grid-display {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}

@media (max-width: 640px) {
    .past-projects-showcase {
        padding: 70px 0;
    }
    
    .project-numbers {
        flex-direction: column;
        gap: 16px;
    }
}

.quick-contact-area {
    padding: 100px 0;
    background: linear-gradient(135deg,#252422 0%,#403d39 100%);
}

.contact-area-wrap {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.quick-contact-box {
    text-align: center;
    max-width: 700px;
    margin: 0 auto;
}

.contact-title {
    font-size: 44px;
    color: #fffcf2;
    margin-bottom: 20px;
    font-weight: 700;
}

.contact-desc {
    font-size: 19px;
    color: #ccc5b9;
    line-height: 1.7;
    margin-bottom: 40px;
}

.contact-methods {
    display: flex;
    gap: 20px;
    justify-content: center;
    margin-bottom: 32px;
    flex-wrap: wrap;
}

.method-btn {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 32px;
    border-radius: 12px;
    transition: all .3s ease;
    min-width: 280px;
}

.phone-btn {
    background: #eb5e28;
    color: #fffcf2;
}

.phone-btn:hover {
    background: #d94e1f;
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(235,94,40,0.4);
}

.message-btn {
    background: transparent;
    border: 2px solid #ccc5b9;
    color: #fffcf2;
}

.message-btn:hover {
    background: rgba(255, 252, 242, .1);
    border-color: #fffcf2;
    transform: translateY(-4px);
}

.method-btn .material-icons {
    font-size: 28px;
}

.btn-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.btn-label {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .5px;
    opacity: 0.8;
}

.btn-value {
    font-size: 17px;
    font-weight: 600;
}

.location-note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #ccc5b9;
    font-size: 15px;
}

.location-note .material-icons {
    font-size: 20px;
}

@media (max-width: 768px) {
    .quick-contact-area {
        padding: 70px 0;
    }
    
    .contact-title {
        font-size: 34px;
    }
    
    .contact-desc {
        font-size: 17px;
        margin-bottom: 32px;
    }
    
    .contact-methods {
        flex-direction: column;
        align-items: stretch;
    }
    
    .method-btn {
        min-width: auto;
        justify-content: center;
    }
    
    .btn-text {
        align-items: center;
    }
}

.intro-banner-abt {
    background: linear-gradient(135deg, #fffcf2 0%, #f5f1e8 100%);
	padding: 110px 0 85px;
}

.intro-container-x {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 3%;
}

.intro-inner-wrap {
    text-align: center;
    max-width: 750px;
	margin: 0 auto;
}

.breadcrumb-nav-bit {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-bottom: 22px;
	font-size: 14px;
	color: #403d39;
}

.breadcrumb-nav-bit a {
    color: #eb5e28;
    transition: color .3s ease;
}

.breadcrumb-nav-bit .material-icons {
    font-size: 18px;
    color: #ccc5b9;
}

.page-title-main {
    font-size: 54px;
    color: #252422;
    margin-bottom: 18px;
    line-height: 1.1;
    font-weight: 700;
    font-family: 'Space Grotesk', sans-serif;
}

.intro-para-text {
    font-size: 19px;
    color: #403d39;
    line-height: 1.6;
    margin-bottom: 36px;
}

.live-counters-row {
    display: flex;
    gap: 40px;
    justify-content: center;
    flex-wrap: wrap;
}

.counter-block {
    text-align: center;
    padding: 20px;
}

.counter-num {
    font-size: 42px;
    font-weight: 700;
    color: #eb5e28;
    font-family: 'Space Grotesk', sans-serif;
    margin-bottom: 6px;
}

.counter-label {
    font-size: 14px;
    color: #403d39;
    text-transform: lowercase;
}

@media (max-width: 768px) {
    .intro-banner-abt {
        padding: 80px 0 60px;
    }
    
    .page-title-main {
        font-size: 36px;
    }
    
    .intro-para-text {
        font-size: 17px;
    }
    
    .live-counters-row {
        gap: 24px;
    }
}

.world-map-clients {
    padding: 95px 0;
    background: #fffcf2;
}

.map-section-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.map-header-area {
    text-align: center;
	margin-bottom: 60px;
	max-width: 650px;
	margin-left: auto;
	margin-right: auto;
}

.map-title {
    font-size: 40px;
    color: #252422;
    margin-bottom: 16px;
    font-weight: 700;
    line-height: 1.2;
}

.map-subtitle {
    font-size: 17px;
    color: #403d39;
    line-height: 1.6;
}

.map-visual-container {
    position: relative;
    margin-bottom: 50px;
}

.map-image-wrapper {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 16px 48px rgba(37, 36, 34, .15);
}

.world-map-img {
    width: 100%;
    height: auto;
    display: block;
}

.map-markers {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.map-marker {
    position: absolute;
    cursor: pointer;
    transition: transform .3s ease;
}

.map-marker:hover {
    transform: scale(1.1);
}

.marker-dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    margin-bottom: 8px;
    position: relative;
    animation: pulse-dot 2s infinite;
}

.europe-dot {
    background: #3b82f6;
}

.asia-dot {
    background: #10b981;
}

.america-dot {
    background: #f59e0b;
}

@keyframes pulse-dot {
    0% {
        box-shadow: 0 0 0 0 rgba(59, 130, 246, .7);
    }
    70% {
        box-shadow: 0 0 0 8px rgba(59, 130, 246, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(59, 130, 246, 0);
    }
}

.marker-info {
    background: rgba(255, 252, 242, .95);
    backdrop-filter: blur(8px);
    padding: 8px 12px;
    border-radius: 8px;
    text-align: center;
    min-width: 80px;
    border: 1px solid rgba(204, 197, 185, .3);
}

.marker-count {
    font-size: 18px;
    font-weight: 700;
    color: #252422;
    display: block;
    line-height: 1;
}

.marker-region {
    font-size: 12px;
    color: #403d39;
    text-transform: lowercase;
}

.region-stats-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}

.region-card {
    background: #fff;
    padding: 28px;
    border-radius: 12px;
    border: 1px solid rgba(204, 197, 185, .3);
    transition: all .3s ease;
}

.region-card:hover, .region-card.active-region {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(37, 36, 34, .1);
}

.region-icon {
    font-size: 32px;
    margin-bottom: 16px;
}

.region-name {
    font-size: 20px;
    color: #252422;
    margin-bottom: 12px;
    font-weight: 600;
}

.region-stats {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.stat-item {
    font-size: 14px;
    color: #403d39;
}

@media (max-width: 1024px) {
    .region-stats-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

@media (max-width: 640px) {
    .world-map-clients {
        padding: 70px 0;
    }
    
    .map-title {
        font-size: 32px;
    }
}

.behind-scenes-work {
	padding: 100px 0;
	background: linear-gradient(180deg, #f5f1e8 0%, #fffcf2 100%);
}

.bts-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.bts-layout-main {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 70px;
    align-items: center;
}

.bts-content-inner {
    max-width: 580px;
}

.section-tag-x {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 16px;
    background: rgba(235, 94, 40, .1);
    color: #eb5e28;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .5px;
    margin-bottom: 18px;
}

.section-tag-x .material-icons {
    font-size: 16px;
}

.bts-heading {
    font-size: 40px;
    color: #252422;
    margin-bottom: 24px;
    font-weight: 700;
    line-height: 1.2;
}

.bts-text-blocks {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin-bottom: 32px;
}

.bts-para {
    font-size: 16px;
    color: #403d39;
    line-height: 1.7;
}

.daily-workflow-items {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.workflow-item {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 12px 16px;
    background: rgba(255, 255, 255, .6);
    border-radius: 8px;
    border: 1px solid rgba(204, 197, 185, .2);
}

.workflow-time {
    font-size: 14px;
    font-weight: 600;
    color: #eb5e28;
    min-width: 65px;
    flex-shrink: 0;
}

.workflow-desc {
    font-size: 15px;
    color: #403d39;
}

.bts-image-container {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 16px 48px rgba(37, 36, 34, .15);
}

.bts-main-image {
    width: 100%;
    height: auto;
    display: block;
}

.current-activity-overlay {
    position: absolute;
    top: 20px;
    right: 20px;
    background: rgba(255, 252, 242, .95);
    backdrop-filter: blur(10px);
    padding: 16px 20px;
    border-radius: 12px;
    border: 1px solid rgba(204, 197, 185, .3);
}

.activity-status {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.status-indicator {
    width: 8px;
    height: 8px;
    background: #10b981;
    border-radius: 50%;
    animation: blink-status 1.5s infinite;
}

@keyframes blink-status {
    0%, 50% { opacity: 1; }
    51%, 100% { opacity: .3; }
}

.status-text {
    font-size: 13px;
    color: #252422;
    font-weight: 600;
}

.activity-stats {
    display: flex;
    gap: 16px;
}

.activity-stat {
    text-align: center;
}

.stat-number {
    font-size: 20px;
    font-weight: 700;
    color: #eb5e28;
    line-height: 1;
    font-family: 'Space Grotesk', sans-serif;
}

.stat-desc {
    font-size: 11px;
    color: #403d39;
    text-transform: lowercase;
}

@media (max-width: 1024px) {
    .bts-layout-main {
        grid-template-columns: 1fr;
        gap: 50px;
    }
}

@media (max-width: 640px) {
    .behind-scenes-work {
        padding: 70px 0;
    }
    
    .bts-heading {
        font-size: 32px;
    }
    
    .workflow-item {
        flex-direction: column;
        text-align: center;
        gap: 8px;
    }
    
    .current-activity-overlay {
        position: static;
        margin-top: 20px;
    }
}

.recruiter-profiles-sec {
    padding: 100px 0;
    background: #fffcf2;
}

.profiles-wrapper-main {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.profiles-header-section {
    text-align: center;
    margin-bottom: 60px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.profiles-main-title {
    font-size: 40px;
    color: #252422;
    margin-bottom: 16px;
    font-weight: 700;
    line-height: 1.2;
}

.profiles-subtitle {
    font-size: 17px;
    color: #403d39;
    line-height: 1.6;
}

.recruiter-cards-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}

.recruiter-card-item {
    background: #fff;
    border-radius: 16px;
    border: 1px solid rgba(204, 197, 185, .3);
    transition: all .3s ease;
    overflow: hidden;
}

.recruiter-card-item:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 32px rgba(37, 36, 34, .12);
}

.recruiter-card-inner {
    padding: 32px;
}

.recruiter-header-info {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 24px;
}

.recruiter-avatar-wrapper {
    position: relative;
    flex-shrink: 0;
}

.recruiter-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    font-family: 'Space Grotesk', sans-serif;
}

.bg-blue { background: #3b82f6; }
.bg-green { background: #10b981; }
.bg-orange { background: #f59e0b; }

.status-badge {
    position: absolute;
    bottom: 2px;
    right: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid #fff;
}

.status-badge.online { background: #10b981; }
.status-badge.busy { background: #ef4444; }
.status-badge.away { background: #f59e0b; }

.recruiter-name {
    font-size: 18px;
    color: #252422;
    margin-bottom: 4px;
    font-weight: 600;
}

.recruiter-role {
    font-size: 14px;
    color: #eb5e28;
    margin-bottom: 8px;
    font-weight: 500;
}

.recruiter-specialties {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.specialty-tag {
    padding: 4px 8px;
    background: rgba(235, 94, 40, .1);
    color: #eb5e28;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
}

.recruiter-stats-section {
    display: flex;
    gap: 16px;
    margin-bottom: 20px;
    padding: 16px;
    background: rgba(245, 241, 232, .5);
    border-radius: 8px;
}

.recruiter-stat {
    text-align: center;
    flex: 1;
}

.stat-val {
    font-size: 20px;
    font-weight: 700;
    color: #252422;
    line-height: 1;
    font-family: 'Space Grotesk', sans-serif;
}

.stat-lbl {
    font-size: 12px;
    color: #403d39;
    text-transform: lowercase;
    margin-top: 2px;
}

.recruiter-about {
    font-size: 14px;
    color: #403d39;
    line-height: 1.6;
}

@media (max-width: 1024px) {
    .recruiter-cards-container {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

@media (max-width: 640px) {
    .recruiter-profiles-sec {
        padding: 70px 0;
    }
    
    .profiles-main-title {
        font-size: 32px;
    }
    
    .recruiter-card-inner {
        padding: 24px;
    }
}

.real-feedback-wall {
    padding: 100px 0;
    background: linear-gradient(180deg, #f5f1e8 0%, #fffcf2 100%);
}

.feedback-container-main {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.feedback-header-area {
    text-align: center;
    margin-bottom: 60px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.feedback-main-title {
    font-size: 40px;
    color: #252422;
    margin-bottom: 16px;
    font-weight: 700;
    line-height: 1.2;
}

.feedback-subtitle {
    font-size: 17px;
    color: #403d39;
    line-height: 1.6;
}

.feedback-messages-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
}

.feedback-message-card {
    background: #fff;
    padding: 24px;
    border-radius: 12px;
    border: 1px solid rgba(204, 197, 185, .3);
    transition: all .3s ease;
}

.feedback-message-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(37, 36, 34, .08);
}

.message-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
}

.sender-info {
    display: flex;
    gap: 12px;
    align-items: center;
}

.sender-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #eb5e28;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0;
}

.sender-name {
    font-size: 16px;
    color: #252422;
    font-weight: 600;
    display: block;
    margin-bottom: 2px;
}

.sender-company {
    font-size: 13px;
    color: #403d39;
}

.message-time {
    font-size: 12px;
    color: #ccc5b9;
    flex-shrink: 0;
}

.message-content p {
    font-size: 15px;
    color: #403d39;
    line-height: 1.7;
    font-style: italic;
    margin-bottom: 16px;
}

.message-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 12px;
    border-top: 1px solid rgba(204, 197, 185, .2);
}

.message-type {
    font-size: 12px;
    color: #eb5e28;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.position-filled {
    font-size: 12px;
    color: #403d39;
}

@media (max-width: 1024px) {
    .feedback-messages-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

@media (max-width: 640px) {
    .real-feedback-wall {
        padding: 70px 0;
    }
    
    .feedback-main-title {
        font-size: 32px;
    }
}

.current-numbers-live {
    padding: 100px 0;
    background: #fffcf2;
}

.live-numbers-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.numbers-header-section {
    text-align: center;
    margin-bottom: 60px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.numbers-title {
    font-size: 40px;
    color: #252422;
    margin-bottom: 16px;
    font-weight: 700;
    line-height: 1.2;
}

.numbers-subtitle {
    font-size: 17px;
    color: #403d39;
    line-height: 1.6;
}

.live-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    margin-bottom: 50px;
}

.dashboard-card {
    background: #fff;
    padding: 24px;
    border-radius: 12px;
    border: 1px solid rgba(204, 197, 185, .3);
    transition: all .3s ease;
}

.dashboard-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(37, 36, 34, .08);
}

.card-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
}

.card-header .material-icons {
    font-size: 20px;
    color: #eb5e28;
}

.card-title {
    font-size: 14px;
    color: #403d39;
    font-weight: 600;
    text-transform: lowercase;
}

.big-number {
    font-size: 36px;
    font-weight: 700;
    color: #252422;
    line-height: 1;
    font-family: 'Space Grotesk', sans-serif;
    margin-bottom: 12px;
}

.card-details {
    display: flex;
    gap: 16px;
}

.detail-item {
    text-align: center;
    flex: 1;
}

.detail-count {
    font-size: 16px;
    font-weight: 600;
    color: #eb5e28;
    display: block;
    line-height: 1;
}

.detail-label {
    font-size: 11px;
    color: #403d39;
    text-transform: lowercase;
    margin-top: 2px;
}

.recent-activity-feed {
    background: #fff;
    padding: 32px;
    border-radius: 16px;
    border: 1px solid rgba(204, 197, 185, .3);
}

.activity-title {
    font-size: 18px;
    color: #252422;
    margin-bottom: 20px;
    font-weight: 600;
}

.activity-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.activity-item {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 12px 16px;
    background: rgba(245, 241, 232, .3);
    border-radius: 8px;
}

.activity-time {
    font-size: 12px;
    color: #eb5e28;
    font-weight: 500;
    min-width: 65px;
    flex-shrink: 0;
}

.activity-text {
    font-size: 14px;
    color: #403d39;
    line-height: 1.5;
}

@media (max-width: 1024px) {
    .live-dashboard-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .current-numbers-live {
        padding: 70px 0;
    }
    
    .numbers-title {
        font-size: 32px;
    }
    
    .live-dashboard-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

.why-work-differently {
    padding: 100px 0;
    background: linear-gradient(180deg, #f5f1e8 0%, #fffcf2 100%);
}

.different-approach-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.approach-layout-grid {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 70px;
    align-items: flex-start;
}

.approach-content-inner {
    max-width: 580px;
}

.approach-heading {
    font-size: 40px;
    color: #252422;
    margin-bottom: 32px;
    font-weight: 700;
    line-height: 1.2;
}

.approach-reasons-list {
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.reason-block {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.reason-number {
    width: 40px;
    height: 40px;
    background: #eb5e28;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    flex-shrink: 0;
    font-family: 'Space Grotesk', sans-serif;
}

.reason-title {
    font-size: 18px;
    color: #252422;
    margin-bottom: 8px;
    font-weight: 600;
}

.reason-text {
    font-size: 15px;
    color: #403d39;
    line-height: 1.7;
}

.comparison-stats-container {
    background: #fff;
    padding: 32px;
    border-radius: 16px;
    border: 1px solid rgba(204, 197, 185, .3);
}

.comparison-title {
    font-size: 20px;
    color: #252422;
    margin-bottom: 24px;
    font-weight: 600;
    text-align: center;
}

.comparison-grid {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.comparison-item {
    padding: 16px;
    background: rgba(245, 241, 232, .3);
    border-radius: 8px;
}

.comparison-label {
    font-size: 13px;
    color: #403d39;
    margin-bottom: 8px;
    text-transform: lowercase;
}

.comparison-values {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.our-value {
    font-size: 20px;
    font-weight: 700;
    color: #10b981;
    flex: 1;
    text-align: center;
}

.vs-text {
    font-size: 12px;
    color: #ccc5b9;
    font-weight: 500;
}

.their-value {
    font-size: 20px;
    font-weight: 700;
    color: #ef4444;
    flex: 1;
    text-align: center;
}

@media (max-width: 1024px) {
    .approach-layout-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }
}

@media (max-width: 640px) {
    .why-work-differently {
        padding: 70px 0;
    }
    
    .approach-heading {
        font-size: 32px;
    }
    
    .reason-block {
        gap: 16px;
    }
}

/* EXPERTISE PAGE STYLES */
.services-hero-area {
    background: linear-gradient(135deg, #fffcf2 0%, #f5f1e8 100%);
    padding: 80px 0px 70px;
}

.services-hero-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.services-hero-content {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.hero-content-inner {
    padding: 20px 0;
}

.services-main-title {
    font-size: 48px;
    color: #252422;
    margin-bottom: 24px;
    font-weight: 700;
    line-height: 1.2;
}

.services-hero-desc {
    font-size: 19px;
    color: #403d39;
    line-height: 1.7;
    max-width: 680px;
    margin: 0 auto;
}

.quick-stats-banner {
    background: #252422;
    padding: 50px 0px;
}

.stats-banner-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0px 3%;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 40px;
}

.stat-item-box {
    text-align: center;
    padding: 15px;
}

.stat-number-display {
    font-size: 42px;
    font-weight: 700;
    color: #eb5e28;
    font-family: 'Space Grotesk',sans-serif;
    margin-bottom: 8px;
}

.stat-label-txt {
    font-size: 14px;
    color: #ccc5b9;
    text-transform: lowercase;
}

.core-services-display {
    padding: 100px 0;
    background: #fffcf2;
}

.services-content-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.services-grid-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.service-main-card {
    background: #fff;
    border-radius: 20px;
    padding: 48px;
    border: 1px solid rgba(204, 197, 185, 0.3);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.service-main-card:hover {
    transform: translateY(-8px);
    box-shadow: 0px 20px 60px rgba(37, 36, 34, 0.15);
}

.service-card-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.service-icon-container {
    width: 80px;
    height: 80px;
    background: rgba(235, 94, 40, 0.1);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 28px;
    flex-shrink: 0;
}

.service-main-icon {
    font-size: 36px;
    color: #eb5e28;
}

.service-content-block {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.service-title-text {
    font-size: 28px;
    color: #252422;
    margin-bottom: 18px;
    font-weight: 600;
}

.service-description-text {
    font-size: 17px;
    color: #403d39;
    line-height: 1.7;
    margin-bottom: 32px;
}

.service-features-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 36px;
    flex: 1;
}

.feature-item-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

.feature-check {
    font-size: 20px;
    color: #eb5e28;
    flex-shrink: 0;
}

.feature-text {
    font-size: 15px;
    color: #403d39;
    line-height: 1.5;
}

.service-action-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #eb5e28;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
    align-self: flex-start;
}

.service-action-link:hover {
    gap: 12px;
    transform: translateX(4px);
}

.service-action-link .material-icons {
    font-size: 20px;
}

.why-choose-us-area {
    padding: 100px 0;
    background: #fffcf2;
}

.why-choose-content-wrap {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.why-choose-intro {
    text-align: center;
    margin-bottom: 60px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.why-choose-heading {
    font-size: 42px;
    color: #252422;
    margin-bottom: 18px;
    font-weight: 700;
}

.why-choose-subtext {
    font-size: 18px;
    color: #403d39;
    line-height: 1.6;
}

.advantages-display-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}

.advantage-card-item {
    background: #fff;
    padding: 36px;
    border-radius: 16px;
    border: 1px solid rgba(204, 197, 185, 0.3);
    transition: all 0.3s ease;
}

.advantage-card-item:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 36px rgba(37, 36, 34, 0.12);
}

.advantage-icon-wrap {
    width: 64px;
    height: 64px;
    background: rgba(235, 94, 40, 0.1);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}

.advantage-icon {
    font-size: 32px;
    color: #eb5e28;
}

.advantage-title {
    font-size: 22px;
    color: #252422;
    margin-bottom: 14px;
    font-weight: 600;
}

.advantage-description {
    font-size: 16px;
    color: #403d39;
    line-height: 1.7;
}

/* TECH RECRUITMENT PAGE STYLES */
.tech-recruit-hero-section {
    background: linear-gradient(135deg, #fffcf2 0%, #f5f1e8 100%);
    padding: 5rem 0 90px;
}

.tech-hero-content-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0px 3%;
}

.tech-hero-inner-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3.75rem;
    align-items: center;
}

.tech-hero-text-block {
    max-width: 580px;
}

.tech-recruit-main-title {
    font-size: 3.125rem;
    color: #252422;
    margin-bottom: 1.5rem;
    font-weight: 700;
    line-height: 1.15;
}

.tech-recruit-hero-description {
    font-size: 18px;
    color: #403d39;
    line-height: 1.7;
    margin-bottom: 36px;
}

.tech-hero-action-buttons {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
}

.btn-primary-tech {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #eb5e28;
    color: #fffcf2;
    padding: 1rem 2rem;
    border-radius: 10px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
}

.btn-primary-tech:hover {
    background: #d94e1f;
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(235, 94, 40, 0.35);
}

.btn-primary-tech .material-icons {
    font-size: 1.25rem;
}

.btn-secondary-tech {
    display: inline-block;
    padding: 16px 32px;
    border: 2px solid #403d39;
    color: #403d39;
    border-radius: 0.625rem;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
}

.btn-secondary-tech:hover {
    background: #403d39;
    color: #fffcf2;
    transform: translateY(-3px);
}

.tech-hero-visual-block {
    position: relative;
}

.tech-hero-image-container {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 1.25rem 3.75rem rgba(37, 36, 34, 0.15);
}

.tech-hero-image {
    width: 100%;
    height: auto;
    display: block;
}

.tech-roles-we-fill-area {
    padding: 100px 0;
    background: #fffcf2;
}

.tech-roles-content-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.tech-roles-intro-section {
    text-align: center;
    margin-bottom: 70px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.tech-roles-section-title {
    font-size: 42px;
    color: #252422;
    margin-bottom: 18px;
    font-weight: 700;
}

.tech-roles-section-subtitle {
    font-size: 18px;
    color: #403d39;
    line-height: 1.6;
}

.tech-roles-categories-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}

.tech-role-category-item {
    background: #fff;
    padding: 40px;
    border-radius: 20px;
    border: 1px solid rgba(204, 197, 185, 0.3);
    transition: all 0.3s ease;
}

.tech-role-category-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 48px rgba(37, 36, 34, 0.12);
}

.role-category-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 24px;
}

.role-category-icon-wrap {
    width: 60px;
    height: 60px;
    background: rgba(235, 94, 40, 0.1);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.role-category-icon {
    font-size: 28px;
    color: #eb5e28;
}

.role-category-title {
    font-size: 24px;
    color: #252422;
    font-weight: 600;
    margin: 0;
}

.role-category-content {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.role-category-description {
    font-size: 16px;
    color: #403d39;
    line-height: 1.7;
}

.role-list-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.role-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.role-bullet {
    font-size: 18px;
    color: #eb5e28;
    flex-shrink: 0;
}

.role-name {
    font-size: 15px;
    color: #403d39;
    line-height: 1.5;
}

.recruitment-process-overview {
    padding: 100px 0;
    background: linear-gradient(180deg, #f5f1e8 0%, #fffcf2 100%);
}

.recruitment-process-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 3%;
}

.process-overview-intro {
    text-align: center;
    margin-bottom: 70px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.process-overview-heading {
    font-size: 42px;
    color: #252422;
    margin-bottom: 18px;
    font-weight: 700;
}

.process-overview-description {
    font-size: 18px;
    color: #403d39;
    line-height: 1.6;
}

.recruitment-process-timeline {
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.process-timeline-item {
    display: flex;
    gap: 40px;
    align-items: flex-start;
}

.timeline-marker {
    flex-shrink: 0;
    position: relative;
}

.timeline-number {
    width: 80px;
    height: 80px;
    background: #eb5e28;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    font-weight: 700;
    color: #fffcf2;
    font-family: 'Space Grotesk', sans-serif;
}

.timeline-content {
    flex: 1;
    padding-top: 10px;
}

.timeline-step-title {
    font-size: 26px;
    color: #252422;
    margin-bottom: 16px;
    font-weight: 600;
}

.timeline-step-description {
    font-size: 17px;
    color: #403d39;
    line-height: 1.7;
    margin-bottom: 24px;
}

.timeline-details {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.timeline-detail-item {
    padding: 8px 16px;
    background: rgba(235, 94, 40, 0.1);
    color: #eb5e28;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
}

/* HR ADVISORY PAGE STYLES */
.hr-advisory-hero-area {
    background: linear-gradient(135deg, #fffcf2 0%, #f5f1e8 100%);
    padding: 80px 0 90px;
}

.hr-hero-content-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.hr-hero-inner-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 300px;
}

.hr-hero-text-section {
    text-align: center;
    max-width: 800px;
}

.hr-advisory-main-heading {
    font-size: 52px;
    color: #252422;
    margin-bottom: 24px;
    font-weight: 700;
    line-height: 1.15;
}

.hr-advisory-hero-text {
    font-size: 19px;
    color: #403d39;
    line-height: 1.7;
    margin-bottom: 36px;
}

.hr-hero-buttons-container {
    display: flex;
    gap: 18px;
    justify-content: center;
    flex-wrap: wrap;
}

.btn-primary-hr {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #eb5e28;
    color: #fffcf2;
    padding: 16px 32px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
}

.btn-primary-hr:hover {
    background: #d94e1f;
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(235, 94, 40, 0.35);
}

.btn-primary-hr .material-icons {
    font-size: 20px;
}

.btn-secondary-hr {
    display: inline-block;
    padding: 16px 32px;
    border: 2px solid #403d39;
    color: #403d39;
    border-radius: 10px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
}

.btn-secondary-hr:hover {
    background: #403d39;
    color: #fffcf2;
    transform: translateY(-3px);
}

.hr-services-breakdown-area {
    padding: 100px 0;
    background: #fffcf2;
}

.hr-services-content-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.hr-services-intro-block {
    text-align: center;
    margin-bottom: 70px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.hr-services-section-title {
    font-size: 42px;
    color: #252422;
    margin-bottom: 18px;
    font-weight: 700;
}

.hr-services-section-description {
    font-size: 18px;
    color: #403d39;
    line-height: 1.6;
}

.hr-services-grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}

.hr-service-item {
    background: #fff;
    padding: 40px;
    border-radius: 20px;
    border: 1px solid rgba(204, 197, 185, 0.3);
    transition: all 0.3s ease;
}

.hr-service-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 48px rgba(37, 36, 34, 0.12);
}

.hr-service-header-section {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 24px;
}

.hr-service-icon-container {
    width: 60px;
    height: 60px;
    background: rgba(235, 94, 40, 0.1);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.hr-service-icon {
    font-size: 28px;
    color: #eb5e28;
}

.hr-service-title {
    font-size: 24px;
    color: #252422;
    font-weight: 600;
    margin: 0;
}

.hr-service-content-block {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.hr-service-description {
    font-size: 16px;
    color: #403d39;
    line-height: 1.7;
}

.hr-service-benefits-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.benefit-line-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.benefit-check-icon {
    font-size: 20px;
    color: #eb5e28;
    flex-shrink: 0;
}

.benefit-text {
    font-size: 15px;
    color: #403d39;
    line-height: 1.5;
}

.hr-consultation-approach-section {
    padding: 100px 0;
    background: linear-gradient(180deg, #f5f1e8 0%, #fffcf2 100%);
}

.consultation-approach-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.consultation-intro-area {
    text-align: center;
    margin-bottom: 70px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.consultation-section-heading {
    font-size: 42px;
    color: #252422;
    margin-bottom: 18px;
    font-weight: 700;
}

.consultation-section-subtitle {
    font-size: 18px;
    color: #403d39;
    line-height: 1.6;
}

.consultation-methodology-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}

.methodology-phase-block {
    background: #fff;
    padding: 36px;
    border-radius: 16px;
    border: 1px solid rgba(204, 197, 185, 0.3);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.methodology-phase-block:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 36px rgba(37, 36, 34, 0.12);
}

.phase-number-indicator {
    width: 50px;
    height: 50px;
    background: #eb5e28;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 700;
    color: #fffcf2;
    font-family: 'Space Grotesk', sans-serif;
    flex-shrink: 0;
}

.phase-content-area {
    flex: 1;
}

.phase-heading-title {
    font-size: 22px;
    color: #252422;
    margin-bottom: 14px;
    font-weight: 600;
}

.phase-description-text {
    font-size: 16px;
    color: #403d39;
    line-height: 1.7;
    margin-bottom: 20px;
}

.phase-activities-container {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.activity-item {
    padding: 6px 12px;
    background: rgba(235, 94, 40, 0.08);
    color: #403d39;
    border-radius: 6px;
    font-size: 14px;
    border-left: 3px solid #eb5e28;
}

.hr-results-showcase-area {
    padding: 100px 0;
    background: #fffcf2;
}

.hr-results-content-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.hr-results-intro-section {
    text-align: center;
    margin-bottom: 70px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.hr-results-heading {
    font-size: 42px;
    color: #252422;
    margin-bottom: 18px;
    font-weight: 700;
}

.hr-results-description {
    font-size: 18px;
    color: #403d39;
    line-height: 1.6;
}

.hr-results-metrics-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}

.result-metric-card {
    background: #fff;
    padding: 36px;
    border-radius: 16px;
    text-align: center;
    border: 1px solid rgba(204, 197, 185, 0.3);
    transition: all 0.3s ease;
}

.result-metric-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 36px rgba(37, 36, 34, 0.12);
}

.metric-value-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 16px;
}

.metric-number {
    font-size: 48px;
    font-weight: 700;
    color: #eb5e28;
    font-family: 'Space Grotesk', sans-serif;
}

.metric-trend {
    display: flex;
    align-items: center;
    gap: 4px;
}

.trend-icon {
    font-size: 24px;
    color: #eb5e28;
}

.trend-text {
    font-size: 14px;
    color: #eb5e28;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.metric-label-text {
    font-size: 18px;
    color: #252422;
    font-weight: 600;
    margin-bottom: 8px;
}

.metric-context-info {
    font-size: 14px;
    color: #403d39;
    line-height: 1.5;
}

.hr-consultation-cta-area {
    padding: 100px 0;
    background: linear-gradient(135deg, #252422 0%, #403d39 100%);
}

.hr-cta-content-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.hr-cta-inner-container {
    text-align: center;
    max-width: 700px;
    margin: 0 auto;
}

.hr-cta-text-block {
    margin-bottom: 40px;
}

.hr-cta-heading {
    font-size: 44px;
    color: #fffcf2;
    margin-bottom: 20px;
    font-weight: 700;
}

.hr-cta-description {
    font-size: 19px;
    color: #ccc5b9;
    line-height: 1.7;
}

.hr-cta-actions-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.btn-primary-cta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: #eb5e28;
    color: #fffcf2;
    padding: 18px 36px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 17px;
    transition: all 0.3s ease;
}

.btn-primary-cta:hover {
    background: #d94e1f;
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(235, 94, 40, 0.4);
}

.btn-primary-cta .material-icons {
    font-size: 22px;
}

.cta-alternative-text {
    color: #ccc5b9;
    font-size: 15px;
}

.phone-link {
    color: #eb5e28;
    font-weight: 600;
    transition: color 0.3s ease;
}

.phone-link:hover {
    color: #d94e1f;
}

/* RESPONSIVE STYLES */
@media (max-width: 1024px) {
    .services-grid-layout,
    .tech-roles-categories-grid,
    .hr-services-grid-container,
    .consultation-methodology-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    
    .process-visual-grid,
    .tech-hero-inner-container {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .advantages-display-grid,
    .hr-results-metrics-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    
    .stats-banner-wrap {
        grid-template-columns: repeat(2,1fr);
        gap: 30px;
    }
    
    .services-main-title,
    .tech-recruit-main-title,
    .hr-advisory-main-heading {
        font-size: 40px;
    }
    
    .process-section-heading,
    .tech-roles-section-title,
    .hr-services-section-title,
    .consultation-section-heading,
    .hr-results-heading {
        font-size: 36px;
    }
}

@media (max-width: 768px) {
    .services-hero-area,
    .tech-recruit-hero-section,
    .hr-advisory-hero-area {
        padding: 60px 0;
    }
    
    .core-services-display,
    .why-choose-us-area,
    .tech-roles-we-fill-area,
    .recruitment-process-overview,
    .hr-services-breakdown-area,
    .hr-consultation-approach-section,
    .hr-results-showcase-area,
    .hr-consultation-cta-area {
        padding: 70px 0;
    }
    
    .quick-stats-banner {
        padding: 40px 0px;
    }
    
    .stats-banner-wrap {
        grid-template-columns: 1fr;
        gap: 25px;
    }
    
    .stat-number-display {
        font-size: 36px;
    }
    
    .service-main-card,
    .tech-role-category-item,
    .hr-service-item {
        padding: 32px;
    }
    
    .process-timeline-item {
        gap: 24px;
    }
    
    .timeline-number {
        width: 60px;
        height: 60px;
        font-size: 20px;
    }
    
    .step-indicator-num {
        width: 50px;
        height: 50px;
        font-size: 16px;
    }
}

@media (max-width: 640px) {
    .services-main-title,
    .tech-recruit-main-title,
    .hr-advisory-main-heading {
        font-size: 32px;
    }
    
    .process-section-heading,
    .tech-roles-section-title,
    .hr-services-section-title,
    .consultation-section-heading,
    .hr-results-heading {
        font-size: 28px;
    }
    
    .tech-hero-action-buttons,
    .hr-hero-buttons-container {
        flex-direction: column;
        align-items: stretch;
    }
    
    .btn-primary-tech,
    .btn-secondary-tech,
    .btn-primary-hr,
    .btn-secondary-hr {
        justify-content: center;
        width: 100%;
    }
    
    .timeline-details {
        flex-direction: column;
    }
    
    .role-category-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    
    .hr-cta-heading {
        font-size: 32px;
    }
}

.process_hero_area, .process-hero-area {
    background: linear-gradient(155deg, #fffcf2 0%, #f7f3ea 100%);
    padding: 90px 0 110px;
}

.processHeroContainer, .process-hero-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.process-hero-content-wrap, .process-hero-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 70px;
    align-items: center;
}

.heroTextSection, .hero-text-section {
    max-width: 600px;
}

.process_main_title, .process-main-title {
    font-size: 54px;
    color: #252422;
    margin-bottom: 28px;
    line-height: 1.1;
    font-weight: 700;
    font-family: 'Space Grotesk', sans-serif;
}

.process-hero-desc-text, .process-hero-desc {
    font-size: 20px;
    color: #403d39;
    line-height: 1.6;
    margin-bottom: 40px;
}

.processHeroStats, .process-hero-stats {
    display: flex;
    gap: 48px;
}

.hero_stat_item, .hero-stat-item {
    display: flex;
    flex-direction: column;
}

.heroStatNum, .hero-stat-num {
    font-size: 36px;
    font-weight: 700;
    color: #eb5e28;
    font-family: 'Space Grotesk', sans-serif;
    line-height: 1;
    margin-bottom: 8px;
}

.hero-stat-label-text, .hero-stat-label {
    font-size: 14px;
    color: #403d39;
    text-transform: lowercase;
}

.heroVisualArea, .hero-visual-area {
    position: relative;
}

.process_hero_img, .process-hero-img {
    width: 100%;
    height: auto;
    border-radius: 18px;
    box-shadow: 0 24px 64px rgba(37, 36, 34, 0.16);
}

.main_process_flow, .main-process-flow {
    padding: 120px 0;
    background: #fffcf2;
}

.processFlowWrap, .process-flow-wrap {
    max-width: 1400px;
    margin: 0 auto;
	padding: 0 3%;
}

.process_intro_text, .process-intro-text {
    text-align: center;
    margin-bottom: 80px;
    max-width: 720px;
   margin-left: auto;
   margin-right: auto;
}

.processSectionTitle, .process-section-title {
	font-size: 46px;
	color: #252422;
	margin-bottom: 20px;
	font-weight: 700;
}

.process-section-subtitle-text, .process-section-subtitle {
    font-size: 19px;
    color: #403d39;
    line-height: 1.65;
}

.processStepsList, .process-steps-list {
    max-width: 1000px;
    margin: 0 auto;
}

.process_step_item, .process-step-item {
    display: flex;
    gap: 36px;
    margin-bottom: 60px;
    position: relative;
}

.process_step_item:last-child, .process-step-item:last-child {
    margin-bottom: 0;
}

.stepVisualPart, .step-visual-part {
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	position: relative;
}

.step_number_wrap, .step-number-wrap {
    width: 80px;
    height: 80px;
    background: #eb5e28;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 2;
}

.stepDigit, .step-digit {
	font-size: 28px;
	font-weight: 700;
	color: #fffcf2;
	font-family: 'Space Grotesk', sans-serif;
}

.step-connector-line-wrap, .step-connector-line {
    width: 3px;
    height: 120px;
    background: linear-gradient(to bottom, #eb5e28, rgba(235, 94, 40, 0.3));
    margin-top: 20px;
}

.process_step_item:last-child .step-connector-line-wrap, 
.process-step-item:last-child .step-connector-line {
    display: none;
}

.stepContentPart, .step-content-part {
    flex: 1;
    padding-top: 12px;
}

.step_title, .step-title {
	font-size: 28px;
	color: #252422;
	margin-bottom: 16px;
	font-weight: 600;
}

.stepDescription, .step-description {
    font-size: 17px;
    color: #403d39;
    line-height: 1.7;
    margin-bottom: 24px;
}

.step_details_list, .step-details-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.detailItem, .detail-item {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 15px;
	color: #403d39;
}

.detailItem .material-icons, .detail-item .material-icons {
    font-size: 20px;
    color: #eb5e28;
}

.tools_tech_section, .tools-tech-section {
    padding: 100px 0;
    background: linear-gradient(180deg, #f5f1e8 0%, #fffcf2 100%);
}

.toolsSectionContainer, .tools-section-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.tools-content-grid-main, .tools-content-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

.toolsTextArea, .tools-text-area {
	max-width: 560px;
}

.tools_heading, .tools-heading {
    font-size: 40px;
    color: #252422;
    margin-bottom: 24px;
    font-weight: 700;
}

.tools-description-text, .tools-description {
    font-size: 18px;
    color: #403d39;
    line-height: 1.7;
    margin-bottom: 48px;
}

.toolsListContainer, .tools-list-container {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.tool_category, .tool-category {
}

.categoryName, .category-name {
	font-size: 16px;
	color: #252422;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin-bottom: 16px;
}

.tools-in-category-wrap, .tools-in-category {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.toolName, .tool-name {
    padding: 8px 16px;
    background: rgba(235, 94, 40, 0.08);
    color: #eb5e28;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
}

.tools_visual_area, .tools-visual-area {
    position: relative;
}

.toolsImage, .tools-image {
	width: 100%;
	height: auto;
	border-radius: 16px;
	box-shadow: 0 20px 56px rgba(37, 36, 34, 0.15);
}

.timeline-expectations {
    padding: 120px 0;
    background: #fffcf2;
}

.timeline-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.timeline-header-section {
    text-align: center;
    margin-bottom: 70px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.timeline-title {
    font-size: 44px;
    color: #252422;
    margin-bottom: 18px;
    font-weight: 700;
}

.timeline-subtitle {
    font-size: 19px;
    color: #403d39;
    line-height: 1.6;
}

.timeline-options-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}

.timeline-option {
    background: #fff;
    padding: 36px;
    border-radius: 20px;
    border: 1px solid rgba(204, 197, 185, 0.3);
    transition: all 0.3s ease;
    position: relative;
}

.timeline-option:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 36px rgba(37, 36, 34, 0.12);
}

.featured-option {
    border: 2px solid #eb5e28;
    transform: scale(1.05);
}

.featured-option::before {
    content: 'most popular';
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: #eb5e28;
    color: #fffcf2;
    padding: 6px 20px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.option-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
}

.option-icon {
    font-size: 32px;
    color: #eb5e28;
}

.option-title {
    font-size: 22px;
    color: #252422;
    font-weight: 600;
}

.timeline-duration {
    font-size: 36px;
    font-weight: 700;
    color: #eb5e28;
    font-family: 'Space Grotesk', sans-serif;
    margin-bottom: 20px;
}

.option-details p {
    font-size: 16px;
    color: #403d39;
    line-height: 1.7;
    margin-bottom: 24px;
}

.option-features {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.option-features span {
    font-size: 14px;
    color: #403d39;
}

.quality-guarantee-area {
    padding: 100px 0;
    background: linear-gradient(135deg, #252422 0%, #403d39 100%);
}

.guarantee-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.guarantee-content-section {
    max-width: 1000px;
    margin: 0 auto;
    text-align: center;
}

.guarantee-main-title {
    font-size: 48px;
    color: #fffcf2;
    margin-bottom: 24px;
    font-weight: 700;
}

.guarantee-intro-text {
    font-size: 20px;
    color: #ccc5b9;
    line-height: 1.7;
    margin-bottom: 60px;
}

.guarantee-points-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    margin-bottom: 60px;
}

.guarantee-point {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.point-icon-area {
    width: 80px;
    height: 80px;
    background: rgba(235, 94, 40, 0.15);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}

.point-icon-area .material-icons {
    font-size: 36px;
    color: #eb5e28;
}

.point-content {
    max-width: 280px;
}

.point-title {
    font-size: 20px;
    color: #fffcf2;
    margin-bottom: 12px;
    font-weight: 600;
}

.point-text {
    font-size: 16px;
    color: #ccc5b9;
    line-height: 1.7;
}

.guarantee-cta-section {
    border-top: 1px solid rgba(204, 197, 185, 0.2);
    padding-top: 50px;
}

.guarantee-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: #eb5e28;
    color: #fffcf2;
    padding: 18px 36px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 18px;
    transition: all 0.3s ease;
    margin-bottom: 16px;
}

.guarantee-cta-btn:hover {
    background: #d94e1f;
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(235, 94, 40, 0.4);
}

.guarantee-cta-btn .material-icons {
    font-size: 24px;
}

.cta-subtext {
    font-size: 15px;
    color: #ccc5b9;
}


.portfolio-hero-section {
    background: linear-gradient(145deg, #fffcf2 0%, #f5f1e8 100%);
    padding: 100px 0 120px;
}

.portfolio-hero-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.hero-content-area {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.portfolio-main-heading {
    font-size: 56px;
    color: #252422;
    margin-bottom: 28px;
    line-height: 1.1;
    font-weight: 700;
    font-family: 'Space Grotesk', sans-serif;
}

.portfolio-hero-text {
    font-size: 21px;
    color: #403d39;
    line-height: 1.65;
    margin-bottom: 50px;
}

.portfolio-quick-stats {
    display: flex;
    justify-content: center;
    gap: 60px;
    flex-wrap: wrap;
}

.quick-stat-box {
    display: flex;
    align-items: center;
    gap: 16px;
}

.stat-icon-area {
    width: 60px;
    height: 60px;
    background: rgba(235, 94, 40, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stat-icon-area .material-icons {
    font-size: 28px;
    color: #eb5e28;
}

.stat-text-area {
    display: flex;
    flex-direction: column;
}

.stat-number-display {
    font-size: 32px;
    font-weight: 700;
    font-family: 'Space Grotesk', sans-serif;
    line-height: 1;
}

.stat-label-display {
    font-size: 14px;
    color: #403d39;
    text-transform: lowercase;
}

.case-studies-main {
    padding: 120px 0;
    background: #fffcf2;
}

.case-studies-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.cases-intro-area {
    text-align: center;
    margin-bottom: 80px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.cases-section-title {
    font-size: 44px;
    color: #252422;
    margin-bottom: 20px;
    font-weight: 700;
}

.cases-intro-desc {
    font-size: 18px;
    color: #403d39;
    line-height: 1.7;
}

.case-studies-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}

.case-study-card {
    background: #fff;
    padding: 40px;
    border-radius: 20px;
    border: 1px solid rgba(204, 197, 185, 0.3);
    transition: all 0.3s ease;
}

.case-study-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 40px rgba(37, 36, 34, 0.15);
}

.featured-case {
    grid-column: 1 / -1;
    background: linear-gradient(135deg, #fff 0%, #fffcf2 100%);
    border: 2px solid #eb5e28;
}

.case-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 24px;
}

.case-meta {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.case-category {
    display: inline-block;
    padding: 6px 14px;
    background: rgba(235, 94, 40, 0.1);
    color: #eb5e28;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.case-location {
    font-size: 14px;
    color: #403d39;
}

.case-status {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    color: #28a745;
    font-weight: 500;
}

.case-status .material-icons {
    font-size: 18px;
}

.case-title {
    font-size: 26px;
    color: #252422;
    margin-bottom: 28px;
    font-weight: 600;
    line-height: 1.3;
}

.case-challenge, .case-solution, .case-results-section {
    margin-bottom: 28px;
}

.case-challenge:last-child, .case-solution:last-child, .case-results-section:last-child {
    margin-bottom: 0;
}

.challenge-heading, .solution-heading, .results-heading {
    font-size: 16px;
    color: #252422;
    font-weight: 600;
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.challenge-text, .solution-text {
    font-size: 15px;
    color: #403d39;
    line-height: 1.7;
}

.results-metrics {
    display: flex;
    gap: 32px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.metric-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.metric-number {
    font-size: 28px;
    font-weight: 700;
    color: #eb5e28;
    font-family: 'Space Grotesk', sans-serif;
    line-height: 1;
    margin-bottom: 4px;
}

.metric-label {
    font-size: 13px;
    color: #403d39;
    text-transform: lowercase;
}

.case-quote {
    background: rgba(235, 94, 40, 0.05);
    padding: 24px;
    border-radius: 12px;
    border-left: 4px solid #eb5e28;
}

.case-quote p {
    font-size: 16px;
    color: #403d39;
    line-height: 1.7;
    font-style: italic;
    margin-bottom: 12px;
}

.case-quote cite {
    font-size: 14px;
    color: #252422;
    font-weight: 600;
    font-style: normal;
}

.timeline-result {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    color: #403d39;
    font-weight: 500;
}

.timeline-result .material-icons {
    font-size: 20px;
    color: #eb5e28;
}

.results-grid-small {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 24px;
}

.small-metric {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.small-metric .number {
    font-size: 24px;
    font-weight: 700;
    color: #eb5e28;
    font-family: 'Space Grotesk', sans-serif;
    line-height: 1;
    margin-bottom: 4px;
}

.small-metric .label {
    font-size: 12px;
    color: #403d39;
    text-transform: lowercase;
}

.recovery-stats, .success-metrics {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 20px;
}

.recovery-item, .success-item {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    color: #403d39;
    font-weight: 500;
}

.recovery-item .material-icons, .success-item .material-icons {
    font-size: 20px;
    color: #eb5e28;
}

.game-results {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.game-metric {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.game-metric .number {
    font-size: 32px;
    font-weight: 700;
    color: #eb5e28;
    font-family: 'Space Grotesk', sans-serif;
}

.game-metric .label {
    font-size: 14px;
    color: #403d39;
}

.game-outcome {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 15px;
    color: #403d39;
    font-weight: 500;
}

.game-outcome .material-icons {
    font-size: 20px;
    color: #eb5e28;
}

.impact-numbers-section {
    padding: 120px 0;
    background: linear-gradient(180deg, #f5f1e8 0%, #fffcf2 100%);
}

.impact-numbers-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.numbers-intro {
    text-align: center;
    margin-bottom: 80px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.numbers-title {
    font-size: 46px;
    color: #252422;
    margin-bottom: 20px;
    font-weight: 700;
}

.numbers-description {
    font-size: 19px;
    color: #403d39;
    line-height: 1.7;
}

.impact-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-bottom: 80px;
}

.impact-stat-card {
    background: #fff;
    padding: 36px;
    border-radius: 20px;
    border: 1px solid rgba(204, 197, 185, 0.3);
    transition: all 0.3s ease;
    text-align: center;
}

.impact-stat-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 40px rgba(37, 36, 34, 0.12);
}

.stat-visual-part {
    margin-bottom: 24px;
}

.stat-icon-wrapper {
    width: 70px;
    height: 70px;
    background: rgba(235, 94, 40, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.stat-icon-wrapper .material-icons {
    font-size: 32px;
    color: #eb5e28;
}

.stat-main-number {
    font-size: 42px;
    font-weight: 700;
    color: #eb5e28;
    font-family: 'Space Grotesk', sans-serif;
    line-height: 1;
    margin-bottom: 4px;
}

.stat-unit {
    font-size: 14px;
    color: #403d39;
    text-transform: lowercase;
}

.stat-details {
}

.stat-heading {
    font-size: 18px;
    color: #252422;
    margin-bottom: 12px;
    font-weight: 600;
}

.stat-description {
    font-size: 15px;
    color: #403d39;
    line-height: 1.7;
}

.cta-section-portfolio {
    background: #252422;
    padding: 60px;
    border-radius: 20px;
}

.cta-content-area {
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
}

.cta-title {
    font-size: 36px;
    color: #fffcf2;
    margin-bottom: 16px;
    font-weight: 700;
}

.cta-text {
    font-size: 18px;
    color: #ccc5b9;
    line-height: 1.7;
    margin-bottom: 32px;
}

.cta-buttons-portfolio {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

.btn-primary-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #eb5e28;
    color: #fffcf2;
    padding: 16px 32px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
}

.btn-primary-cta:hover {
    background: #d94e1f;
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(235, 94, 40, 0.4);
}

.btn-primary-cta .material-icons {
    font-size: 20px;
}

.btn-secondary-cta {
    display: inline-block;
    padding: 16px 32px;
    border: 2px solid #ccc5b9;
    color: #ccc5b9;
    border-radius: 10px;
    font-weight: 600;
    font-size: 16px;
    transition: all 0.3s ease;
}

.btn-secondary-cta:hover {
    background: rgba(204, 197, 185, 0.1);
    color: #fffcf2;
    border-color: #fffcf2;
    transform: translateY(-3px);
}


@media (max-width: 1024px) {
    .process_hero_area, .process-hero-area, 
    .process-hero-content-wrap, .process-hero-content,
    .tools-content-grid-main, .tools-content-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }
    
    .process_main_title, .process-main-title, 
    .portfolio-main-heading-text, .portfolio-main-heading {
        font-size: 48px;
    }
    
    .timeline_options_grid, .timeline-options-grid, 
    .guarantee_points_grid, .guarantee-points-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    
    .featuredOption, .featured-option {
        transform: none;
    }
    
    .impactStatsGrid, .impact-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .case_studies_grid, .case-studies-grid {
        grid-template-columns: 1fr;
    }
    
    .portfolioQuickStats, .portfolio-quick-stats {
        gap: 40px;
    }
}

@media (max-width: 768px) {
    .process_hero_area, .process-hero-area, 
    .portfolioHeroSection, .portfolio-hero-section {
        padding: 70px 0 80px;
    }
    
    .main_process_flow, .main-process-flow, 
    .case_studies_main, .case-studies-main, 
    .impactNumbersSection, .impact-numbers-section {
        padding: 80px 0;
    }
    
    .tools_tech_section, .tools-tech-section, 
    .timeline_expectations, .timeline-expectations, 
    .qualityGuaranteeArea, .quality-guarantee-area {
        padding: 80px 0;
    }
    
    .process_main_title, .process-main-title, 
    .portfolio-main-heading-text, .portfolio-main-heading {
        font-size: 38px;
    }
    
    .processHeroStats, .process-hero-stats, 
    .portfolioQuickStats, .portfolio-quick-stats {
        flex-direction: column;
        gap: 24px;
        align-items: center;
    }
    
    .process_step_item, .process-step-item {
        gap: 24px;
    }
    
    .step_number_wrap, .step-number-wrap {
        width: 70px;
        height: 70px;
    }
    
    .stepDigit, .step-digit {
        font-size: 24px;
    }
    
    .resultsMetrics, .results-metrics {
        justify-content: center;
    }
    
    .impactStatsGrid, .impact-stats-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    
    .ctaButtonsPortfolio, .cta-buttons-portfolio {
        flex-direction: column;
        align-items: stretch;
    }
    
    .ctaSectionPortfolio, .cta-section-portfolio {
        padding: 40px 24px;
    }
}

@media (max-width: 640px) {
    .process_step_item, .process-step-item {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
    .step-connector-line-wrap, .step-connector-line {
        width: 120px;
        height: 3px;
        margin-top: 0;
        margin-left: 20px;
        background: linear-gradient(to right, #eb5e28, rgba(235, 94, 40, 0.3));
    }
    
    .stepVisualPart, .step-visual-part {
        flex-direction: row;
        width: 100%;
        justify-content: center;
    }
    
    .caseStudyCard, .case-study-card {
        padding: 28px;
    }
    
    .case_title, .case-title {
        font-size: 22px;
    }
    
    .resultsMetrics, .results-metrics {
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }
    
    .quickStatBox, .quick-stat-box {
        flex-direction: column;
        text-align: center;
        gap: 12px;
    }
}

.blog-hero-sect {
    background: linear-gradient(135deg,#fffcf2 0%,#f5f1e8 100%);
    padding: 90px 0 70px;
}

.blog-hero-wrap {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.blog-hero-content {
    text-align: center;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.blog-main-title {
    font-size: 56px;
    color: #252422;
    margin-bottom: 20px;
    font-weight: 700;
    line-height: 1.1;
}

.blog-hero-subtitle {
    font-size: 20px;
    color: #403d39;
    line-height: 1.6;
}

@media (max-width: 768px) {
    .blog-hero-sect {
        padding: 60px 0 50px;
    }
    
    .blog-main-title {
        font-size: 38px;
    }
    
    .blog-hero-subtitle {
        font-size: 18px;
    }
}

.blog-listing-area {
    padding: 80px 0 100px;
    background: #fffcf2;
}

.blog-list-container {
    max-width: 1400px;
    margin: 0px auto;
    padding: 0 3%;
}

.articles-grid {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 36px;
}

.article-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.3s ease;
    border: 1px solid rgba(204,197,185,0.3);
    display: flex;
    flex-direction: column;
}

.article-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 32px rgba(37,36,34,0.12);
}

.featured-article {
    grid-column: 1 / -1;
    flex-direction: row;
}

.article-visual {
    position: relative;
    overflow: hidden;
}

.featured-article .article-visual {
    width: 50%;
    flex-shrink: 0;
}

.article-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    min-height: 280px;
}

.featured-article .article-img {
    min-height: 400px;
}

.article-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    background: #eb5e28;
    color: #fffcf2;
    padding: 8px 18px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.article-content-box {
    padding: 32px;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.featured-article .article-content-box {
    padding: 40px;
    justify-content: center;
}

.article-meta-row {
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
    align-items: center;
}

.article-category {
    display: inline-block;
    padding: 6px 12px;
    background: rgba(235,94,40,0.1);
    color: #eb5e28;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
}

.article-date {
    font-size: 14px;
    color: #403d39;
}

.article-title-link a {
    color: #252422;
    transition: color 0.3s ease;
    display: block;
}

.article-title-link a:hover {
    color: #eb5e28;
}

.article-title-link {
    font-size: 26px;
    margin-bottom: 14px;
    font-weight: 600;
    line-height: 1.3;
}

.featured-article .article-title-link {
    font-size: 32px;
    margin-bottom: 18px;
}

.article-excerpt {
    font-size: 16px;
    color: #403d39;
    line-height: 1.7;
    margin-bottom: 24px;
    flex: 1;
}

.article-read-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #eb5e28;
    font-weight: 600;
    font-size: 15px;
    transition: all .3s ease;
}

.article-read-link:hover {
    gap: 12px;
}

.article-read-link .material-icons {
    font-size: 18px;
}

@media (max-width: 1024px) {
    .articles-grid {
        grid-template-columns: 1fr;
    }
    
    .featured-article {
        flex-direction: column;
    }
    
    .featured-article .article-visual {
        width: 100%;
    }
    
    .featured-article .article-img {
        min-height: 300px;
    }
}

@media (max-width: 640px) {
    .blog-listing-area {
        padding: 60px 0 70px;
    }
    
    .articles-grid {
        gap: 24px;
    }
    
    .article-content-box,
    .featured-article .article-content-box {
        padding: 24px;
    }
}

.blog-cta-section {
    padding: 100px 0;
    background: linear-gradient(135deg,#252422 0%,#403d39 100%);
}

.blog-cta-wrap {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.cta-content-block {
    text-align: center;
    max-width: 700px;
    margin: 0 auto;
}

.cta-heading {
    font-size: 42px;
    color: #fffcf2;
    margin-bottom: 18px;
    font-weight: 700;
}

.cta-text {
    font-size: 18px;
    color: #ccc5b9;
    line-height: 1.7;
    margin-bottom: 36px;
}

.cta-buttons {
    display: flex;
    gap: 18px;
    justify-content: center;
    flex-wrap: wrap;
}

@media (max-width: 768px) {
    .blog-cta-section {
        padding: 70px 0;
    }
    
    .cta-heading {
        font-size: 32px;
    }
    
    .cta-buttons {
        flex-direction: column;
        align-items: stretch;
    }
}

.placeholder-section {
    padding: 120px 0;
    background: linear-gradient(180deg,#fffcf2 0%,#f5f1e8 100%);
    min-height: calc(100vh - 85px);
    display: flex;
    align-items: center;
}

.placeholder-container {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 3%;
}

.placeholder-content {
    text-align: center;
    background: #fff;
    padding: 60px 50px;
    border-radius: 20px;
    box-shadow: 0 16px 48px rgba(37,36,34,.1);
}

.placeholder-icon {
    font-size: 72px;
    color: #eb5e28;
    margin-bottom: 24px;
}

.placeholder-title {
    font-size: 46px;
    color: #252422;
    margin-bottom: 32px;
    font-weight: 700;
}

.placeholder-text {
    margin-bottom: 40px;
}

.placeholder-text p {
    font-size: 18px;
    color: #403d39;
    line-height: 1.75;
    margin-bottom: 20px;
}

.placeholder-text p:last-child {
    margin-bottom: 0;
}

.placeholder-actions {
    display: flex;
    gap: 18px;
    justify-content: center;
    flex-wrap: wrap;
}

@media (max-width: 768px) {
    .placeholder-section {
        padding: 80px 0;
    }
    
    .placeholder-content {
        padding: 40px 30px;
    }
    
    .placeholder-icon {
        font-size: 56px;
    }
    
    .placeholder-title {
        font-size: 34px;
        margin-bottom: 24px;
    }
    
    .placeholder-text p {
        font-size: 17px;
    }
    
    .placeholder-actions {
        flex-direction: column;
        align-items: stretch;
    }
}

.article-page {
    background: #fffcf2;
}

.article-header-section {
    background: linear-gradient(180deg,#f5f1e8 0%,#fffcf2 100%);
    padding: 90px 0 50px;
}

.article-header-container {
    max-width: 900px;
    margin: 0 auto;
    padding: 0 3%;
    text-align: center;
}

.article-meta-info {
    display: flex;
    gap: 18px;
    justify-content: center;
    align-items: center;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.article-category-tag {
    display: inline-block;
    padding: 8px 16px;
    background: rgba(235,94,40,.1);
    color: #eb5e28;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    text-transform: lowercase;
}

.article-publish-date {
    font-size: 15px;
    color: #403d39;
}

.article-main-heading {
    font-size: 52px;
    color: #252422;
    margin-bottom: 20px;
    font-weight: 700;
    line-height: 1.15;
}

.article-lead-text {
    font-size: 20px;
    color: #403d39;
    line-height: 1.65;
}

@media (max-width: 768px) {
    .article-header-section {
        padding: 60px 0 40px;
    }
    
    .article-main-heading {
        font-size: 36px;
    }
    
    .article-lead-text {
        font-size: 18px;
    }
}

.article-featured-image {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 3%;
    margin-bottom: 60px;
}

.article-featured-image img {
    width: 100%;
    height: auto;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(37,36,34,.15);
    display: block;
}

@media (max-width: 768px) {
    .article-featured-image {
        margin-bottom: 50px;
    }
}

.article-body-section {
    padding: 0 0 100px;
}

.article-body-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 3%;
}

.article-content-text {
    margin-bottom: 60px;
}

.article-content-text p {
    font-size: 18px;
    color: #252422;
    line-height: 1.8;
    margin-bottom: 24px;
}

.article-content-text p:last-child {
    margin-bottom: 0;
}

.article-footer-section {
    padding-top: 48px;
    border-top: 2px solid rgba(204,197,185,.3);
}

.article-tags-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 32px;
}

.tag-item {
    padding: 8px 16px;
    background: rgba(235,94,40,.08);
    color: #403d39;
    border-radius: 8px;
    font-size: 14px;
}

.article-nav-links {
    display: flex;
    justify-content: center;
}

.back-to-blog-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #eb5e28;
    font-weight: 600;
    font-size: 16px;
    transition: all .3s ease;
    padding: 12px 24px;
    border-radius: 10px;
    border: 2px solid #eb5e28;
}

.back-to-blog-link:hover {
    background: #eb5e28;
    color: #fffcf2;
    transform: translateY(-2px);
}

.back-to-blog-link .material-icons {
    font-size: 20px;
}

@media (max-width: 768px) {
    .article-body-section {
        padding: 0 0 70px;
    }
    
    .article-content-text {
        margin-bottom: 50px;
    }
    
    .article-content-text p {
        font-size: 17px;
        margin-bottom: 20px;
    }
    
    .article-footer-section {
        padding-top: 36px;
    }
}

.thankyou-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #fffcf2 0%, #f5f1e8 100%);
    padding: 40px 3%;
}

.thankyou-container {
    max-width: 580px;
    width: 100%;
    text-align: center;
    background: #fff;
    padding: 60px 48px;
    border-radius: 20px;
    box-shadow: 0 12px 48px rgba(37, 36, 34, 0.12);
}

.thankyou-icon-wrap {
    width: 88px;
    height: 88px;
    background: rgba(235, 94, 40, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 32px;
}

.thankyou-icon-wrap .material-icons {
    font-size: 48px;
    color: #eb5e28;
}

.thankyou-heading {
    font-size: 36px;
    color: #252422;
    margin-bottom: 20px;
    font-weight: 700;
}

.thankyou-text {
    font-size: 18px;
    color: #403d39;
    line-height: 1.7;
    margin-bottom: 16px;
}

.thankyou-subtext {
    font-size: 16px;
    color: #403d39;
    line-height: 1.6;
    margin-bottom: 40px;
    opacity: 0.8;
}

.thankyou-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 36px;
    background: #eb5e28;
    color: #fffcf2;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 600;
    transition: all 0.3s ease;
    text-decoration: none;
}

.thankyou-btn:hover {
    background: #d94e1f;
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(235, 94, 40, 0.4);
}

.thankyou-btn .material-icons {
    font-size: 20px;
}

@media (max-width: 640px) {
    .thankyou-container {
        padding: 48px 32px;
    }
    
    .thankyou-heading {
        font-size: 30px;
    }
    
    .thankyou-text {
        font-size: 17px;
    }
    
    .thankyou-subtext {
        font-size: 15px;
    }
}

.legal-page-wrapper {
    padding: 100px 0;
    background: #fffcf2;
}

.legal-content {
    max-width: 820px;
    margin: 0 auto;
    padding: 0 3%;
}

.legal-title {
    font-size: 48px;
    color: #252422;
    margin-bottom: 12px;
    font-weight: 700;
    line-height: 1.2;
}

.legal-updated {
    font-size: 15px;
    color: #403d39;
    margin-bottom: 48px;
    opacity: 0.7;
}

.legal-section {
    margin-bottom: 40px;
}

.legal-heading {
    font-size: 26px;
    color: #252422;
    margin-bottom: 16px;
    font-weight: 600;
}

.legal-text {
    font-size: 16.5px;
    color: #403d39;
    line-height: 1.8;
    margin-bottom: 16px;
}

.legal-text:last-child {
    margin-bottom: 0;
}

.legal-text a {
    color: #eb5e28;
    font-weight: 500;
    transition: color 0.3s ease;
}

.legal-text a:hover {
    color: #d94e1f;
    text-decoration: underline;
}

.legal-text strong {
    font-weight: 600;
    color: #252422;
}

.legal-footer-nav {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 60px;
    padding-top: 32px;
    border-top: 1px solid rgba(204, 197, 185, 0.3);
    flex-wrap: wrap;
}

.legal-nav-link {
    color: #403d39;
    font-size: 15px;
    font-weight: 500;
    transition: color 0.3s ease;
}

.legal-nav-link:hover {
    color: #eb5e28;
}

.legal-nav-separator {
    color: #ccc5b9;
    font-size: 14px;
}

@media (max-width: 768px) {
    .legal-page-wrapper {
        padding: 70px 0;
    }
    
    .legal-title {
        font-size: 36px;
    }
    
    .legal-heading {
        font-size: 22px;
    }
    
    .legal-text {
        font-size: 16px;
    }
    
    .legal-footer-nav {
        margin-top: 48px;
        padding-top: 24px;
    }
}

.contact-hero-section {
    background: linear-gradient(135deg, #252422 0%, #403d39 100%);
    padding: 120px 0 80px;
}

.contact-hero-wrap {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 3%;
}

.contact-hero-content {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.contact-main-title {
    font-size: 48px;
    color: #fffcf2;
    margin-bottom: 24px;
    font-weight: 700;
    line-height: 1.2;
}

.contact-hero-desc {
    font-size: 19px;
    color: #ccc5b9;
    line-height: 1.65;
}

.contact-form-area {
    padding: 100px 0;
    background: #fffcf2;
}

.contact-layout-grid {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0px 3%;
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 60px;
    align-items: start;
}

.form-wrapper {
    background: #fff;
    padding: 48px;
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(37, 36, 34, 0.1);
}

.form-title {
    font-size: 32px;
    color: #252422;
    margin-bottom: 32px;
    font-weight: 700;
}

.contact-form {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.input-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.input-label {
    font-size: 14px;
    color: #403d39;
    font-weight: 500;
    text-transform: lowercase;
}

.form-input,
.form-select,
.form-textarea {
    padding: 14px 16px;
    border: 2px solid rgba(204, 197, 185, 0.4);
    border-radius: 8px;
    font-size: 15px;
    font-family: 'Inter', sans-serif;
    color: #252422;
    background: #fffcf2;
    transition: all 0.3s ease;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
    outline: none;
    border-color: #eb5e28;
    background: #fff;
}

.form-textarea {
    resize: vertical;
    min-height: 120px;
}

.form-select {
    cursor: pointer;
}

.form-submit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 36px;
    background: #eb5e28;
    color: #fffcf2;
    border: none;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 8px;
}

.form-submit-btn:hover {
    background: #d94e1f;
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(235, 94, 40, 0.4);
}

.form-submit-btn .material-icons {
    font-size: 20px;
}

.contact-info-blocks {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.info-block {
    background: #fff;
    padding: 32px;
    border-radius: 12px;
    display: flex;
    gap: 20px;
    border: 1px solid rgba(204, 197, 185, 0.3);
    transition: all 0.3s ease;
}

.info-block:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(37, 36, 34, 0.1);
}

.info-icon-wrapper {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    background: rgba(235, 94, 40, 0.1);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.info-icon-wrapper .material-icons {
    font-size: 28px;
    color: #eb5e28;
}

.info-content {
    flex: 1;
}

.info-heading {
    font-size: 18px;
    color: #252422;
    margin-bottom: 8px;
    font-weight: 600;
}

.info-text {
    font-size: 15px;
    color: #403d39;
    line-height: 1.7;
}

.info-text a {
    color: #eb5e28;
    font-weight: 500;
    transition: color 0.3s ease;
}

.info-text a:hover {
    color: #d94e1f;
}

.info-note {
    font-size: 13px;
    color: #403d39;
    margin-top: 6px;
    opacity: .7;
}

@media (max-width: 1024px) {
    .contact-layout-grid {
        grid-template-columns: 1fr;
        gap: 48px;
    }
}

@media (max-width: 768px) {
    .contact-hero-section {
        padding: 100px 0 60px;
    }
    
    .contact-main-title {
        font-size: 36px;
    }
    
    .contact-hero-desc {
        font-size: 17px;
    }
    
    .contact-form-area {
        padding: 70px 0;
    }
    
    .form-wrapper {
        padding: 32px 24px;
    }
    
    .form-title {
        font-size: 28px;
        margin-bottom: 28px;
    }
    
    .form-row {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

@media (max-width: 480px) {
    .info-block {
        flex-direction: column;
        padding: 24px;
    }
}