:root {
        --ssh-green: #2fb44a;
        --ssh-green-dark: #1e8c38;
        --ssh-green-light: #e9f9ee;
        --ssh-black: #17191b;
        --ssh-gray: #5c6570;
        --ssh-white: #ffffff;
        --ssh-border: #e6e9ec;
        --ssh-bg-soft: #f6f8f7;
        --ssh-transition: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    }

    * {
        box-sizing: border-box;
    }

    body {
        margin: 0;
        font-family: "Inter", sans-serif;
        color: var(--ssh-black);
    }

    a {
        text-decoration: none;
    }

    ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    @media (prefers-reduced-motion: reduce) {
        * {
            animation: none !important;
            transition: none !important;
        }
    }

    /* ============================================
   SHARED
   ============================================ */
    .ssh-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        font-size: 14.5px;
        font-weight: 600;
        color: var(--ssh-green-dark);
        margin-bottom: 16px;
    }

    .ssh-eyebrow--center {
        justify-content: center;
    }

    .ssh-eyebrow__line {
        width: 26px;
        height: 2px;
        background: var(--ssh-green);
        display: inline-block;
    }

    .ssh-heading {
        font-size: clamp(28px, 3.4vw, 42px);
        line-height: 1.18;
        font-weight: 800;
        letter-spacing: -0.5px;
        margin: 0 0 20px;
        max-width: 560px;
    }

    .ssh-heading--center {
        max-width: 640px;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }

    /* Scroll reveal base states */
    [data-reveal] {
        opacity: 0;
        transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
        will-change: transform, opacity;
    }

    [data-reveal="left"] {
        transform: translateX(-36px);
    }

    [data-reveal="right"] {
        transform: translateX(36px);
    }

    [data-reveal="up"] {
        transform: translateY(28px);
    }

    [data-reveal].is-visible {
        opacity: 1;
        transform: translate(0, 0);
    }

    /* ============================================
   ABOUT SECTION
   ============================================ */
    .ssh-about {
        padding: 110px 24px;
        background: var(--ssh-white);
        overflow: hidden;
    }

    .ssh-about__inner {
        max-width: 1200px;
        margin: 0 auto;
        display: grid;
        grid-template-columns: 0.95fr 1.05fr;
        gap: 72px;
        align-items: center;
    }

    .ssh-about__media {
        position: relative;
        max-width: 460px;
    }

    .ssh-about__blob {
        position: absolute;
        top: 8%;
        left: -14%;
        width: 62%;
        height: 84%;
        background: var(--ssh-green);
        border-radius: 50%;
        z-index: 0;
        opacity: 0.9;
    }

    .ssh-about__frame {
        position: relative;
        z-index: 1;
        border-radius: 16px;
        overflow: hidden;
        box-shadow: 0 30px 60px -20px rgba(20, 40, 20, 0.35);
    }

    .ssh-about__img {
        display: block;
        width: 100%;
        height: 520px;
        object-fit: cover;
        transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .ssh-about__media:hover .ssh-about__img {
        transform: scale(1.05);
    }

    .ssh-about__badge {
        position: absolute;
        z-index: 2;
        right: -18px;
        bottom: 26px;
        background: var(--ssh-black);
        color: var(--ssh-white);
        border-radius: 14px;
        padding: 16px 20px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        box-shadow: 0 18px 40px -14px rgba(0, 0, 0, 0.5);
    }

    .ssh-about__badge-num {
        font-size: 26px;
        font-weight: 800;
        color: var(--ssh-green);
        line-height: 1;
    }

    .ssh-about__badge-txt {
        font-size: 12.5px;
        font-weight: 500;
        color: #cfd3d6;
        margin-top: 6px;
        line-height: 1.3;
    }

    .ssh-about__accent {
        position: absolute;
        z-index: 2;
        left: -34px;
        bottom: -30px;
        width: 132px;
        background-color: #fbfffc;
        height: 132px;
        border-radius: 14px;
        overflow: hidden;
        border: 5px solid var(--ssh-white);
        box-shadow: 0 18px 36px -14px rgba(20, 40, 20, 0.4);
        transform: rotate(-7deg);
        transition: transform var(--ssh-transition);
    }



    .ssh-about__accent img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .ssh-about__text {
        color: var(--ssh-gray);
        font-size: 16px;
        line-height: 1.75;
        max-width: 520px;
        margin: 0 0 32px;
    }

    /* Accordion */
    .ssh-accordion {
        max-width: 520px;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .ssh-acc-item {
        border: 1.5px solid var(--ssh-border);
        border-radius: 10px;
        transition: border-color var(--ssh-transition), box-shadow var(--ssh-transition);
        background: var(--ssh-white);
    }

    .ssh-acc-item.is-open {
        border-color: var(--ssh-green);
        box-shadow: 0 8px 24px -12px rgba(47, 180, 74, 0.35);
    }

    .ssh-acc-head {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 17px 20px;
        background: none;
        border: none;
        cursor: pointer;
        font-family: inherit;
        font-size: 15.5px;
        font-weight: 700;
        color: var(--ssh-black);
        text-align: left;
    }

    .ssh-acc-item.is-open .ssh-acc-head {
        color: var(--ssh-green-dark);
    }

    .ssh-acc-icon {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
        color: var(--ssh-green);
        transition: transform var(--ssh-transition);
    }

    .ssh-acc-item.is-open .ssh-acc-icon {
        transform: rotate(180deg);
    }

    .ssh-acc-body {
        display: grid;
        grid-template-rows: 0fr;
        transition: grid-template-rows var(--ssh-transition);
    }

    .ssh-acc-item.is-open .ssh-acc-body {
        grid-template-rows: 1fr;
    }

    .ssh-acc-body>p {
        overflow: hidden;
        margin: 0;
        padding: 0 20px 18px;
        color: var(--ssh-gray);
        font-size: 14.5px;
        line-height: 1.7;
        min-height: 0;
    }

    /* Bottom-right accent image beneath the accordion */
    .ssh-about__footer {
        margin-top: 32px;
        display: flex;
        align-items: center;
        gap: 18px;
        max-width: 520px;
    }

    .ssh-about__footer-media {
        flex-shrink: 0;
        width: 96px;
        height: 96px;
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 16px 32px -16px rgba(20, 40, 20, 0.35);
    }

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

    .ssh-about__footer-note {
        font-size: 13.5px;
        line-height: 1.6;
        color: var(--ssh-gray);
    }

    .ssh-about__footer-note strong {
        display: block;
        color: var(--ssh-black);
        font-size: 14.5px;
        margin-bottom: 2px;
    }

    /* ============================================
   SERVICE SECTION
   ============================================ */
    .ssh-service {
        position: relative;
        padding: 50px 24px 50px;
        background-image: url('https://static.vecteezy.com/system/resources/thumbnails/056/641/704/small/a-car-is-charging-at-a-charging-station-photo.jpeg');
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        background-attachment: fixed;
        isolation: isolate;
        overflow: hidden;
    }

    .ssh-service::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -2;
        background:
            linear-gradient(180deg, rgba(15, 22, 17, 0.68) 0%, rgba(15, 22, 17, 0.54) 45%, rgba(15, 22, 17, 0.5) 100%);
    }



    .ssh-service__inner {
        position: relative;
        max-width: 1200px;
        margin: 0 auto;
    }

    .ssh-service__head {
        text-align: center;
        margin-bottom: 60px;
    }


    .ssh-service .ssh-heading--center {
        color: var(--ssh-white);
    }

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

    .ssh-card {
        background: var(--ssh-white);
        border: 1px solid var(--ssh-border);
        border-radius: 14px;
        padding: 34px 30px;
        transition: transform var(--ssh-transition),
            box-shadow var(--ssh-transition),
            border-color var(--ssh-transition);
    }

    .ssh-card:hover {
        transform: translateY(-8px);
        border-color: transparent;
        box-shadow: 0 24px 48px -20px rgba(20, 40, 20, 0.28);
    }

    /* Icon */
    .ssh-card__icon {
        width: 80px;
        height: 80px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 22px;
        border-radius: 12px;
        transition: transform var(--ssh-transition),
            background var(--ssh-transition);
    }

    /* Icon Image */
    .ssh-card__icon img {
        width: 75px;
        height: 75px;
        object-fit: contain;
        display: block;
        transition: transform var(--ssh-transition);
    }

    .ssh-card:hover .ssh-card__icon {

        transform: rotate(-6deg) scale(1.08);
    }

    .ssh-card:hover .ssh-card__icon img {
        transform: scale(1.08);
    }

    .ssh-card__title {
        font-size: 18.5px;
        font-weight: 700;
        margin: 0 0 12px;
        line-height: 1.35;
    }

    .ssh-card__text {
        font-size: 14.5px;
        line-height: 1.7;
        color: var(--ssh-gray);
        margin: 0 0 20px;
    }

    .ssh-card__link {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 14.5px;
        font-weight: 700;
        color: var(--ssh-green-dark);
    }

    .ssh-card__link span {
        transition: transform var(--ssh-transition);
        display: inline-block;
    }

    .ssh-card:hover .ssh-card__link span {
        transform: translateX(5px);
    }

    /* Location strip */
    .ssh-service__location {
        margin-top: 56px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        flex-wrap: wrap;
        text-align: center;
        background: var(--ssh-white);
        border: 1px solid var(--ssh-border);
        border-radius: 100px;
        padding: 16px 30px;
        max-width: 900px;
        margin-left: auto;
        margin-right: auto;
    }

    .ssh-service__location .ssh-icon {
        width: 20px;
        height: 20px;
        color: var(--ssh-green);
        flex-shrink: 0;
    }

    .ssh-service__location p {
        margin: 0;
        font-size: 14px;
        color: var(--ssh-gray);
    }

    .ssh-service__location a {
        font-size: 14px;
        font-weight: 700;
        color: var(--ssh-green-dark);
        white-space: nowrap;
        transition: color var(--ssh-transition);
    }

    .ssh-service__location a:hover {
        color: var(--ssh-black);
    }

    /* ============================================
   TABLET (≤ 991px)
   ============================================ */
    @media (max-width: 991px) {
        .ssh-about__inner {
            grid-template-columns: 1fr;
            gap: 56px;
        }

        .ssh-about__media {
            max-width: 420px;
            margin: 0 auto;
        }

        .ssh-heading,
        .ssh-about__text,
        .ssh-accordion {
            max-width: 100%;
        }

        .ssh-about__content {
            text-align: left;
        }

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

    /* ============================================
   MOBILE (≤ 640px)
   ============================================ */
    @media (max-width: 640px) {
        .ssh-about {
            padding: 72px 20px;
        }

        .ssh-service {
            padding: 72px 20px 64px;
        }

        .ssh-about__badge {
            right: 6px;
            bottom: 16px;
            padding: 12px 16px;
        }

        .ssh-about__badge-num {
            font-size: 21px;
        }

        .ssh-about__img {
            height: 380px;
        }

        .ssh-about__blob {
            width: 70%;
            height: 80%;
        }

        .ssh-cards {
            grid-template-columns: 1fr;
        }

        .ssh-service__location {
            border-radius: 20px;
            padding: 20px;
        }

        .ssh-service {
            background-attachment: scroll;
            padding: 80px 20px 72px;
        }

        .ssh-about__accent {
            width: 96px;
            height: 96px;
            left: -12px;
            bottom: -18px;
            border-width: 4px;
        }

        .ssh-about__footer {
            gap: 14px;
        }

        .ssh-about__footer-media {
            width: 76px;
            height: 76px;
        }
    }






















    /* gallery */


    :root {
        --ssh-green: #2fb44a;
        --ssh-green-dark: #1e8c38;
        --ssh-dark: #14171a;
        --ssh-gray: #5c6570;
        --ssh-white: #ffffff;
        --ssh-border: #e6e9ec;
        --ssh-bg-soft: #f6f8f7;
        --ssh-transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    * {
        box-sizing: border-box;
    }

    body {
        margin: 0;
        font-family: "Inter", sans-serif;
    }

    @media (prefers-reduced-motion: reduce) {
        * {
            animation: none !important;
            transition: none !important;
        }
    }

    .ssh-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        font-size: 14.5px;
        font-weight: 600;
        color: var(--ssh-green-dark);
        margin-bottom: 16px;
    }

    .ssh-eyebrow__line {
        width: 26px;
        height: 2px;
        background: var(--ssh-green);
    }

    /* ============================================
   GALLERY SECTION — AUTO CARD SLIDER
   ============================================ */
    .ssh-gallery {
        background: var(--ssh-bg-soft);
        padding: 110px 24px;
        overflow: hidden;
    }

    .ssh-gallery__inner {
        max-width: 1280px;
        margin: 0 auto;
    }

    .ssh-gallery__head {
        text-align: center;
        margin-bottom: 52px;
    }

    .ssh-gallery__title {
        font-size: clamp(28px, 3.4vw, 40px);
        font-weight: 800;
        letter-spacing: -0.5px;
        margin: 0 auto;
        max-width: 620px;
        line-height: 1.2;
        color: var(--ssh-dark);
    }

    /* Slider shell */
    .ssh-gslider {
        position: relative;
    }

    .ssh-gslider__viewport {
        overflow: hidden;
    }

    .ssh-gslider__track {
        display: flex;
        transition: transform 0.6s cubic-bezier(0.65, 0, 0.35, 1);
    }

    .ssh-gcard {
        flex: 0 0 calc((100% - 2 * 26px) / 3);
        margin-right: 26px;
        border-radius: 16px;
        overflow: hidden;
        position: relative;
        height: 360px;
        box-shadow: 0 18px 40px -20px rgba(20, 30, 20, 0.25);
        transition: transform var(--ssh-transition), box-shadow var(--ssh-transition);
    }

    .ssh-gcard:hover {
        transform: translateY(-8px);
        box-shadow: 0 26px 54px -18px rgba(20, 30, 20, 0.38);
    }

    .ssh-gcard img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .ssh-gcard:hover img {
        transform: scale(1.08);
    }

    .ssh-gcard__overlay {
        position: absolute;
        inset: 0;
        background: linear-gradient(0deg, rgba(15, 18, 20, 0.82) 0%, rgba(15, 18, 20, 0) 55%);
        display: flex;
        align-items: flex-end;
        padding: 22px;
    }

    .ssh-gcard__title {
        color: var(--ssh-white);
        font-size: 16.5px;
        font-weight: 700;
        margin: 0;
    }

    /* Arrows */
    .ssh-gslider__arrow {
        position: absolute;
        top: 50%;
        translate: 0 -50%;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background: var(--ssh-white);
        border: 1px solid var(--ssh-border);
        color: var(--ssh-dark);
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        z-index: 5;
        transition: var(--ssh-transition);
        box-shadow: 0 12px 26px -12px rgba(0, 0, 0, 0.3);
    }

    .ssh-gslider__arrow:hover {
        background: var(--ssh-green);
        color: var(--ssh-white);

    }

    .ssh-gslider__arrow svg {
        width: 20px;
        height: 20px;
    }

    .ssh-gslider__arrow--prev {
        left: -25px;
    }

    .ssh-gslider__arrow--next {
        right: -25px;
    }

    /* Dots */
    .ssh-gslider__dots {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 9px;
        margin-top: 34px;
    }

    .ssh-gslider__dot {
        width: 9px;
        height: 9px;
        border-radius: 50%;
        background: #d6dbd7;
        border: none;
        cursor: pointer;
        padding: 0;
        transition: var(--ssh-transition);
    }

    .ssh-gslider__dot.is-active {
        background: var(--ssh-green);
        width: 26px;
        border-radius: 5px;
    }

    /* ============================================
   TABLET (≤ 991px) — 2 cards
   ============================================ */
    @media (max-width: 991px) {
        .ssh-gcard {
            flex: 0 0 calc((100% - 26px) / 2);
        }

        .ssh-gslider__arrow--prev {
            left: 4px;
        }

        .ssh-gslider__arrow--next {
            right: 4px;
        }
    }

    /* ============================================
   MOBILE (≤ 640px) — 1 card
   ============================================ */
    @media (max-width: 640px) {
        .ssh-gallery {
            padding: 72px 20px;
        }

        .ssh-gcard {
            flex: 0 0 100%;
            margin-right: 18px;
            height: 300px;
        }

        .ssh-gslider__arrow {
            width: 42px;
            height: 42px;
        }

        .ssh-gslider__arrow--prev {
            left: 2px;
        }

        .ssh-gslider__arrow--next {
            right: 2px;
        }
    }














    /* ============================================
   Sai Srinivasa EV Charging Station — FAQ SECTION
   Standalone stylesheet: faq.css
   ============================================ */

    :root {
        --faq-green: #2fb44a;
        --faq-green-dark: #1e8c38;
        --faq-green-light: #e9f9ee;
        --faq-black: #17191b;
        --faq-gray: #5c6570;
        --faq-white: #ffffff;
        --faq-border: #e6e9ec;
        --faq-bg-soft: #f6f8f7;
        --faq-transition: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    }

    @media (prefers-reduced-motion: reduce) {
        .faq-section * {
            animation: none !important;
            transition: none !important;
        }
    }

    /* Reveal-on-scroll (optional — works with the small script at the bottom of faq.html) */
    .faq-section [data-reveal] {
        opacity: 0;
        transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
        will-change: transform, opacity;
    }

    .faq-section [data-reveal="left"] {
        transform: translateX(-36px);
    }

    .faq-section [data-reveal="right"] {
        transform: translateX(36px);
    }

    .faq-section [data-reveal].is-visible {
        opacity: 1;
        transform: translate(0, 0);
    }

    /* ============================================
   SECTION SHELL
   ============================================ */
    .faq-section {
        padding: 110px 24px;
        background: var(--faq-white);
        font-family: "Inter", sans-serif;
        color: var(--faq-black);
    }

    .faq-inner {
        max-width: 1200px;
        margin: 0 auto;
        display: grid;
        grid-template-columns: 0.85fr 1.15fr;
        gap: 72px;
        align-items: center;
    }

    /* ============================================
   LEFT — IMAGE
   ============================================ */
    .faq-media {
        position: relative;
        max-width: 440px;
    }

    .faq-media-blob {
        position: absolute;
        top: 6%;
        right: -14%;
        width: 60%;
        height: 82%;
        background: var(--faq-green);
        border-radius: 50%;
        z-index: 0;
        opacity: 0.9;
    }

    .faq-media-frame {
        position: relative;
        z-index: 1;
        border-radius: 16px;
        overflow: hidden;
        /* box-shadow: 0 30px 60px -20px rgba(20, 40, 20, 0.35); */
    }

    .faq-media-img {
        display: block;
        width: 100%;
        height: 500px;
        object-fit: contain;
        transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .faq-media:hover .faq-media-img {
        transform: scale(1.05);
    }

    .faq-media-badge {
        position: absolute;
        z-index: 2;
        left: -18px;
        bottom: 26px;
        background: var(--faq-black);
        color: var(--faq-white);
        border-radius: 14px;
        padding: 16px 20px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        box-shadow: 0 18px 40px -14px rgba(0, 0, 0, 0.5);
    }

    .faq-badge-num {
        font-size: 26px;
        font-weight: 800;
        color: var(--faq-green);
        line-height: 1;
    }

    .faq-badge-text {
        font-size: 12.5px;
        font-weight: 500;
        color: #cfd3d6;
        margin-top: 6px;
        line-height: 1.3;
    }

    /* ============================================
   RIGHT — HEADING + ACCORDION (with icon backdrop)
   ============================================ */
    .faq-content {
        position: relative;
    }

    .faq-eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        font-size: 14.5px;
        font-weight: 600;
        color: var(--faq-green-dark);
        margin-bottom: 16px;
    }

    .faq-eyebrow__line {
        width: 26px;
        height: 2px;
        background: var(--faq-green);
        display: inline-block;
    }

    .faq-heading {
        font-size: clamp(26px, 3vw, 38px);
        line-height: 1.2;
        font-weight: 800;
        letter-spacing: -0.5px;
        margin: 0 0 14px;
        max-width: 520px;
    }

    .faq-sub {
        color: var(--faq-gray);
        font-size: 15.5px;
        line-height: 1.7;
        max-width: 480px;
        margin: 0 0 32px;
    }

    /* Faded icon pattern sitting behind the accordion */
    .faq-icons-bg {
        position: absolute;
        inset: 90px -20px 0 auto;
        width: 100%;
        height: calc(100% - 90px);
        z-index: 0;
        overflow: hidden;
        pointer-events: none;
    }

    .faq-icons-bg svg {
        position: absolute;
        color: var(--faq-green);
        opacity: 0.07;
    }

    .faq-icon-bolt {
        width: 130px;
        height: 130px;
        top: -10px;
        right: 4%;
        transform: rotate(8deg);
    }

    .faq-icon-plug {
        width: 100px;
        height: 100px;
        top: 38%;
        right: 26%;
        transform: rotate(-10deg);
    }

    .faq-icon-clock {
        width: 150px;
        height: 150px;
        bottom: -4%;
        right: -2%;
    }

    .faq-icon-battery {
        width: 90px;
        height: 90px;
        bottom: 6%;
        right: 40%;
        transform: rotate(6deg);
    }

    /* Accordion */
    .faq-accordion {
        position: relative;
        z-index: 1;
        max-width: 560px;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .faq-item {
        border: 1.5px solid var(--faq-border);
        border-radius: 10px;
        background: var(--faq-white);
        transition: border-color var(--faq-transition), box-shadow var(--faq-transition);
    }

    .faq-item.is-open {
        border-color: var(--faq-green);
        box-shadow: 0 8px 24px -12px rgba(47, 180, 74, 0.35);
    }

    .faq-item-head {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        padding: 18px 20px;
        background: none;
        border: none;
        cursor: pointer;
        font-family: inherit;
        font-size: 15.5px;
        font-weight: 700;
        color: var(--faq-black);
        text-align: left;
    }

    .faq-item.is-open .faq-item-head {
        color: var(--faq-green-dark);
    }

    .faq-item-icon {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
        color: var(--faq-green);
        transition: transform var(--faq-transition);
    }

    .faq-item.is-open .faq-item-icon {
        transform: rotate(180deg);
    }

    .faq-item-body {
        display: grid;
        grid-template-rows: 0fr;
        transition: grid-template-rows var(--faq-transition);
    }

    .faq-item.is-open .faq-item-body {
        grid-template-rows: 1fr;
    }

    .faq-item-body>p {
        overflow: hidden;
        margin: 0;
        padding: 0 20px 18px;
        color: var(--faq-gray);
        font-size: 14.5px;
        line-height: 1.7;
        min-height: 0;
    }

    /* Inline "open now" tag on the first, most important answer */
    .faq-open-tag {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 12.5px;
        font-weight: 700;
        color: var(--faq-green-dark);
        background: var(--faq-green-light);
        border-radius: 100px;
        padding: 4px 10px;
        margin-bottom: 8px;
    }

    .faq-open-tag span {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: var(--faq-green);
        display: inline-block;
    }

    /* ============================================
   TABLET (≤ 991px)
   ============================================ */
    @media (max-width: 991px) {
        .faq-inner {
            grid-template-columns: 1fr;
            gap: 52px;
        }

        .faq-media {
            max-width: 420px;
            margin: 0 auto;
        }

        .faq-heading,
        .faq-sub,
        .faq-accordion {
            max-width: 100%;
        }

        .faq-icons-bg {
            inset: 70px -10px 0 auto;
        }

        .faq-icon-bolt,
        .faq-icon-clock {
            opacity: 0.05;
        }
    }

    /* ============================================
   MOBILE (≤ 640px)
   ============================================ */
    @media (max-width: 640px) {
        .faq-section {
            padding: 72px 20px;
        }

        .faq-media-img {
            height: 360px;
        }

        .faq-media-blob {
            display: none;
        }

        .faq-media-badge {
            left: 6px;
            bottom: 16px;
            padding: 12px 16px;
        }

        .faq-badge-num {
            font-size: 21px;
        }

        .faq-icons-bg {
            display: none;
        }
    }