/*
 Hritika Services – site-wide styles (all pages).
 Shared components (section headings, service cards, FAQ, enquiry form) plus
 the page banner, inner-page blocks, forms, gallery, CTA band, floating
 WhatsApp button and animations. Design tokens (--hs-*) live in style.css.
 1rem = 10px.
*/

/* ---------- Section heading ---------- */

.hs-sec-head {
    max-width: 72rem;
    margin-bottom: 5.2rem;
}

.hs-sec-head--center {
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.hs-sec-head--left {
    margin-right: 0;
    margin-left: 0;
    text-align: left;
}

.hs-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.4rem;
    color: var(--hs-green-dark);
    font-family: var(--dt-title-font);
    font-size: 1.4rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.hs-eyebrow::before {
    content: "";
    width: 2.8rem;
    height: 0.3rem;
    border-radius: 0.3rem;
    background: var(--hs-green);
    transform-origin: left center;
    transform: scaleX(0);
    transition: transform 0.6s var(--hs-ease) 0.15s;
}

.hs-sec-head--center .hs-eyebrow::after {
    content: "";
    width: 2.8rem;
    height: 0.3rem;
    border-radius: 0.3rem;
    background: var(--hs-green);
    transform-origin: right center;
    transform: scaleX(0);
    transition: transform 0.6s var(--hs-ease) 0.15s;
}

.hs-inview .hs-eyebrow::before,
.hs-inview .hs-eyebrow::after {
    transform: scaleX(1);
}

.hs-sec-title {
    margin: 0;
    color: var(--hs-navy);
    font-size: 4.2rem;
    font-weight: 800;
    line-height: 1.15;
}

.hs-sec-title span {
    position: relative;
    display: inline-block;
    color: var(--hs-green-dark);
}

.hs-sec-title span::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0.1em;
    left: 0;
    height: 0.16em;
    border-radius: 0.2em;
    background: var(--hs-green-tint);
    z-index: -1;
    transform-origin: left center;
    transform: scaleX(0);
    transition: transform 0.7s var(--hs-ease) 0.3s;
}

.hs-inview .hs-sec-title span::after {
    transform: scaleX(1);
}

.hs-sec-text {
    margin: 1.8rem 0 0;
    color: var(--dt-base-color);
    font-size: 1.7rem;
    line-height: 1.7;
}

.hs-sec-head--light .hs-sec-title {
    color: var(--hs-white);
}

.hs-sec-head--light .hs-sec-title span {
    color: var(--hs-green);
}

.hs-sec-head--light .hs-sec-title span::after {
    background: rgba(146, 207, 57, 0.22);
}

.hs-sec-head--light .hs-sec-text {
    color: var(--hs-text-light);
}

.hs-sec-head--light .hs-eyebrow {
    color: var(--hs-green);
}

/* =====================================================================
   3. Services
   ===================================================================== */

.hs-services {
    padding-top: 8rem;
    background:
        radial-gradient(60rem 30rem at 0% 0%, rgba(146, 207, 57, 0.08), transparent 70%),
        radial-gradient(50rem 30rem at 100% 100%, rgba(17, 16, 77, 0.06), transparent 70%);
}

.hs-svc-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 3rem;
}

.hs-svc-card {
    grid-column: span 2;
    position: relative;
    display: flex;
    flex-direction: column;
    border-radius: 2rem;
    background: var(--hs-white);
    box-shadow: 0 0.2rem 0.6rem rgba(11, 10, 58, 0.04), 0 0 0 1px var(--hs-line);
    overflow: hidden;
    transition: transform 0.35s var(--hs-ease), box-shadow 0.35s var(--hs-ease);
}

/* 5 cards → 3 on the first row, 2 centred on the second */
.hs-svc-grid--5 .hs-svc-card:nth-child(4) { grid-column: 2 / span 2; }
.hs-svc-grid--5 .hs-svc-card:nth-child(5) { grid-column: 4 / span 2; }
.hs-svc-grid--4 .hs-svc-card { grid-column: span 3; }
.hs-svc-grid--2 .hs-svc-card { grid-column: span 3; }
.hs-svc-grid--1 .hs-svc-card { grid-column: 2 / span 4; }

.hs-svc-card:hover,
.hs-svc-card:focus-within {
    transform: translateY(-0.8rem);
    box-shadow: 0 2.6rem 5rem rgba(11, 10, 58, 0.16), 0 0 0 1px rgba(146, 207, 57, 0.4);
}

.hs-svc-media {
    position: relative;
    aspect-ratio: 16 / 10;
    background: var(--hs-navy-deep);
    overflow: hidden;
}

.hs-svc-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.001);
    transition: transform 0.7s var(--hs-ease);
}

.hs-svc-card:hover .hs-svc-media img,
.hs-svc-card:focus-within .hs-svc-media img {
    transform: scale(1.07);
}

.hs-svc-media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(11, 10, 58, 0) 45%, rgba(11, 10, 58, 0.55) 100%);
}

.hs-svc-num {
    position: absolute;
    top: 1.4rem;
    left: 1.4rem;
    z-index: 1;
    padding: 0.5rem 1.2rem 0.5rem 1rem;
    border-radius: 99rem;
    background: rgba(11, 10, 58, 0.55);
    color: rgba(255, 255, 255, 0.95);
    font-family: var(--dt-title-font);
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
}

.hs-svc-num::before {
    content: "";
    display: inline-block;
    width: 1.4rem;
    height: 0.2rem;
    margin: 0 0.7rem 0.4rem 0;
    background: var(--hs-green);
    vertical-align: middle;
}

.hs-svc-icon {
    position: absolute;
    right: 2rem;
    bottom: -2.6rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 5.6rem;
    height: 5.6rem;
    border-radius: 1.6rem;
    background: var(--hs-green);
    color: var(--hs-navy);
    font-size: 2.2rem;
    box-shadow: 0 1rem 2.4rem rgba(146, 207, 57, 0.45);
    transition: transform 0.35s var(--hs-ease), background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease);
}

.hs-svc-card:hover .hs-svc-icon,
.hs-svc-card:focus-within .hs-svc-icon {
    background: var(--hs-navy);
    color: var(--hs-green);
    transform: rotate(-8deg) scale(1.08);
}

.hs-svc-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    padding: 3.6rem 2.8rem 2.8rem;
}

.hs-svc-title {
    margin: 0 0 1rem;
    padding-right: 4rem;
    font-size: 2.1rem;
    font-weight: 800;
    line-height: 1.3;
}

.hs-svc-title a {
    color: var(--hs-navy);
    text-decoration: none;
    transition: color var(--hs-dur) var(--hs-ease);
}

/* Whole card is the link target */
.hs-svc-title a::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 3;
}

.hs-svc-card:hover .hs-svc-title a {
    color: var(--hs-green-dark);
}

.hs-svc-text {
    margin: 0 0 2rem;
    color: var(--dt-base-color);
    font-size: 1.5rem;
    line-height: 1.7;
}

.hs-svc-more {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    margin-top: auto;
    color: var(--hs-navy);
    font-family: var(--dt-title-font);
    font-size: 1.4rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.hs-svc-more i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 50%;
    background: var(--hs-navy-tint);
    font-size: 1.1rem;
    transition: transform var(--hs-dur) var(--hs-ease), background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease);
}

.hs-svc-card:hover .hs-svc-more i {
    background: var(--hs-green);
    color: var(--hs-navy);
    transform: translateX(0.4rem);
}

.hs-svc-footer {
    margin-top: 5rem;
    text-align: center;
}

/* =====================================================================
   7b. FAQ
   ===================================================================== */

.hs-faq {
    background: var(--hs-white);
}

.hs-faq-grid {
    display: grid;
    grid-template-columns: 0.9fr 1.4fr;
    gap: 6rem;
    align-items: start;
}

.hs-faq-side {
    position: sticky;
    top: 12rem;
}

.hs-faq-side .hs-sec-head {
    margin-bottom: 2.8rem;
}

.hs-faq-list {
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
}

.hs-faq-item {
    border: 1px solid var(--hs-line);
    border-radius: 1.8rem;
    background: var(--dt-gray2-color, #f7f7fb);
    overflow: hidden;
    transition: box-shadow 0.35s var(--hs-ease), border-color 0.35s var(--hs-ease), background-color 0.35s var(--hs-ease);
}

.hs-faq-item.is-open {
    background: var(--hs-white);
    border-color: rgba(146, 207, 57, 0.5);
    box-shadow: 0 1.6rem 4rem rgba(11, 10, 58, 0.1);
}

.hs-faq-q {
    margin: 0;
    font-size: 1.7rem;
}

.hs-faq-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    width: 100%;
    padding: 2rem 2.4rem;
    border: 0;
    background: transparent;
    color: var(--hs-navy);
    font-family: var(--dt-title-font);
    font-size: 1.7rem;
    font-weight: 800;
    line-height: 1.35;
    text-align: left;
    cursor: pointer;
}

.hs-faq-btn i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 3.2rem;
    height: 3.2rem;
    border-radius: 50%;
    background: var(--hs-navy);
    color: var(--hs-green);
    font-size: 1.2rem;
    transition: transform 0.35s var(--hs-ease), background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease);
}

.hs-faq-btn:hover i,
.hs-faq-btn:focus-visible i {
    background: var(--hs-green);
    color: var(--hs-navy);
}

.hs-faq-item.is-open .hs-faq-btn i {
    transform: rotate(135deg);
}

.hs-faq-a {
    overflow: hidden;
    transition: max-height 0.4s var(--hs-ease);
}

.hs-faq-a p {
    margin: 0;
    padding: 0 2.4rem 2.2rem;
    color: var(--dt-base-color);
    font-size: 1.5rem;
    line-height: 1.75;
}

/* Enquiry card */
.hs-enquiry {
    position: relative;
}

.hs-form {
    position: relative;
    padding: 3.2rem;
    border-radius: 2.4rem;
    background: var(--hs-white);
    box-shadow: 0 2.4rem 6rem rgba(11, 10, 58, 0.14), 0 0 0 1px var(--hs-line);
}

.hs-form::before {
    content: "";
    position: absolute;
    top: 0;
    right: 3.2rem;
    left: 3.2rem;
    height: 0.4rem;
    border-radius: 0 0 0.4rem 0.4rem;
    background: linear-gradient(90deg, var(--hs-green), var(--hs-green-dark));
}

.hs-enquiry-head {
    display: flex;
    align-items: center;
    gap: 1.6rem;
    margin-bottom: 2.4rem;
}

.hs-enquiry-head h3 {
    margin: 0 0 0.3rem;
    color: var(--hs-navy);
    font-size: 2.2rem;
    font-weight: 800;
}

.hs-enquiry-head p {
    margin: 0;
    color: var(--dt-base-color);
    font-size: 1.4rem;
    line-height: 1.5;
}

.hs-enquiry-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 5.2rem;
    height: 5.2rem;
    border-radius: 1.6rem;
    background: var(--hs-navy);
    color: var(--hs-green);
    font-size: 2rem;
}

.hs-enquiry-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.4rem;
}

.hs-field {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    margin: 0 0 1.4rem;
}

.hs-field > span {
    color: var(--hs-navy);
    font-family: var(--dt-title-font);
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.hs-form input,
.hs-form select,
.hs-form textarea {
    width: 100%;
    min-height: 5rem;
    padding: 1.2rem 1.6rem;
    border: 1px solid rgba(17, 16, 77, 0.14);
    border-radius: 1.2rem;
    background: var(--dt-gray2-color, #f7f7fb);
    color: var(--hs-navy);
    font-family: var(--dt-base-font);
    font-size: 1.5rem;
    line-height: 1.5;
    outline: 0;
    transition: border-color var(--hs-dur) var(--hs-ease), box-shadow var(--hs-dur) var(--hs-ease), background-color var(--hs-dur) var(--hs-ease);
}

.hs-form textarea {
    resize: vertical;
    min-height: 9rem;
}

.hs-form select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 4rem;
    background-image: linear-gradient(45deg, transparent 50%, var(--hs-navy) 50%), linear-gradient(135deg, var(--hs-navy) 50%, transparent 50%);
    background-position: calc(100% - 2.1rem) 50%, calc(100% - 1.6rem) 50%;
    background-size: 0.5rem 0.5rem, 0.5rem 0.5rem;
    background-repeat: no-repeat;
}

.hs-form input:focus,
.hs-form select:focus,
.hs-form textarea:focus {
    border-color: var(--hs-green);
    background: var(--hs-white);
    box-shadow: 0 0 0 0.4rem var(--hs-green-tint);
}

.hs-form ::placeholder {
    color: #9a9ab0;
    opacity: 1;
}

.hs-enquiry-error {
    margin: -0.4rem 0 1.2rem;
    padding: 1rem 1.4rem;
    border-radius: 1rem;
    background: #fff1f1;
    color: #b42318;
    font-size: 1.4rem;
    font-weight: 700;
}

.hs-enquiry-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;
    margin-top: 0.6rem;
}

/* <button> elements: out-specify the parent theme's button[type="submit"] rules */
.hs-enquiry-actions button.hs-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.9rem;
    min-height: 5.2rem;
    padding: 0 2.6rem;
    border: 0;
    border-radius: 99rem;
    background: var(--hs-green-dark);
    color: var(--hs-white);
    font-family: var(--dt-title-font);
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1;
    text-transform: none;
    cursor: pointer;
    box-shadow: 0 0.6rem 1.8rem rgba(111, 185, 2, 0.35);
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease), box-shadow var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease);
}

.hs-enquiry-actions button.hs-cta:hover,
.hs-enquiry-actions button.hs-cta:focus-visible {
    background: var(--hs-green);
    color: var(--hs-navy);
    box-shadow: 0 1rem 2.6rem rgba(146, 207, 57, 0.45);
    transform: translateY(-2px);
}

.hs-enquiry-actions button.hs-cta--ghost {
    border: 1px solid rgba(17, 16, 77, 0.15);
    background: transparent;
    color: var(--hs-navy);
    box-shadow: none;
}

.hs-enquiry-actions button.hs-cta--ghost:hover,
.hs-enquiry-actions button.hs-cta--ghost:focus-visible {
    background: var(--hs-navy);
    border-color: var(--hs-navy);
    color: var(--hs-white);
    box-shadow: 0 0.8rem 2rem rgba(17, 16, 77, 0.2);
}

.hs-enquiry-note {
    display: flex;
    align-items: flex-start;
    gap: 0.8rem;
    margin: 1.8rem 0 0;
    color: var(--dt-base-color);
    font-size: 1.3rem;
    line-height: 1.5;
}

.hs-enquiry-note i {
    margin-top: 0.3rem;
    color: var(--hs-green-dark);
}

/* =====================================================================
   Scroll-reveal variants (base .hs-reveal lives in style.css)
   ===================================================================== */

.hs-js .hs-reveal {
    transition-delay: var(--hs-delay, 0s);
}

.hs-js .hs-reveal--left {
    transform: translateX(-3rem);
}

.hs-js .hs-reveal--right {
    transform: translateX(3rem);
}

.hs-js .hs-reveal--zoom {
    transform: scale(0.94);
}

.hs-js .hs-reveal.hs-inview {
    transform: none;
}

/* Buttons – same sizing as the home page everywhere */
.hs-inner-page .hs-cta,
.hs-banner .hs-cta,
.hs-cta-band .hs-cta {
    min-height: 5.2rem;
    padding: 0 2.6rem;
    font-size: 1.5rem;
}

.hs-cta .fa-arrow-right {
    transition: transform var(--hs-dur) var(--hs-ease);
}

.hs-cta:hover .fa-arrow-right,
.hs-cta:focus-visible .fa-arrow-right {
    transform: translateX(0.4rem);
}

.hs-cta--white {
    background: var(--hs-white);
    color: var(--hs-navy);
    box-shadow: 0 0.8rem 2rem rgba(0, 0, 0, 0.18);
}

.hs-cta--white:hover,
.hs-cta--white:focus-visible {
    background: var(--hs-navy);
    color: var(--hs-white);
}

.hs-btn-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1.4rem;
    margin-top: 2.8rem;
}

/* =====================================================================
   Page banner
   ===================================================================== */

.hs-banner {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 38rem;
    padding: 10rem 0 7rem;
    background: var(--hs-navy-deep);
    color: var(--hs-white);
    overflow: hidden;
    isolation: isolate;
}

.hs-banner--service {
    min-height: 46rem;
}

.hs-banner-bg {
    position: absolute;
    inset: -4%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    transform: scale(1.02);
    animation: hsBannerZoom 18s ease-out both;
    will-change: transform;
}

.hs-banner-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(100deg, rgba(11, 10, 58, 0.94) 0%, rgba(17, 16, 77, 0.78) 45%, rgba(17, 16, 77, 0.45) 100%),
        linear-gradient(180deg, rgba(11, 10, 58, 0.2), rgba(11, 10, 58, 0.55));
}

.hs-banner-shapes {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.hs-banner-shapes span {
    position: absolute;
    border-radius: 3rem;
    border: 1px solid rgba(146, 207, 57, 0.35);
    opacity: 0.6;
    animation: hsDriftSlow 14s ease-in-out infinite alternate;
}

.hs-banner-shapes span:nth-child(1) { right: 12%; top: 18%; width: 9rem; height: 9rem; transform: rotate(18deg); }
.hs-banner-shapes span:nth-child(2) { right: 26%; bottom: 14%; width: 5.5rem; height: 5.5rem; border-color: rgba(255, 255, 255, 0.25); animation-delay: -4s; }
.hs-banner-shapes span:nth-child(3) { right: 6%; bottom: 30%; width: 14rem; height: 14rem; border-radius: 50%; border-color: rgba(146, 207, 57, 0.2); animation-delay: -8s; }

.hs-banner-inner {
    position: relative;
    max-width: 80rem;
}

.hs-crumbs ol {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem 1rem;
    margin: 0 0 2rem;
    padding: 0;
    list-style: none;
    font-size: 1.35rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    animation: hsRise 0.6s var(--hs-ease) 0.05s both;
}

.hs-crumbs li {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    margin: 0;
    color: rgba(255, 255, 255, 0.85);
}

.hs-crumbs li + li::before {
    content: "";
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: var(--hs-green);
}

.hs-crumbs a {
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    transition: color var(--hs-dur) var(--hs-ease);
}

.hs-crumbs a:hover {
    color: var(--hs-green);
}

.hs-crumbs [aria-current] span {
    color: var(--hs-white);
}

.hs-banner-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.4rem;
    padding: 0.7rem 1.4rem;
    border-radius: 99rem;
    border: 1px solid rgba(146, 207, 57, 0.45);
    background: rgba(146, 207, 57, 0.12);
    color: var(--hs-green);
    font-family: var(--dt-title-font);
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    animation: hsRise 0.6s var(--hs-ease) 0.1s both;
}

.hs-banner-title {
    margin: 0;
    color: var(--hs-white);
    font-size: clamp(3.4rem, 5vw, 5.6rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.01em;
    animation: hsRise 0.7s var(--hs-ease) 0.15s both;
}

.hs-banner-text {
    max-width: 62rem;
    margin: 1.8rem 0 0;
    color: var(--hs-text-light);
    font-size: 1.7rem;
    line-height: 1.7;
    animation: hsRise 0.7s var(--hs-ease) 0.28s both;
}

.hs-banner-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1.4rem;
    margin-top: 3rem;
    animation: hsRise 0.7s var(--hs-ease) 0.4s both;
}

/* Parent theme's page-title strip is replaced – make sure it never shows */
.dt_pagetitle {
    display: none;
}

/* =====================================================================
   Page layout & blocks
   ===================================================================== */

.hs-page {
    display: block;
    padding: 2rem 0 0;
    overflow-x: clip;
}

.hs-page img {
    max-width: 100%;
    height: auto;
}

.hs-block {
    position: relative;
    padding: 6rem 0;
}

.hs-block + .hs-block {
    padding-top: 2rem;
}

.hs-block--narrow {
    max-width: 90rem;
    margin-right: auto;
    margin-left: auto;
}

.hs-block .hs-sec-head {
    margin-bottom: 4rem;
}

.hs-sec-head--tight {
    margin-bottom: 2.4rem;
}

.hs-lead {
    margin: 0 0 1.6rem;
    color: var(--dt-base-color);
    font-size: 1.7rem;
    line-height: 1.75;
}

/* Rich text (About intro, privacy policy…) */
.hs-rich {
    color: var(--dt-base-color);
    font-size: 1.6rem;
    line-height: 1.8;
}

.hs-rich > :first-child {
    margin-top: 0;
}

.hs-rich h2,
.hs-rich h3,
.hs-rich h4 {
    margin: 3.2rem 0 1.2rem;
    color: var(--hs-navy);
    font-weight: 800;
    line-height: 1.25;
}

.hs-rich h2 { font-size: 2.8rem; }
.hs-rich h3 { font-size: 2.2rem; }
.hs-rich h4 { font-size: 1.8rem; }

.hs-rich p {
    margin: 0 0 1.6rem;
}

.hs-rich ul,
.hs-rich ol {
    margin: 0 0 2rem;
    padding-left: 2.2rem;
}

.hs-rich li {
    margin: 0 0 0.7rem;
}

.hs-rich ul li::marker {
    color: var(--hs-green-dark);
}

.hs-rich a {
    color: var(--hs-green-dark);
    font-weight: 700;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.2em;
}

.hs-rich a:hover {
    color: var(--hs-navy);
}

.hs-rich strong {
    color: var(--hs-navy);
}

.hs-rich .hs-highlight {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.2rem 2.4rem;
    margin: 2.4rem 0;
    padding: 0;
    list-style: none;
}

.hs-rich .hs-highlight li {
    position: relative;
    margin: 0;
    padding-left: 3.2rem;
    color: var(--hs-navy);
    font-weight: 700;
}

.hs-rich .hs-highlight li::before {
    content: "\f00c";
    position: absolute;
    left: 0;
    top: 0.15em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 50%;
    background: var(--hs-green-tint);
    color: var(--hs-green-dark);
    font-family: "Font Awesome 5 Free";
    font-size: 1rem;
    font-weight: 900;
}

/* =====================================================================
   Intro (text + image)
   ===================================================================== */

.hs-intro {
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    gap: 6rem;
    align-items: center;
}

.hs-block--intro.is-reverse .hs-intro-media {
    order: 2;
}

.hs-intro-media {
    position: relative;
    padding: 0 6rem 6rem 0;
}

.hs-media-frame {
    position: relative;
    border-radius: 2.4rem;
    overflow: hidden;
    background: var(--hs-navy-deep);
    box-shadow: 0 2.4rem 6rem rgba(11, 10, 58, 0.18);
}

.hs-media-frame img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.8s var(--hs-ease);
}

.hs-media-frame:hover img {
    transform: scale(1.04);
}

.hs-media-frame--tall {
    aspect-ratio: 4 / 4.6;
}

.hs-media-frame::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
    pointer-events: none;
}

.hs-media-small {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 46%;
    aspect-ratio: 4 / 3;
    border: 0.8rem solid var(--hs-white);
    border-radius: 2rem;
    overflow: hidden;
    box-shadow: 0 2rem 5rem rgba(11, 10, 58, 0.2);
    animation: hsFloat 7s ease-in-out infinite;
}

.hs-media-small img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hs-media-badge {
    position: absolute;
    left: 2rem;
    bottom: 8rem;
    display: inline-flex;
    align-items: center;
    gap: 1.2rem;
    padding: 1.2rem 1.8rem 1.2rem 1.2rem;
    border-radius: 1.6rem;
    background: var(--hs-white);
    color: var(--hs-navy);
    font-family: var(--dt-title-font);
    font-size: 1.4rem;
    font-weight: 800;
    box-shadow: 0 1.6rem 4rem rgba(11, 10, 58, 0.18);
}

.hs-media-badge--top {
    top: 2rem;
    bottom: auto;
}

.hs-media-badge i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 4rem;
    height: 4rem;
    border-radius: 1.2rem;
    background: var(--hs-navy);
    color: var(--hs-green);
    font-size: 1.6rem;
}

.hs-media-badge span {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.hs-media-badge small {
    color: var(--dt-base-color);
    font-family: var(--dt-base-font);
    font-size: 1.25rem;
    font-weight: 500;
}

.hs-intro-text .hs-sec-title {
    font-size: 3.8rem;
}

/* Service intro variant */
.hs-service-intro {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 6rem;
    align-items: center;
    padding: 6rem 0 4rem;
}

.hs-service-intro-media {
    position: relative;
    padding-bottom: 3rem;
}

.hs-service-intro-media .hs-media-frame {
    aspect-ratio: 4 / 3;
}

.hs-service-intro-media .hs-media-badge {
    bottom: 0;
    left: 2.4rem;
}

.hs-service-intro-text .hs-eyebrow {
    margin-bottom: 1.6rem;
}

.hs-service-intro-text .hs-eyebrow::before {
    display: none;
}

.hs-service-intro-text .hs-sec-title {
    margin-bottom: 2rem;
    font-size: 3.8rem;
}

/* =====================================================================
   Feature grids (reasons, values, clients, benefits)
   ===================================================================== */

.hs-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.4rem;
}

.hs-feature-grid--4 {
    grid-template-columns: repeat(4, 1fr);
}

.hs-feature-grid--2 {
    grid-template-columns: repeat(2, 1fr);
}

.hs-feature {
    position: relative;
    padding: 3.2rem 2.8rem;
    border-radius: 2rem;
    background: var(--hs-white);
    box-shadow: 0 0.2rem 0.6rem rgba(11, 10, 58, 0.04), 0 0 0 1px var(--hs-line);
    overflow: hidden;
    transition: transform 0.35s var(--hs-ease), box-shadow 0.35s var(--hs-ease);
}

.hs-feature::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 0.4rem;
    background: linear-gradient(90deg, var(--hs-green), var(--hs-green-dark));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.45s var(--hs-ease);
}

.hs-feature:hover {
    transform: translateY(-0.6rem);
    box-shadow: 0 2.2rem 4.6rem rgba(11, 10, 58, 0.14), 0 0 0 1px rgba(146, 207, 57, 0.4);
}

.hs-feature:hover::before {
    transform: scaleX(1);
}

.hs-feature-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 5.6rem;
    height: 5.6rem;
    margin-bottom: 2rem;
    border-radius: 1.6rem;
    background: var(--hs-navy);
    color: var(--hs-green);
    font-size: 2.2rem;
    transition: transform 0.35s var(--hs-ease), background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease);
}

.hs-feature:hover .hs-feature-icon {
    background: var(--hs-green);
    color: var(--hs-navy);
    transform: rotate(-8deg) scale(1.06);
}

.hs-feature h3 {
    margin: 0 0 0.8rem;
    color: var(--hs-navy);
    font-size: 1.9rem;
    font-weight: 800;
    line-height: 1.3;
}

.hs-feature p {
    margin: 0;
    color: var(--dt-base-color);
    font-size: 1.5rem;
    line-height: 1.7;
}

/* Tinted variant (client groups) */
.hs-feature-grid--tint .hs-feature {
    background: var(--dt-gray2-color, #f7f7fb);
    box-shadow: none;
}

.hs-feature-grid--tint .hs-feature:hover {
    background: var(--hs-white);
    box-shadow: 0 2.2rem 4.6rem rgba(11, 10, 58, 0.12);
}

/* Dark band variant (values) */
.hs-block--values {
    padding: 0;
    margin: 4rem 0;
}

.hs-block--values::before {
    content: "";
    position: absolute;
    inset: 0 -100vw;
    margin: 0 auto;
    width: 200vw;
    background: var(--hs-navy);
}

.hs-block--values > * {
    position: relative;
}

.hs-block--values {
    padding: 8rem 0;
}

.hs-block--values .hs-sec-head .hs-sec-title { color: var(--hs-white); }
.hs-block--values .hs-sec-head .hs-sec-title span { color: var(--hs-green); }
.hs-block--values .hs-sec-head .hs-sec-title span::after { background: rgba(146, 207, 57, 0.25); }
.hs-block--values .hs-sec-head .hs-sec-text { color: var(--hs-text-light); }
.hs-block--values .hs-sec-head .hs-eyebrow { color: var(--hs-green); }

.hs-feature-grid--dark .hs-feature {
    background: rgba(255, 255, 255, 0.05);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1);
}

.hs-feature-grid--dark .hs-feature:hover {
    background: rgba(255, 255, 255, 0.09);
    box-shadow: 0 2rem 4rem rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(146, 207, 57, 0.5);
}

.hs-feature-grid--dark .hs-feature-icon {
    background: var(--hs-green);
    color: var(--hs-navy);
}

.hs-feature-grid--dark .hs-feature h3 {
    color: var(--hs-white);
}

.hs-feature-grid--dark .hs-feature p {
    color: var(--hs-text-light);
}

/* =====================================================================
   Check list grid ("what's included")
   ===================================================================== */

.hs-check-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.4rem 2.4rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.hs-check-grid li {
    display: flex;
    align-items: flex-start;
    gap: 1.4rem;
    margin: 0;
    padding: 1.6rem 1.8rem;
    border-radius: 1.4rem;
    background: var(--dt-gray2-color, #f7f7fb);
    color: var(--hs-navy);
    font-size: 1.55rem;
    font-weight: 600;
    line-height: 1.5;
    transition: background-color var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease);
}

.hs-check-grid li:hover {
    background: var(--hs-green-tint);
    transform: translateX(0.4rem);
}

.hs-check-grid i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 2.6rem;
    height: 2.6rem;
    margin-top: 0.1rem;
    border-radius: 50%;
    background: var(--hs-green);
    color: var(--hs-navy);
    font-size: 1.1rem;
}

.hs-service-includes,
.hs-service-benefits,
.hs-service-steps {
    padding: 4rem 0;
}

/* =====================================================================
   Stepper (process)
   ===================================================================== */

.hs-stepper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 3rem;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: hs-stepper;
}

.hs-stepper-item {
    position: relative;
    margin: 0;
    padding: 0 1rem;
    text-align: center;
}

.hs-stepper-item::after {
    content: "";
    position: absolute;
    top: 4rem;
    left: calc(50% + 4.6rem);
    width: calc(100% - 9.2rem);
    height: 0.2rem;
    background: repeating-linear-gradient(90deg, var(--hs-green) 0 0.8rem, transparent 0.8rem 1.6rem);
    opacity: 0.6;
}

.hs-stepper-item:last-child::after {
    display: none;
}

.hs-stepper-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 8rem;
    height: 8rem;
    margin-bottom: 2rem;
    border-radius: 50%;
    background: var(--hs-white);
    color: var(--hs-navy);
    font-size: 2.6rem;
    box-shadow: 0 1rem 3rem rgba(11, 10, 58, 0.12), 0 0 0 1px var(--hs-line);
    transition: transform 0.35s var(--hs-ease), background-color 0.35s var(--hs-ease), color 0.35s var(--hs-ease);
}

.hs-stepper-icon b {
    position: absolute;
    top: -0.4rem;
    right: -0.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.8rem;
    height: 2.8rem;
    border-radius: 50%;
    background: var(--hs-green);
    color: var(--hs-navy);
    font-family: var(--dt-title-font);
    font-size: 1.2rem;
    font-weight: 800;
}

.hs-stepper-item:hover .hs-stepper-icon {
    background: var(--hs-navy);
    color: var(--hs-green);
    transform: translateY(-0.4rem);
}

.hs-stepper-item h3 {
    margin: 0 0 0.8rem;
    color: var(--hs-navy);
    font-size: 1.8rem;
    font-weight: 800;
}

.hs-stepper-item p {
    margin: 0;
    color: var(--dt-base-color);
    font-size: 1.45rem;
    line-height: 1.7;
}

/* =====================================================================
   Service page bottom: FAQ + other services | form
   ===================================================================== */

.hs-service-bottom {
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 5rem;
    align-items: start;
    padding: 4rem 0 6rem;
}

.hs-service-form {
    position: sticky;
    top: 12rem;
}

.hs-service-others {
    margin-top: 4rem;
    padding: 2.8rem;
    border-radius: 2rem;
    background: var(--dt-gray2-color, #f7f7fb);
}

.hs-service-others h3 {
    margin: 0 0 1.6rem;
    color: var(--hs-navy);
    font-size: 1.8rem;
    font-weight: 800;
}

.hs-service-others ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.hs-service-others li {
    margin: 0;
}

.hs-service-others a {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    padding: 1.2rem 1.4rem;
    border-radius: 1.2rem;
    background: var(--hs-white);
    color: var(--hs-navy);
    font-size: 1.45rem;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 0 0 1px var(--hs-line);
    transition: box-shadow var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease);
}

.hs-service-others a > i:first-child {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 3.4rem;
    height: 3.4rem;
    border-radius: 1rem;
    background: var(--hs-navy);
    color: var(--hs-green);
    font-size: 1.4rem;
}

.hs-service-others a span {
    flex: 1 1 auto;
}

.hs-service-others .hs-arrow {
    color: var(--hs-green-dark);
    font-size: 1.2rem;
    transition: transform var(--hs-dur) var(--hs-ease);
}

.hs-service-others a:hover {
    color: var(--hs-green-dark);
    transform: translateX(0.3rem);
    box-shadow: 0 1rem 2.6rem rgba(11, 10, 58, 0.1), 0 0 0 1px rgba(146, 207, 57, 0.5);
}

.hs-service-others a:hover .hs-arrow {
    transform: translateX(0.3rem);
}

/* =====================================================================
   FAQ page groups
   ===================================================================== */

.hs-faq-groups {
    display: grid;
    gap: 5rem;
    max-width: 96rem;
    margin: 0 auto;
}

.hs-faq-group-title {
    display: flex;
    align-items: center;
    gap: 1.4rem;
    margin: 0 0 2rem;
    color: var(--hs-navy);
    font-size: 2.2rem;
    font-weight: 800;
}

.hs-faq-group-title i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 1.2rem;
    background: var(--hs-navy);
    color: var(--hs-green);
    font-size: 1.7rem;
}

.hs-faq-group-link {
    margin: 1.6rem 0 0;
    text-align: right;
}

.hs-faq-group-link a {
    color: var(--hs-green-dark);
    font-family: var(--dt-title-font);
    font-size: 1.4rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-decoration: none;
    text-transform: uppercase;
}

.hs-faq-group-link a:hover {
    color: var(--hs-navy);
}

/* =====================================================================
   Areas (chips)
   ===================================================================== */

.hs-areas {
    display: grid;
    grid-template-columns: 1.4fr 0.8fr;
    gap: 4rem;
    align-items: center;
}

.hs-areas-list {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.hs-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    padding: 1rem 1.6rem;
    border-radius: 99rem;
    background: var(--dt-gray2-color, #f7f7fb);
    color: var(--hs-navy);
    font-size: 1.45rem;
    font-weight: 700;
    box-shadow: 0 0 0 1px var(--hs-line);
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease);
}

.hs-chip i {
    color: var(--hs-green-dark);
    font-size: 1.2rem;
}

.hs-chip:hover {
    background: var(--hs-navy);
    color: var(--hs-white);
    transform: translateY(-0.2rem);
}

.hs-chip:hover i {
    color: var(--hs-green);
}

.hs-areas-card {
    padding: 3.2rem;
    border-radius: 2.4rem;
    background: var(--hs-navy);
    color: var(--hs-white);
    box-shadow: 0 2.4rem 5rem rgba(11, 10, 58, 0.2);
}

.hs-areas-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 5.6rem;
    height: 5.6rem;
    margin-bottom: 1.8rem;
    border-radius: 1.6rem;
    background: var(--hs-green);
    color: var(--hs-navy);
    font-size: 2.2rem;
}

.hs-areas-card h3 {
    margin: 0 0 0.8rem;
    color: var(--hs-white);
    font-size: 2rem;
    font-weight: 800;
}

.hs-areas-card p {
    margin: 0 0 2rem;
    color: var(--hs-text-light);
    font-size: 1.5rem;
    line-height: 1.6;
}

.hs-areas-card .hs-cta--ghost {
    border-color: rgba(255, 255, 255, 0.35);
    color: var(--hs-white);
}

.hs-areas-card .hs-cta--ghost:hover {
    background: var(--hs-green);
    border-color: var(--hs-green);
    color: var(--hs-navy);
}

/* =====================================================================
   Stats / facts strip
   ===================================================================== */

.hs-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.hs-stats li {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin: 0;
    padding: 2.4rem 2.4rem 2.4rem 8.2rem;
    border-radius: 1.8rem;
    background: var(--hs-white);
    box-shadow: 0 0.2rem 0.6rem rgba(11, 10, 58, 0.04), 0 0 0 1px var(--hs-line);
    position: relative;
}

.hs-stats-icon {
    position: absolute;
    left: 2.2rem;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 1.2rem;
    background: var(--hs-green-tint);
    color: var(--hs-green-dark);
    font-size: 1.7rem;
}

.hs-stats strong {
    color: var(--hs-navy);
    font-family: var(--dt-title-font);
    font-size: 1.7rem;
    font-weight: 800;
}

.hs-stats small {
    color: var(--dt-base-color);
    font-size: 1.3rem;
    line-height: 1.5;
}

/* =====================================================================
   Gallery
   ===================================================================== */

.hs-filter {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.8rem;
    margin: -1rem 0 3.6rem;
}

.hs-filter-btn {
    padding: 1rem 2rem;
    border: 1px solid var(--hs-line);
    border-radius: 99rem;
    background: var(--hs-white);
    color: var(--hs-navy);
    font-family: var(--dt-title-font);
    font-size: 1.4rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    cursor: pointer;
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease), border-color var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease);
}

.hs-filter-btn:hover {
    border-color: var(--hs-green);
    transform: translateY(-0.2rem);
}

.hs-filter-btn.is-active {
    background: var(--hs-navy);
    border-color: var(--hs-navy);
    color: var(--hs-green);
}

.hs-work {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.4rem;
}

.hs-work-item {
    position: relative;
    margin: 0;
    border-radius: 2rem;
    background: var(--hs-white);
    box-shadow: 0 0.2rem 0.6rem rgba(11, 10, 58, 0.04), 0 0 0 1px var(--hs-line);
    overflow: hidden;
    transition: transform 0.35s var(--hs-ease), box-shadow 0.35s var(--hs-ease), opacity 0.3s var(--hs-ease);
}

.hs-work-item.is-hidden {
    display: none;
}

.hs-work-item:hover {
    transform: translateY(-0.6rem);
    box-shadow: 0 2.2rem 4.6rem rgba(11, 10, 58, 0.16);
}

.hs-work-item a {
    position: relative;
    display: block;
    aspect-ratio: 4 / 3;
    background: var(--hs-navy-deep);
    overflow: hidden;
}

.hs-work-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s var(--hs-ease);
}

.hs-work-item:hover img {
    transform: scale(1.06);
}

.hs-work-zoom {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(11, 10, 58, 0.45);
    color: var(--hs-white);
    font-size: 2.4rem;
    opacity: 0;
    transition: opacity 0.35s var(--hs-ease);
}

.hs-work-zoom i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 5.6rem;
    height: 5.6rem;
    border-radius: 50%;
    background: var(--hs-green);
    color: var(--hs-navy);
    font-size: 2rem;
    transform: scale(0.6);
    transition: transform 0.35s var(--hs-ease);
}

.hs-work-item:hover .hs-work-zoom,
.hs-work-item a:focus-visible .hs-work-zoom {
    opacity: 1;
}

.hs-work-item:hover .hs-work-zoom i {
    transform: none;
}

.hs-work-item figcaption {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    padding: 1.8rem 2rem 2rem;
}

.hs-work-cat {
    color: var(--hs-green-dark);
    font-family: var(--dt-title-font);
    font-size: 1.2rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.hs-work-item strong {
    color: var(--hs-navy);
    font-size: 1.7rem;
    font-weight: 800;
}

.hs-work-item small {
    color: var(--dt-base-color);
    font-size: 1.4rem;
    line-height: 1.55;
}

.hs-work-empty {
    margin: 3rem 0 0;
    text-align: center;
    color: var(--dt-base-color);
}

/* =====================================================================
   CTA band
   ===================================================================== */

.hs-block--cta {
    padding: 4rem 0 6rem;
}

.hs-cta-band {
    position: relative;
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 3rem;
    align-items: center;
    padding: 5rem 5.6rem;
    border-radius: 2.8rem;
    background: var(--hs-navy);
    color: var(--hs-white);
    overflow: hidden;
    box-shadow: 0 3rem 7rem rgba(11, 10, 58, 0.28);
}

.hs-cta-band--green {
    background: linear-gradient(120deg, var(--hs-green-dark), var(--hs-green));
    color: var(--hs-navy);
}

.hs-cta-band-shapes {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.hs-cta-band-shapes span {
    position: absolute;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(146, 207, 57, 0.35), rgba(146, 207, 57, 0) 70%);
    pointer-events: none;
    animation: hsDriftSlow 12s ease-in-out infinite alternate;
}

.hs-cta-band--green .hs-cta-band-shapes span {
    background: radial-gradient(circle, rgba(255, 255, 255, 0.35), rgba(255, 255, 255, 0) 70%);
}

.hs-cta-band-shapes span:nth-child(1) { width: 32rem; height: 32rem; right: -8rem; top: -14rem; }
.hs-cta-band-shapes span:nth-child(2) { width: 22rem; height: 22rem; left: 30%; bottom: -14rem; animation-delay: -6s; }

.hs-cta-band-text {
    position: relative;
}

.hs-cta-band .hs-eyebrow {
    color: var(--hs-green);
}

.hs-cta-band--green .hs-eyebrow {
    color: var(--hs-navy);
}

.hs-cta-band--green .hs-eyebrow::before {
    background: var(--hs-navy);
}

.hs-cta-band h2 {
    margin: 0 0 1rem;
    color: inherit;
    font-size: 3.2rem;
    font-weight: 800;
    line-height: 1.2;
}

.hs-cta-band p {
    margin: 0;
    color: var(--hs-text-light);
    font-size: 1.6rem;
    line-height: 1.6;
}

.hs-cta-band--green p {
    color: rgba(17, 16, 77, 0.8);
}

.hs-cta-band-actions {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 1.2rem;
}

.hs-cta-band--green .hs-cta {
    background: var(--hs-navy);
    color: var(--hs-white);
}

.hs-cta-band--green .hs-cta--white {
    background: var(--hs-white);
    color: var(--hs-navy);
}

/* =====================================================================
   Contact cards & layouts
   ===================================================================== */

.hs-contact-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
}

.hs-contact-cards--1 {
    grid-template-columns: 1fr;
    gap: 1.4rem;
}

.hs-contact-cards--2 {
    grid-template-columns: repeat(2, 1fr);
}

.hs-inner-page .hs-contact-card {
    display: flex;
    align-items: flex-start;
    gap: 1.6rem;
    margin: 0;
    padding: 2.4rem;
    border-radius: 2rem;
    background: var(--hs-white);
    color: var(--hs-navy);
    text-decoration: none;
    box-shadow: 0 0.2rem 0.6rem rgba(11, 10, 58, 0.04), 0 0 0 1px var(--hs-line);
    transition: transform 0.35s var(--hs-ease), box-shadow 0.35s var(--hs-ease);
}

.hs-inner-page a.hs-contact-card:hover {
    transform: translateY(-0.5rem);
    box-shadow: 0 2rem 4.4rem rgba(11, 10, 58, 0.14), 0 0 0 1px rgba(146, 207, 57, 0.45);
}

.hs-inner-page .hs-contact-card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 5.2rem;
    height: 5.2rem;
    border-radius: 1.6rem;
    background: var(--hs-navy);
    color: var(--hs-green);
    font-size: 2rem;
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease), transform 0.35s var(--hs-ease);
}

.hs-inner-page a.hs-contact-card:hover .hs-contact-card-icon {
    background: var(--hs-green);
    color: var(--hs-navy);
    transform: rotate(-8deg);
}

.hs-inner-page .hs-contact-card-body {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 0;
}

.hs-inner-page .hs-contact-card-label {
    color: var(--hs-green-dark);
    font-family: var(--dt-title-font);
    font-size: 1.2rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.hs-inner-page .hs-contact-card-value {
    color: var(--hs-navy);
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.hs-inner-page .hs-contact-card-action {
    margin-top: 0.4rem;
    color: var(--dt-base-color);
    font-size: 1.3rem;
    font-weight: 700;
}

.hs-inner-page .hs-contact-card-action i {
    transition: transform var(--hs-dur) var(--hs-ease);
}

.hs-inner-page a.hs-contact-card:hover .hs-contact-card-action i {
    transform: translateX(0.3rem);
}

.hs-inner-page .hs-contact-gstin {
    margin: 2rem 0 0;
    color: var(--dt-base-color);
    font-size: 1.4rem;
    text-align: center;
}

.hs-contact-layout,
.hs-feedback-layout {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 4rem;
    align-items: start;
}

.hs-contact-side .hs-block,
.hs-contact-side .hs-block + .hs-block {
    padding: 0;
}

.hs-contact-side .hs-contact-gstin {
    text-align: left;
}

/* Feedback side */
.hs-fb-list {
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.hs-fb-list li {
    display: flex;
    align-items: flex-start;
    gap: 1.4rem;
    margin: 0;
    padding: 2rem 2.2rem;
    border-radius: 1.8rem;
    background: var(--dt-gray2-color, #f7f7fb);
}

.hs-fb-list li > span:last-child {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.hs-fb-list strong {
    color: var(--hs-navy);
    font-size: 1.6rem;
    font-weight: 800;
}

.hs-fb-list small {
    color: var(--dt-base-color);
    font-size: 1.4rem;
    line-height: 1.55;
}

.hs-fb-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 1.2rem;
    background: var(--hs-navy);
    color: var(--hs-green);
    font-size: 1.6rem;
}

.hs-feedback-alt {
    margin-top: 2.4rem;
    padding: 2.4rem;
    border-radius: 1.8rem;
    border: 1px dashed rgba(17, 16, 77, 0.2);
}

.hs-feedback-alt p {
    margin: 0 0 1.2rem;
    color: var(--dt-base-color);
    font-size: 1.45rem;
}

/* Map */
.hs-map {
    position: relative;
    aspect-ratio: 21 / 8;
    border-radius: 2.4rem;
    overflow: hidden;
    background: var(--hs-white);
    box-shadow: 0 2.4rem 5rem rgba(11, 10, 58, 0.14), 0 0 0 1px var(--hs-line);
}

.hs-map iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    filter: saturate(0.9);
}

.hs-map-link {
    position: absolute;
    right: 2rem;
    bottom: 2rem;
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    padding: 1.1rem 1.8rem;
    border-radius: 99rem;
    background: var(--hs-navy);
    color: var(--hs-white);
    font-family: var(--dt-title-font);
    font-size: 1.4rem;
    font-weight: 800;
    text-decoration: none;
    box-shadow: 0 1rem 2.4rem rgba(11, 10, 58, 0.3);
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease);
}

.hs-map-link:hover,
.hs-map-link:focus-visible {
    background: var(--hs-green);
    color: var(--hs-navy);
    transform: translateY(-2px);
    text-decoration: none;
}

/* =====================================================================
   Forms – extras (shared field styles come from the home enquiry block)
   ===================================================================== */

.hs-form-wrap {
    position: relative;
}

.hs-hp {
    position: absolute;
    left: -999em;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.hs-field > span em {
    color: #d23c3c;
    font-style: normal;
}

.hs-form-status {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin: 0 0 1.8rem;
    padding: 1.4rem 1.6rem;
    border-radius: 1.2rem;
    font-size: 1.45rem;
    font-weight: 700;
    line-height: 1.5;
    animation: hsRise 0.4s var(--hs-ease) both;
}

.hs-form-status i {
    margin-top: 0.2rem;
    font-size: 1.6rem;
}

.hs-form-status.is-success {
    background: #eef9e3;
    color: #2f6b00;
}

.hs-form-status.is-error {
    background: #fff1f1;
    color: #b42318;
}

.hs-form-error {
    margin: -0.4rem 0 1.2rem;
    padding: 1rem 1.4rem;
    border-radius: 1rem;
    background: #fff1f1;
    color: #b42318;
    font-size: 1.4rem;
    font-weight: 700;
}

.hs-form.is-sending .hs-cta--submit {
    opacity: 0.7;
    pointer-events: none;
}

.hs-form.is-sending .hs-cta--submit i {
    animation: hsSpin 0.8s linear infinite;
}

.hs-form.is-sent .hs-enquiry-row,
.hs-form.is-sent .hs-field,
.hs-form.is-sent .hs-rating,
.hs-form.is-sent .hs-enquiry-actions,
.hs-form.is-sent .hs-enquiry-note {
    display: none;
}

.hs-form-done {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.2rem;
    padding: 2rem 1rem 1rem;
    text-align: center;
    animation: hsRise 0.5s var(--hs-ease) both;
}

.hs-form-done-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 7.2rem;
    height: 7.2rem;
    border-radius: 50%;
    background: var(--hs-green);
    color: var(--hs-navy);
    font-size: 3rem;
    animation: hsPop 0.6s var(--hs-ease) both;
}

.hs-form-done h4 {
    margin: 0.6rem 0 0;
    color: var(--hs-navy);
    font-size: 2.2rem;
    font-weight: 800;
}

.hs-form-done p {
    margin: 0;
    color: var(--dt-base-color);
    font-size: 1.5rem;
    line-height: 1.6;
}

.hs-form-done .hs-btn-row {
    justify-content: center;
    margin-top: 1rem;
}

/* Field error state */
.hs-form .is-invalid {
    border-color: #d23c3c !important;
    box-shadow: 0 0 0 0.4rem rgba(210, 60, 60, 0.12) !important;
}

/* Star rating */
.hs-rating {
    margin: 0 0 1.8rem;
    padding: 1.8rem 2rem;
    border: 1px solid rgba(17, 16, 77, 0.14);
    border-radius: 1.4rem;
    background: var(--dt-gray2-color, #f7f7fb);
}

.hs-rating legend {
    float: left;
    width: 100%;
    margin: 0 0 1rem;
    padding: 0;
    color: var(--hs-navy);
    font-family: var(--dt-title-font);
    font-size: 1.3rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.hs-rating legend em {
    color: #d23c3c;
    font-style: normal;
}

.hs-rating-stars {
    display: inline-flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    gap: 0.4rem;
    clear: both;
}

.hs-rating-stars input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.hs-rating-stars label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.4rem;
    height: 4.4rem;
    border-radius: 1.2rem;
    color: #c9cad8;
    font-size: 2.4rem;
    cursor: pointer;
    transition: color var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease), background-color var(--hs-dur) var(--hs-ease);
}

.hs-rating-stars label:hover,
.hs-rating-stars label:hover ~ label,
.hs-rating-stars input:checked ~ label {
    color: #f5b301;
}

.hs-rating-stars label:hover {
    transform: scale(1.15);
}

.hs-rating-stars input:focus-visible + label {
    background: var(--hs-green-tint);
}

.hs-rating-label {
    display: inline-block;
    margin-left: 1.2rem;
    color: var(--hs-navy);
    font-size: 1.5rem;
    font-weight: 700;
    vertical-align: middle;
}


/* "Send on WhatsApp" submit button */
.hs-enquiry-actions button.hs-cta--wa,
.hs-form-done .hs-cta--wa {
    background: #25d366;
    color: #0b3d1f;
    box-shadow: 0 0.6rem 1.8rem rgba(37, 211, 102, 0.35);
}

.hs-enquiry-actions button.hs-cta--wa:hover,
.hs-enquiry-actions button.hs-cta--wa:focus-visible,
.hs-form-done .hs-cta--wa:hover,
.hs-form-done .hs-cta--wa:focus-visible {
    background: #1ebe5b;
    color: var(--hs-white);
    box-shadow: 0 1rem 2.6rem rgba(37, 211, 102, 0.45);
    transform: translateY(-2px);
}

.hs-form-done .hs-cta--wa {
    text-decoration: none;
}

/* Compact form (service sidebar) */
.hs-form-wrap--compact .hs-enquiry-row {
    grid-template-columns: 1fr;
    gap: 0;
}

/* =====================================================================
   Floating WhatsApp button
   ===================================================================== */

.hs-wa-float {
    position: fixed;
    right: 2rem;
    bottom: 2rem;
    z-index: 990;
    display: inline-flex;
    align-items: center;
    gap: 0;
    height: 5.8rem;
    padding: 0 0.6rem 0 0;
    border-radius: 99rem;
    background: #25d366;
    color: var(--hs-white);
    text-decoration: none;
    box-shadow: 0 1rem 3rem rgba(37, 211, 102, 0.45), 0 0.4rem 1rem rgba(0, 0, 0, 0.15);
    transition: transform 0.35s var(--hs-ease), box-shadow 0.35s var(--hs-ease), gap 0.35s var(--hs-ease);
    animation: hsRise 0.6s var(--hs-ease) 1.2s both;
}

.hs-wa-float:hover,
.hs-wa-float:focus-visible {
    transform: translateY(-0.3rem) scale(1.03);
    color: var(--hs-white);
    box-shadow: 0 1.6rem 4rem rgba(37, 211, 102, 0.55), 0 0.6rem 1.4rem rgba(0, 0, 0, 0.2);
}

.hs-wa-float-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 5.8rem;
    height: 5.8rem;
    border-radius: 50%;
    font-size: 3rem;
}

.hs-wa-float-icon::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid rgba(37, 211, 102, 0.8);
    animation: hsPulse 2.2s ease-out infinite;
}

.hs-wa-float-text {
    max-width: 0;
    padding-right: 0;
    overflow: hidden;
    white-space: nowrap;
    font-family: var(--dt-title-font);
    font-size: 1.5rem;
    font-weight: 800;
    transition: max-width 0.4s var(--hs-ease), padding 0.4s var(--hs-ease);
}

.hs-wa-float:hover .hs-wa-float-text,
.hs-wa-float:focus-visible .hs-wa-float-text,
.hs-wa-float.is-open .hs-wa-float-text {
    max-width: 16rem;
    padding-right: 1.6rem;
}

body.dt_mobilenav-mainmenu--active .hs-wa-float,
body.dt_header-search--active .hs-wa-float {
    visibility: hidden;
}

#dt_uptop {
    bottom: 9.4rem;
}

/* =====================================================================
   404
   ===================================================================== */

.hs-404 {
    max-width: 72rem;
    margin: 4rem auto 2rem;
    text-align: center;
}

.hs-404-code {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.6rem;
    margin-bottom: 2rem;
    color: var(--hs-navy);
    font-family: var(--dt-title-font);
    font-size: 11rem;
    font-weight: 800;
    line-height: 1;
}

.hs-404-code i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 9rem;
    height: 9rem;
    border-radius: 2.4rem;
    background: var(--hs-green);
    color: var(--hs-navy);
    font-size: 4rem;
    animation: hsFloat 5s ease-in-out infinite;
}

.hs-404 h2 {
    margin: 0 0 1rem;
    color: var(--hs-navy);
    font-size: 3rem;
    font-weight: 800;
}

.hs-404 p {
    margin: 0 auto;
    max-width: 52rem;
    color: var(--dt-base-color);
    font-size: 1.6rem;
    line-height: 1.7;
}

.hs-404-search {
    display: flex;
    gap: 1rem;
    max-width: 52rem;
    margin: 2.8rem auto 0;
}

.hs-404-search input[type="search"] {
    flex: 1 1 auto;
    min-height: 5.2rem;
    padding: 0 1.8rem;
    border: 1px solid rgba(17, 16, 77, 0.14);
    border-radius: 99rem;
    background: var(--dt-gray2-color, #f7f7fb);
    font-size: 1.5rem;
    outline: 0;
}

.hs-404-search input[type="search"]:focus {
    border-color: var(--hs-green);
    box-shadow: 0 0 0 0.4rem var(--hs-green-tint);
}

.hs-404-search button.hs-cta {
    border: 0;
    cursor: pointer;
}

.hs-404 .hs-btn-row {
    justify-content: center;
}

/* Service cards without media (404 / compact) */
.hs-svc-grid--compact .hs-svc-card {
    padding: 2.8rem 2.6rem 0;
}

.hs-svc-icon--plain {
    position: static;
    margin-bottom: 0.4rem;
}

.hs-svc-grid--compact .hs-svc-body {
    padding: 2rem 0 2.6rem;
}

/* Grid variants for the block version (3 / 2 per row) */
.hs-block .hs-svc-grid--3 .hs-svc-card { grid-column: span 2; }
.hs-block .hs-svc-grid--2 .hs-svc-card { grid-column: span 3; }
a.hs-svc-media { display: block; }

/* =====================================================================
   Keyframes
   ===================================================================== */

@keyframes hsBannerZoom {
    from { transform: scale(1.02); }
    to   { transform: scale(1.14); }
}

@keyframes hsDriftSlow {
    from { transform: translate3d(0, 0, 0) rotate(0deg); }
    to   { transform: translate3d(-2rem, 1.8rem, 0) rotate(16deg); }
}

@keyframes hsRise {
    from { opacity: 0; transform: translateY(2.4rem); }
    to   { opacity: 1; transform: none; }
}

@keyframes hsFloat {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-1rem); }
}

@keyframes hsPulse {
    0%   { transform: scale(1); opacity: 0.9; }
    100% { transform: scale(1.6); opacity: 0; }
}

@keyframes hsSpin {
    to { transform: rotate(360deg); }
}

@keyframes hsPop {
    0%   { transform: scale(0.4); opacity: 0; }
    70%  { transform: scale(1.1); opacity: 1; }
    100% { transform: scale(1); }
}

/* =====================================================================
   Responsive
   ===================================================================== */

@media (max-width: 1199.98px) {
    .hs-feature-grid--4 { grid-template-columns: repeat(2, 1fr); }
    .hs-stats { grid-template-columns: repeat(2, 1fr); }
    .hs-contact-cards { grid-template-columns: repeat(2, 1fr); }
    .hs-stepper { grid-template-columns: repeat(2, 1fr); gap: 4rem 3rem; }
    .hs-stepper-item::after { display: none; }
    .hs-service-bottom { grid-template-columns: 1fr; }
    .hs-service-form { position: static; }
}

@media (max-width: 991.98px) {
    .hs-banner { min-height: 32rem; padding: 8rem 0 6rem; }
    .hs-banner--service { min-height: 38rem; }
    .hs-block { padding: 5rem 0; }
    .hs-intro,
    .hs-service-intro { grid-template-columns: 1fr; gap: 4rem; }
    .hs-block--intro.is-reverse .hs-intro-media { order: 0; }
    .hs-intro-media { max-width: 56rem; }
    .hs-feature-grid,
    .hs-work { grid-template-columns: repeat(2, 1fr); }
    .hs-areas { grid-template-columns: 1fr; }
    .hs-contact-layout,
    .hs-feedback-layout { grid-template-columns: 1fr; }
    .hs-contact-side .hs-contact-cards--1 { grid-template-columns: repeat(2, 1fr); }
    .hs-cta-band { grid-template-columns: 1fr; padding: 4rem; }
    .hs-cta-band-actions { justify-content: flex-start; }
    .hs-map { aspect-ratio: 16 / 9; }
    .hs-block .hs-svc-grid--3 .hs-svc-card { grid-column: span 3; }
}

@media (max-width: 767.98px) {
    .hs-banner-title { font-size: 3.4rem; }
    .hs-banner-text { font-size: 1.55rem; }
    .hs-block { padding: 4rem 0; }
    .hs-block .hs-sec-head { margin-bottom: 3rem; }
    .hs-intro-text .hs-sec-title,
    .hs-service-intro-text .hs-sec-title { font-size: 3rem; }
    .hs-feature-grid,
    .hs-feature-grid--4,
    .hs-feature-grid--2,
    .hs-check-grid,
    .hs-stepper,
    .hs-stats,
    .hs-contact-cards,
    .hs-contact-side .hs-contact-cards--1,
    .hs-service-others ul { grid-template-columns: 1fr; }
    .hs-rich .hs-highlight { grid-template-columns: 1fr; }
    .hs-block .hs-svc-grid--3 .hs-svc-card,
    .hs-block .hs-svc-grid--2 .hs-svc-card { grid-column: span 6; }
    .hs-cta-band { padding: 3.2rem 2.6rem; border-radius: 2rem; }
    .hs-cta-band h2 { font-size: 2.6rem; }
    .hs-cta-band-actions .hs-cta { width: 100%; }
    .hs-intro-media { padding: 0 3rem 4rem 0; }
    .hs-media-badge { left: 1.2rem; bottom: 6rem; padding: 1rem 1.4rem 1rem 1rem; font-size: 1.3rem; }
    .hs-media-badge--top { top: 1.2rem; bottom: auto; }
    .hs-service-intro-media .hs-media-badge { bottom: 0; }
    .hs-404-code { font-size: 8rem; }
    .hs-404-code i { width: 7rem; height: 7rem; font-size: 3rem; }
    .hs-404-search { flex-direction: column; }
    .hs-wa-float { right: 1.4rem; bottom: 1.4rem; height: 5.4rem; }
    .hs-wa-float-icon { width: 5.4rem; height: 5.4rem; font-size: 2.8rem; }
    .hs-block--values { padding: 6rem 0; }
    .hs-faq-group-link { text-align: left; }
}

@media (max-width: 575.98px) {
    .hs-work { grid-template-columns: 1fr; }
    .hs-banner { min-height: 28rem; padding: 7rem 0 5rem; }
    .hs-banner-actions .hs-cta { width: 100%; }
    .hs-btn-row .hs-cta { width: 100%; }
    .hs-rating-stars label { width: 4rem; height: 4rem; font-size: 2.2rem; }
    .hs-rating-label { display: block; margin: 0.8rem 0 0; }
}

/* =====================================================================
   Reduced motion
   ===================================================================== */

@media (prefers-reduced-motion: reduce) {
    .hs-banner-bg,
    .hs-banner-shapes span,
    .hs-cta-band-shapes span,
    .hs-media-small,
    .hs-404-code i,
    .hs-wa-float,
    .hs-wa-float-icon::before {
        animation: none !important;
    }
    .hs-crumbs ol,
    .hs-banner-eyebrow,
    .hs-banner-title,
    .hs-banner-text,
    .hs-banner-actions {
        animation: none !important;
        opacity: 1;
    }
    .hs-js .hs-reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

/* =====================================================================
   Header search – compact dropdown (replaces the full-screen overlay)
   ===================================================================== */

.hs-search-item {
    position: relative;
}

.header--hs .hs-search-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 4.6rem;
    height: 4.6rem;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.06);
    color: var(--hs-white);
    font-size: 1.6rem;
    cursor: pointer;
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease), border-color var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease);
}

.header--hs .hs-search-toggle:hover,
.header--hs .hs-search-toggle:focus-visible,
.hs-search-item.is-open .hs-search-toggle {
    background: var(--hs-green);
    border-color: var(--hs-green);
    color: var(--hs-navy);
    transform: translateY(-1px);
}

.hs-search-panel {
    position: absolute;
    top: calc(100% + 1.4rem);
    right: 0;
    z-index: 120;
    width: min(42rem, calc(100vw - 3rem));
    padding: 1.6rem;
    border-radius: 1.8rem;
    background: var(--hs-white);
    box-shadow: 0 2.4rem 6rem rgba(11, 10, 58, 0.24), 0 0 0 1px var(--hs-line);
    opacity: 0;
    transform: translateY(-0.8rem) scale(0.98);
    transform-origin: top right;
    transition: opacity 0.2s var(--hs-ease), transform 0.2s var(--hs-ease);
    pointer-events: none;
}

.hs-search-item.is-open .hs-search-panel {
    opacity: 1;
    transform: none;
    pointer-events: auto;
}

.hs-search-panel::before {
    content: "";
    position: absolute;
    top: -0.7rem;
    right: 1.6rem;
    width: 1.4rem;
    height: 1.4rem;
    border-radius: 0.3rem 0 0 0;
    background: var(--hs-white);
    transform: rotate(45deg);
}

.hs-search-form {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.hs-search-icon {
    position: absolute;
    left: 1.5rem;
    color: #9a9ab0;
    font-size: 1.4rem;
    pointer-events: none;
}

.hs-search-panel .hs-search-field {
    flex: 1 1 auto;
    width: 100%;
    min-height: 4.8rem;
    padding: 0 1.2rem 0 4rem;
    border: 1px solid rgba(17, 16, 77, 0.14);
    border-radius: 1.2rem;
    background: var(--dt-gray2-color, #f7f7fb);
    color: var(--hs-navy);
    font-family: var(--dt-base-font);
    font-size: 1.5rem;
    outline: 0;
    transition: border-color var(--hs-dur) var(--hs-ease), box-shadow var(--hs-dur) var(--hs-ease), background-color var(--hs-dur) var(--hs-ease);
}

.hs-search-panel .hs-search-field:focus {
    border-color: var(--hs-green);
    background: var(--hs-white);
    box-shadow: 0 0 0 0.4rem var(--hs-green-tint);
}

.hs-search-panel .hs-search-go {
    flex: 0 0 auto;
    min-height: 4.8rem;
    padding: 0 1.8rem;
    border: 0;
    border-radius: 1.2rem;
    background: var(--hs-navy);
    color: var(--hs-white);
    font-family: var(--dt-title-font);
    font-size: 1.4rem;
    font-weight: 800;
    cursor: pointer;
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease);
}

.hs-search-panel .hs-search-go:hover,
.hs-search-panel .hs-search-go:focus-visible {
    background: var(--hs-green);
    color: var(--hs-navy);
}

.hs-search-close {
    display: none;
}

.hs-search-results {
    display: flex;
    flex-direction: column;
    margin-top: 0.6rem;
}

.hs-search-results.is-loading::after {
    content: "";
    display: block;
    height: 0.3rem;
    margin: 1rem 0.4rem 0;
    border-radius: 0.3rem;
    background: linear-gradient(90deg, var(--hs-green-tint), var(--hs-green), var(--hs-green-tint));
    background-size: 200% 100%;
    animation: hsSearchBar 1s linear infinite;
}

@keyframes hsSearchBar {
    from { background-position: 200% 0; }
    to   { background-position: -200% 0; }
}

.hs-search-result {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    padding: 1.1rem 1.2rem;
    border-radius: 1.1rem;
    color: var(--hs-navy);
    text-decoration: none;
    transition: background-color var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease);
}

.hs-search-result:hover,
.hs-search-result:focus-visible {
    background: var(--dt-gray2-color, #f7f7fb);
    transform: translateX(0.2rem);
    outline: none;
}

.hs-search-result i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 3.4rem;
    height: 3.4rem;
    border-radius: 1rem;
    background: var(--hs-green-tint);
    color: var(--hs-green-dark);
    font-size: 1.3rem;
}

.hs-search-result span {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.hs-search-result strong {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.3;
}

.hs-search-result small {
    color: var(--dt-base-color);
    font-size: 1.25rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hs-search-none {
    margin: 1.2rem 0.4rem 0.4rem;
    color: var(--dt-base-color);
    font-size: 1.4rem;
}

.hs-search-quick {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.6rem;
    margin-top: 1.2rem;
    padding-top: 1.2rem;
    border-top: 1px solid var(--hs-line);
    font-size: 1.3rem;
}

.hs-search-quick > span {
    color: var(--dt-base-color);
    font-weight: 700;
}

.hs-search-quick a {
    padding: 0.5rem 1rem;
    border-radius: 99rem;
    background: var(--dt-gray2-color, #f7f7fb);
    color: var(--hs-navy);
    font-weight: 700;
    text-decoration: none;
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease);
}

.hs-search-quick a:hover {
    background: var(--hs-navy);
    color: var(--hs-white);
}

/* Mobile: the panel sits under the whole header bar */
@media (max-width: 991.98px) {
    .hs-search-item {
        position: static;
    }
    .hs-search-panel {
        top: calc(100% + 1.2rem);
        right: 0;
        left: 0;
        width: auto;
        margin: 0 auto;
        max-width: calc(100vw - 2.4rem);
    }
    .hs-search-panel::before {
        display: none;
    }
    .hs-search-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 4.8rem;
        height: 4.8rem;
        border: 1px solid rgba(17, 16, 77, 0.12);
        border-radius: 1.2rem;
        background: transparent;
        color: var(--hs-navy);
        cursor: pointer;
    }
    .hs-search-panel .hs-search-go {
        display: none;
    }
}

/* The parent theme's full-screen search overlay is no longer used */
.search--header {
    display: none !important;
}

/* =====================================================================
   Hritika Assistant – chat widget (bottom right)
   ===================================================================== */

.hs-bot {
    position: fixed;
    right: 2.4rem;
    bottom: 2.4rem;
    z-index: 995;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1.4rem;
    font-family: var(--dt-base-font);
    /* The wrapper is as tall as the (closed) chat panel, so it would sit on
       top of the page and swallow every tap – on phones that covered the
       whole enquiry form. Only the launcher and the open panel take input. */
    pointer-events: none;
}

.hs-bot-launcher,
.hs-bot[data-state="open"] .hs-bot-panel {
    pointer-events: auto;
}

/* ---------- Launcher ---------- */

.hs-bot-launcher {
    position: relative;
    display: inline-flex;
    align-items: center;
    height: 6rem;
    padding: 0;
    border: 0;
    border-radius: 99rem;
    background: linear-gradient(135deg, #16155c 0%, #0c0b3d 100%);
    color: var(--hs-white);
    cursor: pointer;
    box-shadow: 0 1.4rem 3.4rem rgba(11, 10, 58, 0.38);
    transition: transform 0.3s var(--hs-ease), box-shadow 0.3s var(--hs-ease);
    animation: hsRise 0.6s var(--hs-ease) 1s both;
}

.hs-bot-launcher:hover,
.hs-bot-launcher:focus-visible {
    transform: translateY(-0.3rem);
    box-shadow: 0 2rem 4.4rem rgba(11, 10, 58, 0.46);
}

.hs-bot-launcher-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 6rem;
    height: 6rem;
    border-radius: 50%;
    color: var(--hs-green);
    font-size: 2.4rem;
}

.hs-bot-launcher-icon i {
    position: absolute;
    transition: opacity 0.22s var(--hs-ease), transform 0.22s var(--hs-ease);
}

.hs-bot-launcher-icon .fa-times {
    opacity: 0;
    transform: rotate(-90deg) scale(0.6);
}

.hs-bot[data-state="open"] .hs-bot-launcher-icon .fa-comment-dots {
    opacity: 0;
    transform: rotate(90deg) scale(0.6);
}

.hs-bot[data-state="open"] .hs-bot-launcher-icon .fa-times {
    opacity: 1;
    transform: none;
}

.hs-bot-launcher-icon::before {
    content: "";
    position: absolute;
    inset: 0.5rem;
    border-radius: 50%;
    border: 2px solid rgba(146, 207, 57, 0.5);
    animation: hsPulse 2.6s ease-out infinite;
}

.hs-bot[data-state="open"] .hs-bot-launcher-icon::before {
    display: none;
}

.hs-bot-launcher-text {
    max-width: 0;
    padding-right: 0;
    overflow: hidden;
    white-space: nowrap;
    font-family: var(--dt-title-font);
    font-size: 1.5rem;
    font-weight: 800;
    transition: max-width 0.35s var(--hs-ease), padding 0.35s var(--hs-ease);
}

.hs-bot-launcher:hover .hs-bot-launcher-text,
.hs-bot-launcher:focus-visible .hs-bot-launcher-text {
    max-width: 18rem;
    padding-right: 2.2rem;
}

.hs-bot[data-state="open"] .hs-bot-launcher-text {
    max-width: 0;
    padding-right: 0;
}

.hs-bot-badge {
    position: absolute;
    top: 0.4rem;
    right: 0.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.9rem;
    height: 1.9rem;
    padding: 0 0.5rem;
    border-radius: 99rem;
    background: #e5484d;
    color: #fff;
    font-size: 1.1rem;
    font-weight: 800;
    box-shadow: 0 0 0 2px #0c0b3d;
}

.hs-bot[data-state="open"] .hs-bot-badge {
    display: none;
}

/* ---------- Panel ---------- */

.hs-bot-panel {
    order: -1;
    display: flex;
    flex-direction: column;
    width: min(39rem, calc(100vw - 4rem));
    height: min(60rem, calc(100vh - 14rem));
    border-radius: 2.4rem;
    background: #fbfbfe;
    box-shadow: 0 3.2rem 8rem rgba(11, 10, 58, 0.34), 0 0 0 1px rgba(17, 16, 77, 0.06);
    overflow: hidden;
    opacity: 0;
    transform: translateY(1.6rem) scale(0.96);
    transform-origin: bottom right;
    /* Hidden, not just transparent: an invisible panel must not be clickable. */
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.26s var(--hs-ease), transform 0.26s var(--hs-ease), visibility 0s linear 0.26s;
}

.hs-bot[data-state="open"] .hs-bot-panel {
    opacity: 1;
    transform: none;
    visibility: visible;
    transition: opacity 0.26s var(--hs-ease), transform 0.26s var(--hs-ease), visibility 0s;
}

/* Header */
.hs-bot-head {
    display: flex;
    align-items: center;
    gap: 1.3rem;
    flex: 0 0 auto;
    padding: 1.8rem 1.8rem 1.7rem;
    background: linear-gradient(135deg, #16155c 0%, #0c0b3d 100%);
    color: var(--hs-white);
}

.hs-bot-head-avatar {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 4.6rem;
    height: 4.6rem;
    border-radius: 1.5rem;
    background: linear-gradient(140deg, var(--hs-green), var(--hs-green-dark));
    color: #0c2000;
    font-size: 1.9rem;
}

.hs-bot-head-avatar b {
    position: absolute;
    right: -0.3rem;
    bottom: -0.3rem;
    width: 1.3rem;
    height: 1.3rem;
    border-radius: 50%;
    background: #2ecc71;
    box-shadow: 0 0 0 2.5px #12114e;
}

.hs-bot-head-text {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    flex: 1 1 auto;
    min-width: 0;
}

.hs-bot-head-text strong {
    font-family: var(--dt-title-font);
    font-size: 1.72rem;
    font-weight: 800;
    letter-spacing: 0.01em;
    line-height: 1.2;
}

.hs-bot-head-text small {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    color: rgba(255, 255, 255, 0.7);
    font-size: 1.24rem;
    line-height: 1.3;
}

.hs-bot-head-text small i {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 50%;
    background: #2ecc71;
    box-shadow: 0 0 0 0.3rem rgba(46, 204, 113, 0.22);
}

.hs-bot .hs-bot-head-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 3.6rem;
    min-width: 3.6rem;
    max-width: 3.6rem;
    height: 3.6rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    color: var(--hs-white);
    font-size: 1.3rem;
    line-height: 1;
    cursor: pointer;
    transition: background-color var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease);
}

.hs-bot .hs-bot-head-close:hover {
    background: rgba(255, 255, 255, 0.22);
    transform: translateY(1px);
}

/* Message area */
.hs-bot-body {
    flex: 1 1 auto;
    min-height: 0;
    padding: 2rem 1.8rem 1.4rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    background:
        radial-gradient(30rem 22rem at 110% -10%, rgba(146, 207, 57, 0.1), transparent 70%),
        radial-gradient(26rem 20rem at -20% 108%, rgba(17, 16, 77, 0.06), transparent 70%),
        #fbfbfe;
}

.hs-bot-body::-webkit-scrollbar {
    width: 0.6rem;
}

.hs-bot-body::-webkit-scrollbar-thumb {
    border-radius: 99rem;
    background: rgba(17, 16, 77, 0.16);
}

.hs-bot-msg {
    display: flex;
    align-items: flex-end;
    gap: 0.9rem;
    margin-bottom: 1.2rem;
    animation: hsBotIn 0.28s var(--hs-ease) both;
}

.hs-bot-msg.is-grouped {
    margin-top: -0.6rem;
}

.hs-bot-msg.is-grouped .hs-bot-avatar {
    visibility: hidden;
}

@keyframes hsBotIn {
    from { opacity: 0; transform: translateY(0.7rem); }
    to   { opacity: 1; transform: none; }
}

.hs-bot-msg--user {
    flex-direction: row-reverse;
}

.hs-bot-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 3.2rem;
    height: 3.2rem;
    border-radius: 50%;
    background: linear-gradient(140deg, var(--hs-green), var(--hs-green-dark));
    color: #0c2000;
    font-size: 1.25rem;
}

.hs-bot-bubble {
    max-width: 85%;
    padding: 1.2rem 1.5rem;
    border-radius: 1.8rem 1.8rem 1.8rem 0.5rem;
    background: var(--hs-white);
    color: #22213f;
    font-size: 1.44rem;
    line-height: 1.62;
    box-shadow: 0 0.4rem 1.4rem rgba(11, 10, 58, 0.07), 0 0 0 1px rgba(17, 16, 77, 0.05);
}

.hs-bot-msg--user .hs-bot-bubble {
    border-radius: 1.8rem 1.8rem 0.5rem 1.8rem;
    background: linear-gradient(135deg, #1a1966, #12114e);
    color: var(--hs-white);
    box-shadow: 0 0.6rem 1.8rem rgba(11, 10, 58, 0.22);
}

.hs-bot-bubble p {
    margin: 0 0 0.75rem;
}

.hs-bot-bubble p:last-child {
    margin-bottom: 0;
}

.hs-bot-bubble .hs-bot-li {
    position: relative;
    margin-bottom: 0.4rem;
    padding-left: 1.7rem;
}

.hs-bot-bubble .hs-bot-li::before {
    content: "";
    position: absolute;
    left: 0.2rem;
    top: 0.82em;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: var(--hs-green);
}

.hs-bot-link {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    margin-top: 1rem;
    padding: 0.8rem 1.4rem;
    border-radius: 99rem;
    background: var(--hs-navy);
    color: var(--hs-white);
    font-size: 1.32rem;
    font-weight: 700;
    text-decoration: none;
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease);
}

.hs-bot-link:hover {
    background: var(--hs-green);
    color: var(--hs-navy);
    transform: translateX(0.2rem);
}

.hs-bot-link i {
    font-size: 1.05rem;
}

/* Typing */
.hs-bot-typing .hs-bot-bubble {
    display: inline-flex;
    gap: 0.45rem;
    padding: 1.4rem 1.5rem;
}

.hs-bot-typing .hs-bot-bubble span {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 50%;
    background: #c3c4d6;
    animation: hsBotDot 1.1s infinite ease-in-out;
}

.hs-bot-typing .hs-bot-bubble span:nth-child(2) { animation-delay: 0.16s; }
.hs-bot-typing .hs-bot-bubble span:nth-child(3) { animation-delay: 0.32s; }

@keyframes hsBotDot {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.55; }
    30%           { transform: translateY(-0.45rem); opacity: 1; }
}

/* Suggestion chips */
.hs-bot-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin: 0 0 1.4rem 4.1rem;
    animation: hsBotIn 0.3s var(--hs-ease) both;
}

.hs-bot .hs-bot-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.85rem 1.4rem;
    border: 1px solid rgba(17, 16, 77, 0.14);
    border-radius: 99rem;
    background: var(--hs-white);
    color: var(--hs-navy);
    font-family: var(--dt-base-font);
    font-size: 1.32rem;
    font-weight: 600;
    line-height: 1.3;
    text-align: left;
    cursor: pointer;
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease), border-color var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease);
}

.hs-bot .hs-bot-chip i {
    color: var(--hs-green-dark);
    font-size: 1.15rem;
}

.hs-bot .hs-bot-chip:hover {
    background: var(--hs-navy);
    border-color: var(--hs-navy);
    color: var(--hs-white);
    transform: translateY(-0.1rem);
}

.hs-bot .hs-bot-chip:hover i {
    color: var(--hs-green);
}

.hs-bot .hs-bot-chip.is-primary {
    background: var(--hs-green);
    border-color: var(--hs-green);
    color: #10240a;
    font-weight: 800;
}

.hs-bot .hs-bot-chip.is-primary i {
    color: #10240a;
}

.hs-bot .hs-bot-chip.is-primary:hover {
    background: var(--hs-navy);
    border-color: var(--hs-navy);
    color: var(--hs-white);
}

/* In-chat form */
.hs-bot-form {
    margin: 0 0 1.4rem 4.1rem;
    padding: 1.6rem;
    border-radius: 1.8rem;
    background: var(--hs-white);
    box-shadow: 0 1rem 2.6rem rgba(11, 10, 58, 0.1), 0 0 0 1px rgba(17, 16, 77, 0.06);
    animation: hsBotIn 0.3s var(--hs-ease) both;
}

.hs-bot-form-head {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.3rem;
}

.hs-bot-form-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 3.8rem;
    height: 3.8rem;
    border-radius: 1.2rem;
    background: var(--hs-green-tint);
    color: var(--hs-green-dark);
    font-size: 1.5rem;
}

.hs-bot-form-head > span:last-child {
    display: flex;
    flex-direction: column;
}

.hs-bot-form-head strong {
    color: var(--hs-navy);
    font-family: var(--dt-title-font);
    font-size: 1.58rem;
    font-weight: 800;
}

.hs-bot-form-head small {
    color: var(--dt-base-color);
    font-size: 1.22rem;
}

.hs-bot-field {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 0.9rem;
}

.hs-bot-field > span {
    color: #6a6d86;
    font-size: 1.16rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.hs-bot-form input,
.hs-bot-form select,
.hs-bot-form textarea {
    width: 100%;
    min-height: 4.4rem;
    padding: 0.9rem 1.2rem;
    border: 1px solid rgba(17, 16, 77, 0.13);
    border-radius: 1.1rem;
    background: #f7f7fb;
    color: var(--hs-navy);
    font-family: var(--dt-base-font);
    font-size: 1.4rem;
    outline: 0;
    transition: border-color var(--hs-dur) var(--hs-ease), box-shadow var(--hs-dur) var(--hs-ease), background-color var(--hs-dur) var(--hs-ease);
}

.hs-bot-form textarea {
    min-height: 6.4rem;
    resize: vertical;
}

.hs-bot-form input:focus,
.hs-bot-form select:focus,
.hs-bot-form textarea:focus {
    border-color: var(--hs-green);
    background: var(--hs-white);
    box-shadow: 0 0 0 0.35rem var(--hs-green-tint);
}

.hs-bot-error {
    margin: 0 0 0.9rem;
    color: #b42318;
    font-size: 1.26rem;
    font-weight: 700;
}

.hs-bot-form-actions {
    display: flex;
    gap: 0.8rem;
    margin-top: 0.3rem;
}

.hs-bot .hs-bot-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.7rem;
    flex: 1 1 auto;
    min-height: 4.6rem;
    padding: 0 1.6rem;
    border: 0;
    border-radius: 99rem;
    background: var(--hs-green-dark);
    color: var(--hs-white);
    font-family: var(--dt-title-font);
    font-size: 1.4rem;
    font-weight: 800;
    cursor: pointer;
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease);
}

.hs-bot .hs-bot-submit:hover {
    background: var(--hs-green);
    color: var(--hs-navy);
}

.hs-bot-form.is-sending .hs-bot-submit {
    opacity: 0.75;
    pointer-events: none;
}

.hs-bot-form.is-sending .hs-bot-submit i {
    animation: hsSpin 0.8s linear infinite;
}

.hs-bot .hs-bot-cancel {
    min-height: 4.6rem;
    padding: 0 1.5rem;
    border: 1px solid rgba(17, 16, 77, 0.14);
    border-radius: 99rem;
    background: transparent;
    color: #6a6d86;
    font-size: 1.34rem;
    font-weight: 700;
    cursor: pointer;
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease);
}

.hs-bot .hs-bot-cancel:hover {
    background: #f1f1f6;
    color: var(--hs-navy);
}

/* Success card */
.hs-bot-done {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    margin: 0 0 1.4rem 4.1rem;
    padding: 1.5rem 1.6rem;
    border-radius: 1.8rem;
    background: linear-gradient(135deg, rgba(146, 207, 57, 0.18), rgba(146, 207, 57, 0.08));
    box-shadow: 0 0 0 1px rgba(146, 207, 57, 0.4);
    animation: hsBotIn 0.3s var(--hs-ease) both;
}

.hs-bot-done-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    background: var(--hs-green);
    color: #10240a;
    font-size: 1.6rem;
    animation: hsPop 0.5s var(--hs-ease) both;
}

.hs-bot-done p {
    margin: 0;
    color: #25401a;
    font-size: 1.36rem;
    font-weight: 600;
    line-height: 1.55;
}

/* Composer */
.hs-bot-foot {
    display: flex;
    gap: 0.9rem;
    flex: 0 0 auto;
    padding: 1.3rem 1.6rem 1.6rem;
    background: var(--hs-white);
    box-shadow: 0 -0.6rem 2rem rgba(11, 10, 58, 0.06);
}

.hs-bot .hs-bot-input {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 4.8rem;
    padding: 0 1.6rem;
    border: 1px solid rgba(17, 16, 77, 0.12);
    border-radius: 99rem;
    background: #f5f5fa;
    color: var(--hs-navy);
    font-family: var(--dt-base-font);
    font-size: 1.44rem;
    outline: 0;
    transition: border-color var(--hs-dur) var(--hs-ease), box-shadow var(--hs-dur) var(--hs-ease), background-color var(--hs-dur) var(--hs-ease);
}

.hs-bot .hs-bot-input::placeholder {
    color: #9a9cb2;
}

.hs-bot .hs-bot-input:focus {
    border-color: var(--hs-green);
    background: var(--hs-white);
    box-shadow: 0 0 0 0.35rem var(--hs-green-tint);
}

.hs-bot .hs-bot-send {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 4.8rem;
    min-width: 4.8rem;
    height: 4.8rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: linear-gradient(140deg, var(--hs-green), var(--hs-green-dark));
    color: #10240a;
    font-size: 1.5rem;
    cursor: pointer;
    transition: transform var(--hs-dur) var(--hs-ease), box-shadow var(--hs-dur) var(--hs-ease);
    box-shadow: 0 0.6rem 1.6rem rgba(111, 185, 2, 0.35);
}

.hs-bot .hs-bot-send:hover {
    transform: scale(1.06);
    box-shadow: 0 0.9rem 2.2rem rgba(111, 185, 2, 0.45);
}

/* Keep the back-to-top button clear of the widget */
#dt_uptop {
    bottom: 9.8rem;
}

body.dt_mobilenav-mainmenu--active .hs-bot,
body.dt_header-search--active .hs-bot {
    visibility: hidden;
}

/* Out-specify the parent theme's generic button rules */
.hs-bot button,
.hs-search-panel button {
    box-shadow: none;
    text-transform: none;
    letter-spacing: normal;
}

.hs-bot .hs-bot-launcher {
    padding: 0;
}

/* ---------- Phones: bottom sheet ---------- */
@media (max-width: 575.98px) {
    .hs-bot {
        right: 1.4rem;
        bottom: 1.4rem;
        left: 1.4rem;
    }

    .hs-bot-panel {
        width: 100%;
        height: min(78vh, 58rem);
        border-radius: 2rem;
    }

    .hs-bot-launcher {
        height: 5.6rem;
    }

    .hs-bot-launcher-icon {
        width: 5.6rem;
        height: 5.6rem;
        font-size: 2.2rem;
    }

    .hs-bot-body {
        padding: 1.6rem 1.4rem 1.2rem;
    }

    .hs-bot-chips,
    .hs-bot-form,
    .hs-bot-done {
        margin-left: 0;
    }

    .hs-bot-bubble {
        max-width: 88%;
        font-size: 1.5rem;
    }

    .hs-bot .hs-bot-input,
    .hs-bot-form input,
    .hs-bot-form select,
    .hs-bot-form textarea {
        font-size: 1.6rem; /* iOS does not zoom at 16px */
    }
}

@media (prefers-reduced-motion: reduce) {
    .hs-bot-launcher,
    .hs-bot-launcher-icon::before,
    .hs-bot-msg,
    .hs-bot-chips,
    .hs-bot-form,
    .hs-bot-done,
    .hs-bot-done-icon {
        animation: none !important;
    }
    .hs-bot-panel {
        transition: none;
    }
}

/* =====================================================================
   Search results page
   ===================================================================== */

.hs-block--results {
    max-width: 88rem;
    margin: 0 auto;
    padding-top: 5rem;
}

.hs-results-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1.6rem;
    margin-bottom: 3rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--hs-line);
}

.hs-results-count {
    margin: 0;
    color: var(--dt-base-color);
    font-size: 1.6rem;
}

.hs-results-count strong {
    color: var(--hs-navy);
}

.hs-results-form {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.hs-results-form > i {
    position: absolute;
    left: 1.6rem;
    color: #9a9ab0;
    font-size: 1.4rem;
    pointer-events: none;
}

.hs-results-form input[type="search"] {
    min-width: 26rem;
    min-height: 4.8rem;
    padding: 0 1.4rem 0 4.2rem;
    border: 1px solid rgba(17, 16, 77, 0.14);
    border-radius: 99rem;
    background: var(--dt-gray2-color, #f7f7fb);
    color: var(--hs-navy);
    font-size: 1.5rem;
    outline: 0;
    transition: border-color var(--hs-dur) var(--hs-ease), box-shadow var(--hs-dur) var(--hs-ease), background-color var(--hs-dur) var(--hs-ease);
}

.hs-results-form input[type="search"]:focus {
    border-color: var(--hs-green);
    background: var(--hs-white);
    box-shadow: 0 0 0 0.4rem var(--hs-green-tint);
}

.hs-results-form button.hs-cta {
    min-height: 4.8rem;
    padding: 0 2.2rem;
    border: 0;
    cursor: pointer;
}

.hs-results {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}

.hs-result {
    margin: 0;
}

.hs-result-link {
    display: flex;
    align-items: flex-start;
    gap: 1.6rem;
    padding: 2rem 2.2rem;
    border-radius: 1.8rem;
    background: var(--hs-white);
    color: var(--hs-navy);
    text-decoration: none;
    box-shadow: 0 0.2rem 0.6rem rgba(11, 10, 58, 0.04), 0 0 0 1px var(--hs-line);
    transition: transform 0.3s var(--hs-ease), box-shadow 0.3s var(--hs-ease);
}

.hs-result-link:hover,
.hs-result-link:focus-visible {
    transform: translateY(-0.3rem);
    box-shadow: 0 1.8rem 4rem rgba(11, 10, 58, 0.14), 0 0 0 1px rgba(146, 207, 57, 0.45);
}

.hs-result-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 4.8rem;
    height: 4.8rem;
    border-radius: 1.4rem;
    background: var(--hs-navy);
    color: var(--hs-green);
    font-size: 1.8rem;
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease), transform 0.3s var(--hs-ease);
}

.hs-result-link:hover .hs-result-icon {
    background: var(--hs-green);
    color: var(--hs-navy);
    transform: rotate(-6deg);
}

.hs-result-body {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    flex: 1 1 auto;
    min-width: 0;
}

.hs-result-crumb {
    color: var(--hs-green-dark);
    font-family: var(--dt-title-font);
    font-size: 1.2rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.hs-result-title {
    color: var(--hs-navy);
    font-family: var(--dt-title-font);
    font-size: 1.9rem;
    font-weight: 800;
    line-height: 1.3;
}

.hs-result-text {
    color: var(--dt-base-color);
    font-size: 1.45rem;
    line-height: 1.65;
}

.hs-result-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 3.4rem;
    height: 3.4rem;
    margin-top: 0.7rem;
    border-radius: 50%;
    background: var(--hs-navy-tint);
    color: var(--hs-navy);
    font-size: 1.2rem;
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease);
}

.hs-result-link:hover .hs-result-arrow {
    background: var(--hs-green);
    color: var(--hs-navy);
    transform: translateX(0.3rem);
}

/* No results */
.hs-noresults {
    padding: 4rem 2rem 1rem;
    text-align: center;
}

.hs-noresults-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 7.2rem;
    height: 7.2rem;
    margin-bottom: 2rem;
    border-radius: 50%;
    background: var(--hs-green-tint);
    color: var(--hs-green-dark);
    font-size: 2.6rem;
}

.hs-noresults h2 {
    margin: 0 0 1rem;
    color: var(--hs-navy);
    font-size: 2.6rem;
    font-weight: 800;
}

.hs-noresults p {
    max-width: 52rem;
    margin: 0 auto;
    color: var(--dt-base-color);
    font-size: 1.6rem;
    line-height: 1.7;
}

/* Pagination */
.hs-page--search .hs-pagination {
    margin-top: 3.4rem;
}

.hs-page--search .nav-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.8rem;
}

.hs-page--search .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 4.4rem;
    height: 4.4rem;
    padding: 0 1.2rem;
    border-radius: 1.2rem;
    background: var(--hs-white);
    color: var(--hs-navy);
    font-family: var(--dt-title-font);
    font-size: 1.5rem;
    font-weight: 800;
    text-decoration: none;
    box-shadow: 0 0 0 1px var(--hs-line);
    transition: background-color var(--hs-dur) var(--hs-ease), color var(--hs-dur) var(--hs-ease);
}

.hs-page--search .page-numbers:hover,
.hs-page--search .page-numbers.current {
    background: var(--hs-navy);
    color: var(--hs-white);
}

.hs-page--search .screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
}

@media (max-width: 767.98px) {
    .hs-results-head {
        flex-direction: column;
        align-items: stretch;
    }
    .hs-results-form input[type="search"] {
        min-width: 0;
        flex: 1 1 auto;
    }
    .hs-result-link {
        padding: 1.6rem;
        gap: 1.2rem;
    }
    .hs-result-icon {
        width: 4.2rem;
        height: 4.2rem;
        font-size: 1.6rem;
    }
    .hs-result-title {
        font-size: 1.7rem;
    }
    .hs-result-arrow {
        display: none;
    }
}

/* =====================================================================
   Mobile usability fixes
   ---------------------------------------------------------------------
   1. The header search panel used to be positioned against the <li> that
      holds the toggle. On phones that <li> is only ~40px wide (the parent
      theme keeps `.dt_navbar-search-item { position: relative }`), so the
      dropdown collapsed into a 40px-wide, 900px-tall strip of letters.
      Below 992px the panel is therefore `fixed` to the viewport instead and
      JS pins its top edge to the bottom of the header bar.
   2. Form controls inherit `1.5rem`, and the parent theme shrinks the root
      font to 8.8px on phones – i.e. 13px inputs, which makes mobile Safari
      and Chrome zoom in the moment a field is focused. The page then jumps
      and the next tap misses the field, so typing "does not work".
      16px is the documented threshold that stops that zoom.
   ===================================================================== */

@media (max-width: 991.98px) {

    /* --- 1. Search dropdown ------------------------------------------ */
    .hs-search-item .hs-search-panel {
        position: fixed;
        top: 7.2rem; /* JS replaces this with the real header bottom */
        right: 1.2rem;
        left: 1.2rem;
        z-index: 1210;
        width: auto;
        max-width: none;
        max-height: calc(100vh - 9rem);
        padding: 1.4rem;
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        transform-origin: top center;
        overscroll-behavior: contain;
    }

    .hs-search-scrim {
        position: fixed;
        inset: 0;
        z-index: 1200;
        background: rgba(11, 10, 58, 0.5);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.2s var(--hs-ease);
        -webkit-backdrop-filter: blur(2px);
        backdrop-filter: blur(2px);
    }

    .hs-search-item.is-open .hs-search-scrim {
        opacity: 1;
        pointer-events: auto;
    }

    .hs-search-panel .hs-search-field {
        min-height: 4.8rem;
        font-size: 16px;
    }

    .hs-search-results {
        margin-top: 0.4rem;
    }

    .hs-search-result {
        padding: 1.2rem 1rem;
    }

    .hs-search-quick {
        gap: 0.8rem 0.6rem;
    }

    /* --- 2. Typing on phones ----------------------------------------- */
    .hs-form input,
    .hs-form select,
    .hs-form textarea,
    .hs-results-form input[type="search"],
    .hs-404-search input[type="search"],
    .hs-bot input,
    .hs-bot textarea {
        font-size: 16px; /* never below 16px: stops the focus zoom */
        min-height: 48px;
    }

    .hs-form textarea {
        min-height: 110px;
        line-height: 1.45;
    }

    .hs-field {
        margin-bottom: 1.6rem;
    }

    .hs-field > span {
        font-size: 12.5px;
        letter-spacing: 0.03em;
    }

    /* Bigger, thumb-friendly buttons. */
    .hs-enquiry-actions button.hs-cta,
    .hs-enquiry-actions .hs-cta {
        min-height: 50px;
        width: 100%;
    }
}

/* Name + phone (and the feedback pairs) stack on small phones – two 140px
   boxes side by side are far too cramped to type into. */
@media (max-width: 599.98px) {
    .hs-enquiry-row,
    .hs-fb-row {
        grid-template-columns: 1fr;
        gap: 0;
    }
}

/* Don't let the floating WhatsApp / assistant buttons cover the last field. */
@media (max-width: 767.98px) {
    .hs-form-card,
    .hs-form-wrap {
        scroll-margin-top: 8rem;
    }
}

/* =====================================================================
   The entry point to the private eBilling portal (/rk/).
   Deliberately understated: a sign-in icon on its own in the header, a
   full-width row in the mobile menu and a quiet link in the footer.
   ===================================================================== */

.hs-rk-link {
    display: inline-flex;
    align-items: center;
    gap: 0.8rem;
    text-decoration: none;
    transition: color var(--hs-dur) var(--hs-ease), background-color var(--hs-dur) var(--hs-ease), border-color var(--hs-dur) var(--hs-ease), transform var(--hs-dur) var(--hs-ease);
}

.hs-rk-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 4.6rem;
    height: 4.6rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.06);
    color: var(--hs-white);
    font-size: 1.6rem;
}

/* Header: just the circular "RK" badge. */
.header--hs .hs-rk-link--head .hs-rk-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
}

.header--hs .hs-rk-link--head:hover .hs-rk-mark,
.header--hs .hs-rk-link--head:focus-visible .hs-rk-mark {
    background: var(--hs-green);
    border-color: var(--hs-green);
    color: var(--hs-navy);
    transform: translateY(-1px);
}

/* Mobile off-canvas menu: a full-width row, sitting directly under the
   contact block so it has to carry the same navy surface. */
.hs-offcanvas-rk {
    margin: 0;
    padding: 0 2rem 2rem;
    background: var(--hs-navy);
}

.hs-offcanvas-rk .hs-rk-link--block {
    margin-top: 0.4rem;
}

.hs-rk-link--block {
    width: 100%;
    padding: 1.1rem 1.4rem;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 1.4rem;
    background: rgba(255, 255, 255, 0.06);
    color: var(--hs-white);
    font-family: var(--dt-title-font);
    font-size: 1.45rem;
    font-weight: 700;
}

.hs-rk-link--block .hs-rk-mark {
    width: 3.6rem;
    height: 3.6rem;
    border-radius: 1.1rem;
    background: var(--hs-green);
    border-color: var(--hs-green);
    color: var(--hs-navy);
    font-size: 1.4rem;
}

.hs-rk-link--block:hover,
.hs-rk-link--block:focus-visible {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.3);
    color: var(--hs-white);
}

/* Footer legal row: a plain text link with a small badge. */
.hs-rk-link--foot {
    gap: 0.6rem;
    color: inherit;
    font-weight: 700;
}

.hs-rk-link--foot .hs-rk-mark {
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 0.8rem;
    background: rgba(255, 255, 255, 0.1);
    font-size: 1.1rem;
}

.hs-rk-link--foot:hover,
.hs-rk-link--foot:focus-visible {
    color: var(--hs-green);
}

.hs-rk-link--foot:hover .hs-rk-mark {
    background: var(--hs-green);
    color: var(--hs-navy);
}