/* Berlin: readable surfaces, keeping the original purple/lime identity. */
:root { --berlin-ink: #26272c; --berlin-green: #466b0b; --berlin-purple: #6512cc; }
.text-green, .main-title h5, .heading-area .sub-heading,
#testimonials .text1 .info { color: var(--berlin-green); }
.buton { color: var(--berlin-purple); }
.buton i { border-color: currentColor; }
a:focus-visible, button:focus-visible { outline: 3px solid #466b0b; outline-offset: 5px; }
.navbar a:focus-visible { outline-color: #fff; }

/* Keep the complete headline on its lime surface, including at intermediate widths. */
.banner-overlay {
    left: auto; top: auto; transform: none; margin: 150px 0 0 auto;
    width: min(720px, 100%); height: auto; background: #aad723;
}
.banner-area { top: auto; transform: none; padding: 42px; }
.banner-sec .banner-heading {
    transform: none; width: auto; font-size: clamp(32px, 4.1vw, 62px); line-height: 1.12;
    margin: 16px 0 24px; overflow-wrap: break-word;
}
.banner-des { width: auto; line-height: 1.65; }
.about-sec { padding-top: 120px; }

/* Local light scrims protect copy without dimming the architecture. */
.banner-sec .about-media { background: rgba(255,255,255,.95); padding: 40px 22px; }
.banner-sec .about-media :is(.small-heading,.small-heading1,.small-text,.small-text1),
.banner-sec .about-media :is(.about-icon,.about-icon1) i { color: var(--berlin-ink); }
.banner-sec .about-media :is(.small-text,.small-text1) { font-weight: 400; }
.banner-sec .about-media.active { background: var(--berlin-purple); }
.banner-sec .about-media.active :is(.small-heading,.small-heading1,.small-text,.small-text1),
.banner-sec .about-media.active :is(.about-icon,.about-icon1) i { color: #fff; }
.feature-are {
    padding: 36px; background: linear-gradient(110deg, #fff 0%, rgba(255,255,255,.96) 75%, rgba(255,255,255,.88) 100%);
}
.feature-heading, .feature-text { color: var(--berlin-ink); }
.feature-text { text-align: left; line-height: 1.75; }
.feature-image { padding: 40px 0 0 40px; }
.feature-image img { width: 100%; }
.counter-overlay { height: auto; min-height: 300px; }
.counter-area { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); padding: 30px; gap: 28px; }
.banner-sec .counter { margin: 0; text-align: left; }
.banner-sec .counter h5 { font-variant-numeric: tabular-nums; }
.banner-sec .counter p { font-size: 16px; }

/* Lime is an accent/background, never a light text colour on white. */
.team-classic .item:hover .team-classic-content h5 { color: var(--berlin-green); }
.team-classic .team-overlay:before { background-color: rgba(42,20,66,.78); }
.side-nav .navbar-nav .nav-link, .side-menu p, .side-menu .social-icons-simple a { color: var(--berlin-ink); }
.side-menu p.text-white { color: var(--berlin-ink) !important; }
.side-menu .btn-close::before, .side-menu .btn-close::after,
.side-nav .navbar-nav .nav-link::after { background: var(--berlin-ink); }
.owl-testimonial .owl-item.center .testimonial-box .infot_margin { color: var(--berlin-ink); }
.quote_box .quote { color: var(--berlin-purple); }
.owl-testimonial .center .quote_box .quote { color: #fff; }
.team-sec .owl-dots .owl-dot { border: 1px solid #767676; }
.team-sec .owl-dots .owl-dot.active { background: var(--berlin-green) !important; }
.owl-testimonial .owl-dots .owl-dot.active span,
.owl-testimonial .owl-dots .owl-dot:hover span { background: var(--berlin-green); border-color: var(--berlin-green); }

/* A directional light overlay covers the journal heading, letting the photo show below. */
.blog-section.blog-image {
    background-image: linear-gradient(to bottom, rgba(255,255,255,.95) 0%, rgba(255,255,255,.92) 40%, rgba(255,255,255,.1) 76%), url('../images/blog.jpg');
}
.blog-area .subheading, .blog-area .blog-heading { color: var(--berlin-ink); }
.blog-section .cards-section .active :is(.card-title,p),
.blog-section .active .buttton, .blog-section .active .buttton i { color: var(--berlin-ink); }
.blog-section .active .buttton i { border-color: currentColor; }
.blog-section .buttton:hover i { color: #fff; }
.btn.green-btn { color: var(--berlin-ink); font-weight: 600; }
.btn.green-btn:hover, .btn.green-btn:focus-visible { color: #fff; background: var(--berlin-purple); border-color: var(--berlin-purple); }
.contact-section .contact-form .form-control { border-bottom-color: #8b8b8b; }
.contact-section .contact-form .form-control:focus { border-bottom-color: var(--berlin-purple); color: var(--berlin-ink); }
.contact-section .copyright-section .media-body p { color: #595959; }
.conen-static-map { position: relative; background: #f2f0e9; }
.conen-static-map img { width: 100%; height: 100%; object-fit: cover; display: block; }
.conen-map-caption {
    position: absolute; bottom: 20px; left: 20px; right: 20px; padding: 16px 20px;
    background: #fff; color: var(--berlin-ink); font: 400 15px/1.6 'Roboto',sans-serif;
    box-shadow: 0 4px 20px #26272c14;
}
.conen-map-caption strong { display: block; color: var(--berlin-purple); }
.conen-map-caption small { display: block; color: #595959; }
.portfolio-overlay { height: auto; min-height: 330px; }
.project-sec :is(.project-links-left,.project-links-right) a { display: block; background: #fff; border-radius: 50%; }
.project-sec :is(.project-links-left,.project-links-right) a i { color: var(--berlin-purple); }

@media (max-width: 991px) {
    .banner-overlay { margin-top: 150px; }
    .feature-image { padding: 32px 0 0; }
    .counter-overlay { position: relative; inset: auto; transform: none; margin: 0 auto; width: min(515px,100%); }
    .portfolio-overlay { min-height: 260px; }
}
@media (max-width: 767px) {
    .banner-sec.banner-image { background-size: auto 620px; background-position: center top; }
    .banner-overlay { margin-top: 220px; width: 100%; }
    .banner-area { padding: 28px 22px; }
    .banner-sec .banner-heading { font-size: 29px; }
    .banner-des { font-size: 16px; }
    .about-sec { padding-top: 64px; }
    .banner-sec .about-media { margin-top: 0; padding: 36px 24px; }
    .feature-are { padding: 12px 8px 24px; }
    .feature-text { text-align: center; }
    .counter-area { padding: 28px 22px; gap: 24px 14px; }
    .banner-sec .counter h5 { font-size: 34px; }
    .banner-sec .counter p { font-size: 14px; }
    .portfolio-overlay { position: relative; top: auto; left: auto; width: calc(100% - 40px); margin: -32px auto 0; min-height: 0; padding: 1px 0; }
    .portfolio-area { margin: 28px 20px; }
    .port-heading { font-size: 25px; }
    .our-clients { padding-top: 70px; }
    .blog-section.blog-image { background-size: auto 500px; background-position: center top; background-color: #f4f2f6; }
    .contact-section .copyright-section .media-body p { font-size: 14px; }
}