html {
    max-width: 100%;
    overflow-x: hidden;
}

body {
    max-width: 100%;
    overflow-x: hidden;
    overflow-wrap: break-word;
}

img,
svg,
video,
canvas,
iframe {
    max-width: 100%;
}

input,
select,
textarea,
button {
    max-width: 100%;
}

@media (max-width: 767.98px) {
    .showcase-hero {
        padding: 24px 0 48px !important;
    }

    .showcase-hero .hero-panel {
        padding: 20px !important;
        border-radius: 20px;
    }

    .showcase-hero .hero-title {
        max-width: none;
        font-size: clamp(1.8rem, 9vw, 2.35rem) !important;
        line-height: 1.08;
    }

    .showcase-hero .hero-copy {
        font-size: 0.95rem;
        line-height: 1.65;
    }

    .showcase-hero .hero-actions {
        gap: 10px;
        margin-top: 20px;
    }

    .showcase-hero .hero-actions .hero-btn {
        width: 100%;
        min-height: 46px;
        padding: 12px 16px;
    }

    .showcase-hero .hero-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px;
    }

    .showcase-hero .hero-stat {
        padding: 10px 6px;
        border-radius: 14px;
    }

    .showcase-hero .hero-stat strong {
        font-size: 1.15rem;
    }

    .showcase-hero .hero-stat span {
        font-size: 0.7rem;
        line-height: 1.3;
    }

    .section-shell {
        padding: 40px 0 !important;
    }

    .feature-card,
    .course-card,
    .construction-card,
    .gathering-card,
    .cta-panel,
    .temple-highlight {
        border-radius: 20px !important;
    }

    .feature-card img,
    .course-card img,
    .construction-card img,
    .gathering-card img {
        height: 210px !important;
    }

    .container.page-shell,
    body > .container {
        width: 100%;
        padding-right: 12px;
        padding-left: 12px;
    }

    body > .container.py-5,
    .container.page-shell.py-4 {
        padding-top: 16px !important;
        padding-bottom: 32px !important;
    }

    .hero-card,
    .hero-shell,
    .card-shell,
    .glass-card,
    .brochure-card,
    .summary-card {
        border-radius: 18px !important;
    }

    .hero-card img {
        width: 100%;
        height: auto !important;
        min-height: 0 !important;
        max-height: 280px;
        object-fit: cover;
    }

    .hero-card .course-hero-poster {
        height: auto !important;
        min-height: 0 !important;
        max-height: none;
        object-fit: contain;
    }

    .hero-card .display-6,
    .hero-shell .display-6,
    .hero-band h1 {
        font-size: clamp(1.7rem, 8vw, 2.2rem);
        line-height: 1.15;
    }

    .hero-card .fs-5,
    .hero-shell .fs-5 {
        font-size: 1rem !important;
        line-height: 1.6;
    }

    .hero-band {
        padding: 20px !important;
    }

    .site-header .container {
        padding: 6px 12px !important;
    }

    .site-header .logo {
        height: 50px !important;
    }

    .topbar {
        flex-wrap: wrap;
        font-size: 0.86rem;
    }

    .wall-head h1 {
        overflow-wrap: anywhere;
    }

    .table-responsive td,
    .table-responsive th {
        min-width: 120px;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .table-responsive .kv {
        min-width: 135px;
    }

    .card .d-flex.gap-2:last-child {
        flex-wrap: wrap;
    }

    .card .d-flex.gap-2:last-child .btn {
        flex: 1 1 180px;
    }

    .breadcumb-area {
        min-height: 210px;
        height: auto !important;
        padding: 48px 0;
        background-position: center;
    }

    .breadcumb-content {
        width: 100%;
        padding: 0 4px;
    }

    .breadcumb-content .breadcumb-title {
        font-size: clamp(1.75rem, 8vw, 2.35rem);
        line-height: 1.12;
    }

    .breadcumb-content p {
        font-size: 0.95rem;
        line-height: 1.6;
    }

    .breadcumb-section {
        padding: 8px 0;
    }

    .about-us-area .row > [class*="col-"],
    .temple-contact-area .row > [class*="col-"] {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }

    .about-us-area .about-content,
    .services-area .single-service,
    .temple-contact-area .contact-form,
    .temple-contact-area .content-sidebar {
        margin-bottom: 24px;
    }

    .about-us-area .about-content h2,
    .services-area .section-heading h2,
    .testimonials.about-content h2 {
        font-size: clamp(1.55rem, 7vw, 2.15rem);
        line-height: 1.2;
    }

    .about-us-area .about-content p,
    .services-area .single-service p,
    .temple-contact-area p {
        font-size: 0.95rem;
        line-height: 1.7;
    }

    .about-us-area .about-content img {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 18px;
    }

    .section-padding-0-50,
    .section-padding-0-100 {
        padding-bottom: 36px !important;
    }

    .section-padding-50-0 {
        padding-top: 36px !important;
    }

    .medica-gallery-area .single-gallery-item img {
        width: 100%;
        height: auto;
    }

    .contact-form .form-control {
        min-height: 46px;
        font-size: 16px;
    }

    .contact-form textarea.form-control {
        min-height: 150px;
    }

    .temple-contact-card {
        padding: 20px !important;
    }

    .temple-contact-card .single-contact {
        align-items: flex-start !important;
    }

    .temple-contact-card .contact-meta {
        min-width: 0;
    }

    .g-recaptcha {
        width: 304px;
        max-width: 100%;
        overflow: hidden;
        transform: scale(0.88);
        transform-origin: left top;
        margin-bottom: -8px;
    }

    .map-area iframe {
        height: 320px !important;
    }

    .footer-area,
    footer {
        overflow: hidden;
    }

    .footer-area [class*="col-"] {
        margin-bottom: 24px;
    }

    .modal-dialog {
        margin: 8px;
    }
}

@media (max-width: 374.98px) {
    .breadcumb-area {
        min-height: 190px;
        padding: 38px 0;
    }

    .g-recaptcha {
        transform: scale(0.82);
        margin-bottom: -18px;
    }
}