:root {
    --color-primary: #004157;
    --color-background: #F8F7F3;
    --color-secondary-background: #EEF2F2;
    --color-text: #252A2B;
    --color-muted-text: #687377;
    --color-light-teal: #D9E5E7;
    --color-warm-accent: #B49A78;
    --color-white: #FFFFFF;
    --bg-gradient: linear-gradient( 180deg, var(--color-primary) 0%, var(--color-primary) 58%, #F8F7F3 58%, #F8F7F3 100% );
}
@media (min-width: 1025px) {

/*Navbar*/
.custom-navbar .dropdown-group { padding: 8px; }
    .custom-navbar .dropdown-sublist { padding-left: 16px; }
    .custom-navbar {
        flex-wrap: nowrap;
        justify-content: flex-start;
    }

        .custom-navbar .container-fluid {
            flex-wrap: nowrap;
        }

        .custom-navbar .navbar-toggler {
            display: none;
        }

        .custom-navbar .navbar-collapse {
            display: flex !important;
            flex-basis: auto;
            background: transparent;
        }

        .custom-navbar .navbar-nav {
            flex-direction: row;
        }

            .custom-navbar .navbar-nav .dropdown-menu {
                position: absolute;
            }
}

/* ===== Tablet / Mobile: 1024px and below ===== */
@media (max-width: 1024px) {
    .nav-item.dropdown:has(#practiceDropdown) {
        display: block !important;
        width: 100%;
    }

    /* Title row: label on the left, arrow pushed to the far right, like "Insights" */
    #practiceDropdown {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
        width: 100%;
    }

        /* Rotate the arrow when open */
        #practiceDropdown[aria-expanded="true"] .dropdown-icon {
            transform: rotate(180deg);
        }

        #practiceDropdown .dropdown-icon {
            transition: transform .2s ease;
        }

        /* Menu: in the normal flow, no floating box */
        #practiceDropdown + .dropdown-menu {
            position: static !important;
            transform: none !important;
            float: none;
            width: 100%;
            margin: 0 !important;
            padding: 0 0 0 1rem; /* indent like Insights children */
            background: transparent;
            border: 0 !important;
            box-shadow: none !important;
            border-radius: 0 !important;
        }

          

            /* Trademark Services header: same style as the other items */
            #practiceDropdown + .dropdown-menu .dropdown-group {
                padding: 0 !important;
            }

            #practiceDropdown + .dropdown-menu .dropdown-li-header {
                font-weight: 400 !important;
                text-transform: none !important;
                letter-spacing: normal !important;
                padding-left: 0 !important;
            }

            /* Trademark sub-items: one more indent level */
            #practiceDropdown + .dropdown-menu .dropdown-sublist {
                padding-left: 1rem !important;
            }


   
  
    .custom-navbar .navbar-toggler {
        display: block;
        background-color: var(--color-background);
        border-radius: 8px;
        padding: 10px 12px;
    }

    .custom-navbar .navbar-collapse {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        width: 100%;
        margin: 0;
        padding: 8px 24px 20px;
        background-color: var(--color-background); /* same color as the header */
        border: 0;
        border-top: 1px solid var(--nav-border);
        border-radius: 0;
        box-shadow: 0 12px 24px rgba(0, 0, 0, .08);
        max-height: calc(100vh - 90px); /* scrolls if the menu is taller than the screen */
        overflow-y: auto;
        z-index: 1000;
    }
    .brand-logo {
        width: 100%;
        height: 60px;
        object-fit: cover;
    }

  
    .custom-navbar .navbar-nav {
        margin: 0 !important;
        align-items: flex-start !important;
        text-align: left;
        gap: 0 !important;
        width: 100%;
    }

    .custom-navbar .nav-item {
        width: 100%;
        border-bottom: 1px solid #B49A7866;
    }

        .custom-navbar .nav-item:last-child {
            border-bottom: 0;
        }

    .custom-navbar .custom-nav-link {
        display: flex;
        align-items: center;
        justify-content: space-between; 
        width: 100%;
        padding: 12px 4px;
        text-align: left;
    }

    
    .custom-navbar .dropdown-menu {
        position: static;
        float: none;
        width: 100%;
        margin: 0 0 8px !important;
        background: transparent;
        box-shadow: none !important;
        padding: 0 0 0 12px;
    }

    .custom-navbar .dropdown-item {
        white-space: normal; 
        text-align: left;
        padding-left: 4px;
    }

    .custom-navbar .dropdown-sublist {
        padding-left: 12px !important;
    }

   
    .custom-navbar .dropdown-icon {
        transition: transform .2s ease;
    }

    .custom-navbar .show > .nav-link .dropdown-icon,
    .custom-navbar .nav-link[aria-expanded="true"] .dropdown-icon {
        transform: rotate(180deg);
    }

    /* CTA button full width, left aligned */
    .custom-navbar .navbar-collapse > .d-flex {
        margin-top: 16px !important;
        justify-content: flex-start;
    }

    .custom-navbar .navbar-collapse .btn {
        width: 100%;
        justify-content: center;
    }

    .marquee-content {
        font-size: 3vw;
        letter-spacing: 0.08em;
        padding: 1.25rem 0 1rem;
    }
    .law-about-title {
       
        font-size: 35px;
        line-height: 1.12;
        letter-spacing: -0.01em;
        
    }
    .law-contact {
        width: calc(100% - 60px);
        min-height: 280px;
        margin-top: 105px;
        border-radius: 24px;
    }
    .memberships-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .feature-hero-container {
        display: flex;
        flex-direction: column;
        height: auto;
        min-height: 0;
        max-height: none;
        margin-top: 80px;
    }

    .feature-hero-image {
        position: relative;
        order: 1;
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 10;
        max-height: 560px;
    }

        .feature-hero-image img {
            object-position: center 20%;
        }



    .feature-hero-content {
        order: 2;
        height: auto;
        padding: 10px 48px 60px;
    }

    .feature-hero-heading {
        font-size: clamp(2.8rem, 8vw, 4.6rem);
        line-height: 1;
        margin-bottom: 28px;
    }

    .feature-hero-line {
        white-space: normal;
    }

    .feature-hero-description {
        max-width: 560px;
        margin-left: 0;
        font-size: 1rem;
    }
  

}

@media (max-width: 992px) {

    .hero-section {
        min-height: auto;
        padding: 90px 20px;
    }

    .hero-title {
        max-width: 850px;
    }

    .hero-description {
        max-width: 680px;
    }
    .feature-hero-section {
        padding: 28px 18px;
    }

   
    .feature-publication-image-link {
        height: 240px;
    }

    .feature-publication-content {
        padding: 16px;
    }



    .feature-publication-meta {
        font-size: 13px;
        gap: 8px;
        padding-top: 25px;
    }
    .awards-wrapper {
        justify-content: center;
    }
    .values {
        border-left: 0;
        padding-left: 0;
    }
    .main-title {
        font-size: 2.2rem;
    }
}


@media (max-width: 768px) {

    .hero-section {
        padding: 70px 20px;
    }

    .hero-label {
        font-size: 0.7rem;
        letter-spacing: 0.16rem;
        line-height: 1.8;
    }

    .hero-title {
        font-size: 3rem;
        line-height: 1;
    }

    .hero-description {
        font-size: 1rem;
        line-height: 1.6;
    }
  

    .experience-text {
        max-width: 650px;
        margin: 0 auto;
        text-align:center;
    }
        .experience-text .exp-br {
            display: none;
        }

    .practice-marquee {
        padding: 30px 0 0;
    }

  
    .law-about-title {
        font-size: 30px;
        line-height: 1.12;
        letter-spacing: -0.01em;
    }
    .story-heading {
        font-size: 28px;
    }
    .nh-foundation-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
        align-items: center;
        max-width: 1200px;
        margin: 0 auto;
        padding: 40px 20px;
    }
    .law-contact h1 {
        font-size: 28px;
    }
    .law-contact {
        width: calc(100% - 40px);
        min-height: 240px;
        margin-top: 105px;
        padding: 36px 24px;
        border-radius: 20px;
    }

    .team-grid {
        display: flex !important;
        flex-direction: column !important;
    }

   
 
        .comparison-table-wrapper {
            margin: 20px auto;
            padding: 0 5px;
        }

        .comparison-table {
            table-layout: auto; /* Allows columns to shrink naturally */
        }

            .comparison-table th {
                font-size: 0.8rem;
                padding: 10px 8px;
                line-height: 1.2;
            }

            .comparison-table td {
                font-size: 0.75rem;
                padding: 10px 8px;
                line-height: 1.35;
            }
 
    .blog-heading, .verus-heading, .heading-underline {
        font-size: 25px;
    }

    .blog-subheading {
        font-size: 22px;
    }
    .team-grid {
        grid-template-columns: 1fr;
    }

    .team-image-block, .team-placeholder-block {
        min-height: 320px;
    }

    /* Force visual image-then-text order on mobile */
    .team-card-2 .team-info-block {
        order: 2;
    }

    .team-card-2 .team-image-block {
        order: 1;
    }
    .purpose-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .purpose-card {
        padding: 32px 24px;
    }
    .story-grid {
        grid-template-columns: 1fr;
        gap: 5px;
    }
    .team-image-block {
        width: 100%;
        height: 100%;
        max-height: 520px;
    }

        .team-image-block img {
            width: 100%;
            height: 520px;
            object-fit: cover;
            object-position: center 25%; /* Anchors the top of the image so heads are not cropped */
            display: block;
        }

    .team-grid {
        display: flex !important;
        flex-direction: column !important;
    }

        /* Member 1: image, info */
        .team-grid > :nth-child(1) {
            order: 1;
        }

        .team-grid > :nth-child(2) {
            order: 2;
        }

        /* Member 2: HTML has info first, so the image (4th) jumps ahead of the info (3rd) */
        .team-grid > :nth-child(4) {
            order: 3;
        }

        .team-grid > :nth-child(3) {
            order: 4;
        }

        /* Member 3: image, info */
        .team-grid > :nth-child(5) {
            order: 5;
        }

        .team-grid > :nth-child(6) {
            order: 6;
        }
    .member-name {
        margin-top: 16px;
    }
}
@media (max-width: 639px) {
    .wrap{
        max-width:100%;
    }
    .mob-break {
        display: block;
    }

   
    .hero-title {
        font-size: 2rem;
        line-height: 1.15;
    }

    .feature-hero-section {
        padding: 20px 14px;
    }
    .team-image-block {
        width: 100%;
        height: 100%;
        max-height: 480px;
    }

        .team-image-block img {
            width: 100%;
            height: 480px;
            object-fit: cover;
            object-position: center 25%; /* Anchors the top of the image so heads are not cropped */
            display: block;
        }



    .feature-publication-image-link {
        height: 230px;
    }

    .feature-publication-content {
        padding: 18px 16px;
    }


    .feature-publication-meta {
        padding-top: 24px;
    }

    .heading, .main-title, .section-title-dark, .section-title-light, .publish-title, .client-reviews__title, .feature-hero-line:first-child,
    .insights-header, .consultation-card-title,.law-practice-heading {
    font-size: 28px !important;
}
    .desktop-break {
        display: none;
    }
    .section-padding, .legal-team-section, .approach-section, .practice-work-section, .law-practice-commitment, .feature-publications-section, .publications-section, .nh-final, .publications-section-beige, .client-reviews-section, legal-insights-section, .consultation-faq-section, .law-contact-form, .our-story-section, .purpose-section, .team-section, .memberships-section {
        padding: 60px 0;
    }
 
    .why-choose-us-section {
        padding-bottom: 40px;
    }
    .value__title, .card-title, .value__title_about {
        font-size: 25px !important;
    }
    .team-info-block {
        padding:0 10px;

    }
    .feature-hero-section{
        padding:0;
    }
    .consultation-card {
        padding: 1.5rem 0.75rem;
    }
    .law-section{
        padding:60px 0px 0px;
    }
    .legal-insights-divider{
        margin-bottom:0;
    }
    .law-practice-steps {
        --bs-gutter-x: 0; /* removes the row's negative side margins */
        margin-inline: 0;
        padding:0
    }

        .law-practice-steps > [class*="col-"] {
            padding-inline: 0;
        }

    .law-practice-step {
        display: flex;
        flex-direction: column;
        align-items: center; /* centers the icon, title and text as a column */
        padding: 0 var(--gutter);
    }

    .law-practice-text {
        max-width: 270px;
    }
    .story-heading, .card-icon-wrapper {
        margin-bottom: 1rem;
    }
 
    .content-card, .sidebar-card {
        padding: 20px 10px;
    }
    .stats .row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, max-content)); /* each column is as wide as its widest stat */
        justify-content: center; /* the whole group is centred on the page */
        column-gap: 0;
        row-gap: clamp(1.5rem, 4vw, 2.5rem);
        --bs-gutter-x: 0;
        margin-inline: 0;
    }

    .stats .stat {
        --stat-gap: clamp(1rem, 4vw, 3rem);
        width: auto;
        max-width: none;
        flex: none;
        padding-inline: var(--stat-gap);
        text-align: center; /* number and label centred inside their own cell */
    }

    .stats .stat__label {
        text-wrap: balance; /* if a label has to wrap, split it into even lines */
    }

    /* Divider only on the right-hand cells (it sits exactly on the column edge) */
    .stats .stat:nth-child(odd)::before {
        display: none;
    }
    .publication-action {
        display: flex;
        justify-content: flex-end;
        margin:0;
    }
.publication-item-beige {
    padding-bottom:1rem;
}
    

}




@media (max-width: 480px) {
    .about, .section-padding, .legal-team-section, .nh-final, .nh-final-card, .publications-section-beige, .our-story-section, .purpose-section, .team-section, .publications-section, .client-reviews-section, .legal-insights-section, .consultation-faq-section, .practice-work-section, .law-practice-commitment {
        padding-left: 6px;
        padding-right: 6px;
    }
    .team-image-block {
        width: 100%;
        height: 100%;
        max-height: 450px;
    }

        .team-image-block img {
            width: 100%;
            height: 450px;
            object-fit: cover;
            object-position: center 25%; /* Anchors the top of the image so heads are not cropped */
            display: block;
        }
    .homepage-title {
        font-size: 26px!important;
    }
    .hero-title {
        font-size: 1.75rem;
        line-height: 1.2;

        span {
            white-space: normal;
        }
    }

    .hero-section {
        padding: 55px 16px;
    }

    .hero-label {
        font-size: 0.65rem;
        letter-spacing: 0.1rem;
    }

    .hero-description {
        font-size: 0.8rem;
    }
  

    .experience-text {
        max-width: 450px;
       font-size:0.75rem;
        text-align: center;
    }
    .law-about-title {
        font-size: 28px;
        line-height: 1.12;
        letter-spacing: -0.01em;
    }
    .nh-foundation-grid {
   
       
        padding:5px;
    }
    .intro-section {
        padding: 0;
      
    }

  
    .feature-hero-content {
        min-height: 250px;
        padding-inline: 10px;
    }

    .feature-hero-image {
        height: 260px;
    }

    .feature-hero-heading {
        bottom: 230px;
        left: 15px;
        font-size: 2.5rem;
    }
    .law-contact {
        width: calc(100% - 32px);
        min-height: 150px;
        margin-top: 105px;
        padding: 32px 20px;
        border-radius: 16px;
    }
    .contact-title {
        font-size: 28px;
    }
   .heading-underline{
        font-size: 23px;
    }
    .versus-heading{
        font-size:18px;
    }
    .blog-subheading {
        font-size: 20px;
    }
    .marquee-content li {
        font-size: 22px;
    }

    .award-badge {
        width: 84px; /* SVG scales with it */
    }

    .intro-text {
        font-size: 1.2rem;
    }

    .intro-text {
        margin: 20px auto 0px;
    }
}
@media (min-width: 992px) {
    .experience-text {
        white-space: nowrap;
    }
 
        .custom-left-col {
            flex: 0 0 30%; /* Adjust custom width percentage here (e.g., 28%, 300px, 25%) */
            max-width: 30%;
        }
    .footer-watermark {
        font-size: clamp(6rem, 10vw, 10rem);
        font-weight: 700;
    }
    .about__intro-copy {
        padding-top: 0.6rem;
    }
    .about-sticky {
        position: sticky;
        top: 100px;
        min-height: calc(100vh - 100px);
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

        .about-sticky > .container {
            width: 100%;
        }
    .feature-publication-card-featured .feature-publication-image-link {
        height: 380px; /* Taller image proportion matching the 8-column width */
    }

    .feature-publication-card-featured .feature-publication-title {
        font-size: 24px; /* Slightly larger title for the featured post */
    }
    
}
@media (min-width: 1500px) {
    .marquee-content {
        font-size:90px;
    }
    .footer-watermark {
        font-size: clamp(8rem, 10vw, 16rem);
        font-weight: 700;
    }
    }
@media (min-width: 1800px) {
    .marquee-content {
        font-size: 100px;
    }
}
@media (min-width: 2000px) {
    .marquee-content {
        font-size: 110px;
    }
}
@media (max-width: 767.98px) {
    .team-row {
        position: relative; /* needed for the JS centering math */
        flex-wrap: nowrap;
        justify-content: flex-start !important;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding-bottom: 8px;
    }

        .team-row::-webkit-scrollbar {
            display: none;
        }

        .team-row > [class*="col-"] {
            flex: 0 0 100%;
            max-width: 100%;
            scroll-snap-align: center;
        }

    /* Back text is long; tighten it so it fits the front's height */
    .team-card-back {
        padding: 1.5rem 1.25rem;
        overflow-y: auto;
    }

    .team-card-back-role {
        margin-bottom: 0.75rem;
    }

    .team-card-divider {
        margin-bottom: 0.9rem;
    }

    .team-card-back-text {
        font-size: 0.8rem;
        line-height: 1.6;
    }
    .awards-wrapper {
        gap: 18px;
    }



    .intro-text {
        font-size: 1.35rem;
        line-height: 1.5;
    }
   
     
    
}

@media (prefers-reduced-motion: reduce) {
    .team-card-inner {
        transition-duration: 0.01s;
    }
}

@media (max-width: 767.98px) {
    .mobile-duplicate {
        display: block; /* Show duplicated items for smooth infinite loop */
    }

    .nh-foundation-grid {
        display: flex;
        gap: 1rem;
        width: max-content;
       
        /* Moves from left to right continuously */
        animation: scrollLeftToRight 15s linear infinite;
    }
        /* Pause animation on hover/touch */
        .nh-foundation-grid:hover {
            animation-play-state: paused;
        }

    .nh-principle {
        flex: 0 0 250px; /* Width of each card on small screens */
    }
        .nh-principle img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            border-radius: 16px;
        }
        .nh-principle,
        .nh-principle:hover,
        .nh-principle:focus,
        .nh-principle:active {
            box-shadow: none !important;
            filter: none !important;
            -webkit-box-shadow: none !important;
        }

            /* In case the shadow is drawn by a pseudo-element */
            .nh-principle::before,
            .nh-principle::after {
                box-shadow: none !important;
                background: none !important;
                filter: none !important;
            }
}

@keyframes scrollLeftToRight {
    0% {
        transform: translateX(-50%);
    }

    100% {
        transform: translateX(0%);
    }
}