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

/* Large Devices (Desktops, less than 1200px) */
@media (max-width: 1199.98px) {
    .hero-heading {
        font-size: 3.5rem;
    }

    .expo-bg-text {
        font-size: 10rem;
    }

    .green-section {
        padding-inline: 32px;
    }

    .about-grid {
        grid-template-columns: minmax(0, 1fr) minmax(440px, 0.95fr);
        gap: 48px;
    }
}

/* Medium Devices (Tablets, less than 992px) */
@media (max-width: 991.98px) {
    .navbar-container {
        flex-wrap: wrap;
    }

    .navbar-collapse {
        width: 100%;
        background-color: transparent;
        padding: 0;
        margin-top: 10px;
    }

    .navbar-nav {
        justify-content: center;
    }

    .navbar-buttons {
        width: 100%;
        justify-content: center;
        margin-top: 15px;
    }

    .hero-content {
        text-align: center;
        padding-right: 0;
    }

    .hero-description {
        margin: 0 auto;
    }

    .hero-image-col {
        justify-content: center;
        margin-top: 40px;
    }

    .expo-banner-left,
    .expo-banner-right {
        display: none;
    }

    .green-section {
        padding: 72px 28px;
    }

    .about-grid {
        grid-template-columns: 1fr;
        gap: 52px;
    }

    .about-text {
        max-width: 660px;
        padding-top: 0;
    }

    .about-stats {
        width: 100%;
    }
}

/* Small Devices (Landscape Phones, less than 768px) */
@media (max-width: 767.98px) {
    .hero-heading {
        font-size: 2.5rem;
    }

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

    .hero-image-wrapper {
        height: 350px;
    }

    .btn-register {
        font-size: 0.85rem;
        padding: 8px 20px;
    }

    .brand-text {
        font-size: 1.25rem;
    }

    .brand-circle {
        width: 35px;
        height: 35px;
    }

    .green-section {
        padding: 64px 20px;
    }

    .about-heading {
        font-size: 2.4rem;
    }

    .about-heading br {
        display: none;
    }

    .stat-card,
    .stat-card-wide {
        height: 250px;
    }
}

/* Extra Small Devices (Portrait Phones, less than 576px) */
@media (max-width: 575.98px) {
    #main-header {
        padding: 10px 15px;
    }

    .navbar-container {
        padding: 8px 15px;
        border-radius: 25px;
    }

    .hero-inner {
        padding: 0 15px;
    }

    .hero-heading {
        font-size: 2rem;
    }

    .hero-section {
        padding-top: 100px;
    }

    .expo-banner-inner {
        padding: 0 15px;
    }

    .expo-banner-center .upcoming-svg {
        height: 25px;
    }

    .expo-banner-center .expo-svg {
        height: 50px;
    }

    .expo-banner-center .connect-svg {
        height: 15px;
    }

    .green-section {
        margin-top: -24px;
        padding: 54px 16px 56px;
    }

    .section-label {
        font-size: 0.75rem;
        letter-spacing: 3px;
        margin-bottom: 18px;
    }

    .about-heading {
        font-size: 2rem;
        margin-bottom: 22px;
    }

    .about-desc {
        font-size: 0.9rem;
        line-height: 1.65;
        margin-bottom: 20px;
    }

    .about-grid {
        gap: 40px;
    }

    .stats-top {
        grid-template-columns: 1fr;
    }

    .stat-card,
    .stat-card-wide {
        height: 240px;
        border-radius: 14px;
    }

    .stat-card-overlay {
        gap: 20px;
    }

    .stat-number {
        font-size: 3.75rem;
    }

    .stat-label {
        font-size: 0.8rem;
    }
}

/* About Hero Responsive */
@media (max-width: 991.98px) {
    .about-hero-section {
        min-height: auto;
        padding: 160px 28px 64px;
    }

    .about-hero-inner {
        flex-direction: column;
        align-items: stretch;
        gap: 50px;
    }

    .about-hero-content {
        max-width: 650px;
    }

    .about-hero-heading {
        font-size: 3.75rem;
        margin-bottom: 40px;
    }

    .about-hero-image {
        justify-content: center;
        padding: 0;
    }

    .about-hero-img {
        width: min(100%, 510px);
    }
}

@media (max-width: 767.98px) {
    .about-hero-section {
        padding: 145px 20px 56px;
    }

    .about-hero-heading {
        font-size: 3.1rem;
        margin-bottom: 32px;
    }
}

@media (max-width: 575.98px) {
    .about-hero-section {
        padding: 130px 16px 48px;
    }

    .about-hero-inner {
        gap: 38px;
    }

    .about-hero-heading {
        font-size: 2.75rem;
        margin-bottom: 26px;
    }

    .about-hero-desc {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .about-hero-img {
        border-radius: 14px;
    }
}

/* Who We Are Responsive */
@media (max-width: 991.98px) {
    .who-we-are-section {
        padding: 70px 28px;
    }

    .who-we-are-inner {
        flex-direction: column;
        align-items: stretch;
        gap: 52px;
    }

    .who-we-are-content {
        max-width: 650px;
        transform: none;
    }

    .who-we-are-label {
        margin-bottom: 54px;
    }

    .who-we-are-heading {
        font-size: 2.75rem;
        margin-bottom: 38px;
    }

    .who-we-are-image {
        justify-content: center;
        padding: 0;
    }

    .who-we-are-img {
        width: min(100%, 568px);
        height: auto;
        aspect-ratio: 1;
    }
}

@media (max-width: 575.98px) {
    .who-we-are-section {
        padding: 54px 16px;
    }

    .who-we-are-inner {
        gap: 40px;
    }

    .who-we-are-label {
        font-size: 0.75rem;
        margin-bottom: 38px;
    }

    .who-we-are-heading {
        font-size: 2.25rem;
        margin-bottom: 30px;
    }

    .who-we-are-desc {
        font-size: 0.9rem;
        line-height: 1.65;
        margin-bottom: 22px;
    }

    .who-we-are-img {
        border-radius: 14px;
    }
}

/* Contact Hero Responsive */
@media (max-width: 991.98px) {
    .contact-hero-section {
        min-height: 78svh;
        padding: 180px 28px 110px;
    }

    .contact-hero-heading {
        font-size: 3.75rem;
        margin-bottom: 34px;
    }
}

@media (max-width: 767.98px) {
    .contact-hero-section {
        padding: 150px 20px 90px;
        min-height: 70svh;
    }

    .contact-hero-heading {
        font-size: 3.1rem;
        margin-bottom: 30px;
    }

    .contact-hero-subheading {
        font-size: 1.25rem;
        margin-bottom: 18px;
    }

    .contact-hero-desc {
        font-size: 0.95rem;
    }

    .contact-hero-desc br {
        display: none;
    }
}

/* Extra Small Devices - Contact Hero */
@media (max-width: 575.98px) {
    .contact-hero-section {
        min-height: 68svh;
        padding: 135px 16px 80px;
    }

    .contact-hero-heading {
        font-size: 2.75rem;
        margin-bottom: 28px;
    }

    .contact-hero-subheading {
        font-size: 1.15rem;
        margin-bottom: 16px;
    }

    .contact-hero-desc {
        font-size: 0.9rem;
        line-height: 1.6;
    }
}

/* Contact Info Section Responsive */
@media (max-width: 991.98px) {
    .contact-info-card {
        grid-template-columns: 1fr;
        padding: 40px;
        gap: 40px;
    }
}

@media (max-width: 767.98px) {
    .contact-info-section {
        padding: 0 20px 60px;
    }

    .contact-info-card {
        padding: 30px 24px;
    }

    .contact-form-row {
        grid-template-columns: 1fr;
    }

    .contact-info-heading,
    .contact-form-heading {
        font-size: 1.5rem;
    }
}

@media (max-width: 575.98px) {
    .contact-info-card {
        padding: 24px 16px;
        border-radius: 16px;
    }

    .contact-icon-circle {
        width: 44px;
        height: 44px;
        min-width: 44px;
    }

    .contact-icon-circle i {
        font-size: 1rem;
    }
}

/* Privacy Policy Responsive */
@media (max-width: 767.98px) {
    .privacy-page #main-header {
        padding: 20px 15px 0;
    }

    .privacy-hero-section {
        min-height: 460px;
        padding: 170px 24px 60px;
    }

    .privacy-hero-heading {
        font-size: 3rem;
    }

    .privacy-hero-desc br {
        display: none;
    }

    .privacy-content-section {
        padding: 56px 24px 64px;
    }

    .privacy-policy-block + .privacy-policy-block {
        margin-top: 48px;
    }

    .privacy-policy-block h2 {
        font-size: 1.75rem;
    }

    .privacy-cta-section {
        padding: 45px 24px;
    }

    .privacy-cta-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 32px;
    }

    .privacy-cta-content h2 {
        font-size: 2rem;
    }

    .privacy-cta-content br {
        display: none;
    }

    .privacy-cta-actions {
        width: 100%;
        flex-wrap: wrap;
    }
}

@media (max-width: 420px) {
    .privacy-cta-actions {
        flex-direction: column;
        align-items: stretch;
    }
}

/* Exhibitor Registration Responsive */
@media (max-width: 767.98px) {
    .exhibitor-form-section {
        padding: 35px 24px 70px;
    }

    .registration-progress {
        margin-bottom: 72px;
    }

    .progress-step {
        flex-basis: 42px;
    }

    .progress-circle {
        width: 40px;
        height: 40px;
        font-size: 1rem;
    }

    .progress-line {
        margin-top: 20px;
    }

    .progress-label {
        top: 52px;
        width: 105px;
        font-size: 0.65rem;
    }

    .exhibitor-form-heading h2 {
        font-size: 2rem;
    }

    .exhibitor-fields-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .company-logo-dropzone {
        min-height: 190px;
        padding: 25px;
        text-align: center;
    }

    .exhibitor-form-actions {
        margin-top: 45px;
    }

    .booth-type-fieldset legend {
        margin-bottom: 35px;
    }

    .booth-type-grid,
    .exhibition-details-grid {
        grid-template-columns: 1fr;
    }

    .booth-type-card {
        min-height: 155px;
        padding: 34px 24px;
        gap: 20px;
    }

    .booth-card-copy small br {
        display: none;
    }

    .terms-agreement {
        align-items: flex-start;
        line-height: 1.5;
    }
}

@media (max-width: 575.98px),
       (max-width: 991.98px) and (max-height: 600px) and (orientation: landscape) {
    .attendee-modal-dialog {
        min-height: 0;
        padding: 48px 24px 38px;
        border-radius: 18px;
    }

    .attendee-modal-dialog h2 {
        font-size: clamp(1.75rem, 8vw, 1.9rem);
    }

    .attendee-modal-intro {
        font-size: 0.875rem;
        margin-bottom: 30px;
    }

    .attendee-modal-form > label {
        font-size: 0.82rem;
    }

    .attendee-email-control input {
        font-size: 0.875rem;
    }

    .attendee-modal-form small {
        font-size: 0.7rem;
    }

    .attendee-continue-btn {
        font-size: 0.8rem;
    }

    .attendee-security-note {
        margin-top: 45px;
        gap: 20px;
        padding-inline: 0;
    }

    .attendee-security-note span {
        font-size: 0.82rem;
    }
}

/* Why Attend Section */
@media (max-width: 1199.98px) {
    .why-attend-section {
        padding-inline: 32px;
    }

    .why-attend-row {
        grid-template-columns: 120px minmax(260px, 0.9fr) minmax(340px, 1.1fr);
        gap: 36px;
    }
}

@media (max-width: 991.98px) {
    .why-attend-section {
        padding: 64px 28px 70px;
    }

    .why-attend-row {
        grid-template-columns: 64px minmax(0, 1fr);
        gap: 10px 28px;
        padding: 30px 0;
    }

    .why-attend-text {
        grid-column: 2;
        max-width: 620px;
    }
}

@media (max-width: 575.98px) {
    .why-attend-section {
        padding: 50px 16px 56px;
    }

    .why-attend-label {
        font-size: 0.75rem;
        letter-spacing: 3px;
    }

    .why-attend-heading {
        font-size: 2rem;
        line-height: 1.2;
    }

    .why-attend-italic {
        padding-left: 38px;
    }

    .why-attend-desc {
        margin-bottom: 34px;
    }

    .why-attend-row {
        grid-template-columns: 40px minmax(0, 1fr);
        gap: 12px 14px;
        min-height: 0;
        padding: 26px 0;
    }

    .why-attend-title {
        font-size: 1.2rem;
    }

    .why-attend-text {
        grid-column: 1 / -1;
        padding-left: 54px;
    }
}

/* Partner and Event Details Sections */
@media (max-width: 991.98px) {
    .partner-green-bg {
        padding-inline: 28px;
    }

    .partner-cards {
        grid-template-columns: minmax(250px, 420px);
        gap: 20px;
        margin-bottom: -52px;
    }

    .partner-card {
        height: 240px;
    }

    .info-bar-section {
        padding: 150px 28px 80px;
    }

    .info-bar-inner {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
    }

    .info-bar-item {
        min-height: 130px;
        padding: 20px 30px;
    }

    .info-bar-item:first-child {
        padding-left: 30px;
    }

    .info-bar-item:last-child {
        padding-right: 30px;
    }

    .info-bar-divider {
        display: none;
    }

    .info-bar-item:nth-of-type(3),
    .info-bar-item:nth-of-type(7) {
        border-left: 1px solid rgba(8, 41, 31, 0.3);
    }

    .info-bar-item:nth-of-type(5),
    .info-bar-item:nth-of-type(7) {
        border-top: 1px solid rgba(8, 41, 31, 0.3);
    }
}

/* Ready to Join CTA */
@media (max-width: 991.98px) {
    .cta-section {
        padding: 64px 28px;
    }

    .cta-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 38px;
    }

    .cta-text {
        max-width: 680px;
    }
}

/* Site Footer */
@media (max-width: 1199.98px) {
    .site-footer {
        padding-inline: 32px;
    }

    .footer-inner {
        grid-template-columns: 270px minmax(0, 1fr);
        gap: 72px;
    }

    .footer-brand {
        width: 270px;
    }

    .footer-logo {
        width: 230px;
    }

    .footer-links {
        gap: 28px;
    }
}

@media (max-width: 991.98px) {
    .site-footer {
        padding: 64px 28px 0;
    }

    .footer-inner {
        grid-template-columns: 1fr;
        gap: 62px;
    }

    .footer-brand {
        width: min(100%, 360px);
        padding-top: 0;
        text-align: left;
    }

    .footer-links {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 52px 60px;
    }
}

@media (max-width: 575.98px) {
    .site-footer {
        padding: 52px 16px 0;
    }

    .footer-inner {
        gap: 52px;
        padding-bottom: 42px;
    }

    .footer-logo {
        width: 210px;
    }

    .footer-links {
        gap: 44px 24px;
    }

    .footer-col-title {
        font-size: 1.3rem;
        margin-bottom: 24px;
    }

    .footer-col-list {
        gap: 20px;
    }

    .footer-col-list a,
    .footer-tagline,
    .footer-bottom p {
        font-size: 0.8rem;
    }
}

@media (max-width: 575.98px) {
    .cta-section {
        padding: 50px 16px;
    }

    .cta-heading {
        font-size: 2.25rem;
    }

    .cta-buttons {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .btn-cta {
        width: 100%;
    }
}

@media (max-width: 575.98px) {
    .partner-green-bg {
        padding: 44px 16px 0;
    }

    .partner-heading {
        font-size: 2rem;
    }

    .partner-desc {
        max-width: 390px;
    }

    .partner-green-inner {
        padding-bottom: 32px;
    }

    .partner-cards {
        grid-template-columns: minmax(0, 330px);
        gap: 16px;
        margin-bottom: -42px;
    }

    .partner-card {
        height: 225px;
    }

    .info-bar-section {
        padding: 112px 16px 60px;
    }

    .info-bar-inner {
        grid-template-columns: 1fr;
    }

    .info-bar-item,
    .info-bar-item:first-child,
    .info-bar-item:last-child {
        min-height: 0;
        padding: 24px 4px;
        border-left: 0;
        border-top: 1px solid rgba(8, 41, 31, 0.3);
    }

    .info-bar-item:first-child {
        border-top: 0;
    }

    .info-bar-label,
    .info-bar-value {
        overflow-wrap: anywhere;
    }
}

/* ================================================================
   Home Page Responsive System
   Ordered from wide tablets to compact phones so desktop geometry
   remains unchanged above 1200px.
   ================================================================ */

/* Compact desktops and landscape tablets */
@media (min-width: 1400px) and (max-width: 1440px) {
    .expo-banner-wrapper {
        bottom: -329px !important;
    }
}

@media (max-width: 1199.98px) {
    #main-header {
        padding-inline: 24px;
    }

    .brand-image {
        display: block;
        width: min(285px, 27vw);
        height: auto;
    }

    .hero-section {
        min-height: auto;
        padding: 118px 24px 115px;
    }

    .hero-inner {
        padding-inline: 24px;
    }

    .hero-row {
        min-height: 650px;
        gap: 12px;
    }

    .hero-content {
        min-width: 0;
        padding-right: 24px;
    }

    .hero-heading {
        font-size: clamp(3.25rem, 4.6vw, 4rem);
        margin-bottom: 1.5rem;
    }

    .hero-description {
        font-size: clamp(1rem, 1.45vw, 1.2rem);
        line-height: 1.65;
    }

    .hero-image-wrapper {
        height: clamp(430px, 44vw, 520px);
    }

    .expo-bg-text {
        top: auto !important;
        bottom: 42px !important;
        font-size: clamp(7rem, 13vw, 10rem);
    }

    .expo-banner-wrapper {
        left: 32px !important;
        right: 32px !important;
        bottom: clamp(-260px, -19vw, -220px) !important;
    }

    .expo-banner {
        width: 100%;
        max-width: 1120px;
        height: clamp(250px, 22vw, 300px);
        overflow: hidden;
    }

    .expo-banner-bg {
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: fill;
        object-position: center;
        border-radius: inherit;
    }

    .expo-banner-content {
        padding: 28px 40px;
    }

    .expo-banner-left,
    .expo-banner-right {
        padding-inline: 0;
    }

    .expo-city,
    .expo-date {
        font-size: 1.7rem;
    }

    .expo-country {
        font-size: 1rem;
        letter-spacing: 0.25em;
    }

    .expo-year {
        font-size: 1.25rem;
        letter-spacing: 8px;
    }

    .expo-upcoming {
        font-size: 2.6rem;
    }

    .expo-title {
        font-size: 5.6rem;
    }

    .expo-tags {
        gap: 14px;
        max-width: 100%;
        justify-content: center;
    }

    .expo-banner-center {
        min-width: 0;
        max-width: 100%;
    }

    .expo-tag {
        font-size: 0.82rem;
    }

    .expo-line {
        width: 42px;
    }

    .white-section {
        padding: clamp(270px, 25vw, 320px) 32px 56px;
        border-radius: 0 0 48px 48px;
    }

    .people-image-wrapper {
        border-radius: 18px;
    }

    .people-heading {
        font-size: clamp(2rem, 3vw, 2.5rem);
    }

    .app-section {
        padding: 70px 32px 0;
    }

    .app-section-inner,
    .app-mockup-wrapper {
        max-width: 1120px;
    }

    .app-heading,
    .app-heading-sub {
        font-size: clamp(2.75rem, 4.5vw, 3.5rem);
    }

    .app-mockup-img {
        max-width: 820px;
    }

    .app-bg-text {
        font-size: clamp(8rem, 14vw, 11rem);
    }
}

/* Portrait tablets and Bootstrap's collapsed navigation */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .brand-image {
        width: clamp(225px, 22vw, 265px);
    }

    .nav-link {
        padding-inline: 12px !important;
        white-space: nowrap;
    }
}

@media (max-width: 991.98px) {
    #main-header {
        padding: 14px 20px;
    }

    .navbar-container {
        align-items: center;
        padding: 9px 16px;
        border-radius: 16px;
    }

    .navbar-brand {
        min-width: 0;
        margin-right: 12px;
    }

    .brand-image {
        width: clamp(190px, 28vw, 245px);
        max-width: 100%;
    }

    .navbar-toggler {
        flex: 0 0 auto;
    }

    .navbar-collapse {
        max-height: calc(100dvh - 90px);
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: 12px 4px 6px;
    }

    .navbar-nav {
        align-items: stretch;
        text-align: center;
    }

    .nav-link {
        padding-block: 10px !important;
    }

    .navbar-buttons {
        margin: 10px 0 0;
        gap: 10px;
    }

    .navbar-buttons .btn-register {
        min-height: 44px;
    }

    .hero-section {
        padding: 118px 28px 165px;
    }

    .hero-inner {
        padding: 0;
    }

    .hero-row {
        --bs-gutter-x: 0;
        min-height: 0;
        margin-inline: 0;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 38px;
    }

    .hero-row > * {
        padding-inline: 0;
    }

    .hero-content {
        flex: none;
        width: 100%;
        padding-right: 0;
    }

    .hero-heading {
        font-size: clamp(3rem, 7vw, 4.25rem);
    }

    .hero-description {
        max-width: 680px;
        font-size: 1.05rem;
    }

    .hero-image-col {
        flex: none;
        width: 100%;
        margin-top: 0;
    }

    .hero-image-wrapper {
        width: min(100%, 720px);
        height: clamp(360px, 54vw, 480px);
    }

    .expo-bg-text {
        top: auto !important;
        bottom: 112px !important;
        font-size: clamp(5rem, 13vw, 8rem);
    }

    .expo-banner-wrapper {
        left: 28px !important;
        right: 28px !important;
        bottom: -110px !important;
    }

    .expo-banner {
        width: 100%;
        height: 220px;
        padding: 0;
        overflow: hidden;
        border-radius: 18px;
    }

    .expo-banner-bg {
        object-fit: fill;
        border-radius: inherit;
    }

    .expo-banner-content {
        justify-content: center;
        gap: 0;
        padding: 18px 24px;
    }

    .expo-upcoming {
        font-size: 2.5rem;
        line-height: 1;
    }

    .expo-title {
        font-size: 5rem;
        margin-top: 2px;
    }

    .expo-tags {
        gap: 12px;
        margin-top: 8px;
    }

    .expo-tag {
        font-size: 0.75rem;
        letter-spacing: 1.5px;
    }

    .expo-line {
        width: 38px;
    }

    .white-section {
        padding: 150px 28px 54px;
        border-radius: 0 0 42px 42px;
    }

    .people-image-wrapper {
        width: min(100%, 900px);
        height: clamp(340px, 55vw, 490px);
    }

    .people-image {
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

    .people-image-overlay {
        padding: 32px 34px;
    }

    .people-heading {
        font-size: clamp(2rem, 4.5vw, 2.65rem);
    }

    .partner-cards {
        grid-template-columns: repeat(2, minmax(0, 330px));
        width: min(100%, 720px);
        gap: 20px;
        margin-bottom: -48px;
    }

    .partner-card:last-child {
        grid-column: 1 / -1;
        width: min(100%, 330px);
        justify-self: center;
    }

    .partner-card {
        height: 215px;
        padding-inline: 16px;
    }

    .partner-card-label {
        width: calc(100% + 32px);
    }

    .partner-card-logo-circle {
        width: 88px;
        height: 88px;
    }

    .partner-card-line {
        margin: 20px 0 14px;
    }

    .info-bar-section {
        padding-top: 132px;
    }

    .info-bar-value {
        overflow-wrap: anywhere;
    }

    .info-bar-item,
    .about-text,
    .about-stats,
    .stat-card {
        min-width: 0;
    }

    .app-section {
        padding: 62px 28px 0;
    }

    .app-section-inner {
        padding-bottom: 30px;
    }

    .app-heading,
    .app-heading-sub {
        font-size: clamp(2.5rem, 6vw, 3.25rem);
    }

    .app-mockup-img {
        width: min(100%, 760px);
    }

    .app-mockup {
        width: min(100%, 760px);
        min-width: 0;
    }

    .app-bg-text {
        font-size: clamp(6rem, 15vw, 9rem);
        letter-spacing: 6px;
    }
}

/* Landscape phones and small tablets */
@media (max-width: 767.98px) {
    #main-header {
        padding: 12px 16px;
    }

    .brand-image {
        width: clamp(180px, 40vw, 225px);
    }

    .hero-section {
        padding: 108px 20px 130px;
    }

    .hero-row {
        gap: 30px;
    }

    .hero-heading {
        font-size: clamp(2.4rem, 7.5vw, 3.25rem);
        margin-bottom: 1.25rem;
    }

    .hero-description {
        font-size: 0.95rem;
        line-height: 1.62;
    }

    .hero-image-wrapper {
        height: clamp(290px, 54vw, 380px);
        border-radius: 16px;
    }

    .expo-bg-text {
        bottom: 82px !important;
        font-size: clamp(3.8rem, 14vw, 6rem);
        letter-spacing: 5px;
    }

    .expo-banner-wrapper {
        left: 20px !important;
        right: 20px !important;
        bottom: -92px !important;
    }

    .expo-banner {
        height: 184px;
    }

    .expo-banner-content {
        padding: 14px 18px;
    }

    .expo-upcoming {
        font-size: 2rem;
        letter-spacing: 2px;
    }

    .expo-title {
        font-size: 4rem;
    }

    .expo-tags {
        gap: 9px;
        margin-top: 5px;
    }

    .expo-tag {
        font-size: 0.65rem;
        letter-spacing: 1px;
    }

    .expo-line {
        width: 28px;
    }

    .white-section {
        padding: 122px 20px 48px;
        border-radius: 0 0 34px 34px;
    }

    .people-image-wrapper {
        height: clamp(280px, 58vw, 380px);
        border-radius: 16px;
    }

    .people-image-overlay {
        padding: 26px 24px;
    }

    .people-heading {
        font-size: clamp(1.7rem, 5vw, 2.2rem);
    }

    .why-attend-heading {
        font-size: clamp(2rem, 6vw, 2.4rem);
    }

    .why-attend-italic {
        padding-left: clamp(38px, 12vw, 90px);
    }

    .partner-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: min(100%, 620px);
        gap: 16px;
        margin-bottom: -46px;
    }

    .partner-card {
        height: 232px;
        padding-inline: 22px;
    }

    .partner-card-label {
        width: calc(100% + 44px);
    }

    .partner-card-logo-circle {
        width: 96px;
        height: 96px;
    }

    .info-bar-section {
        padding: 124px 20px 70px;
    }

    .info-bar-item,
    .info-bar-item:first-child,
    .info-bar-item:last-child {
        padding-inline: 20px;
    }

    .app-section {
        padding: 54px 20px 0;
    }

    .app-heading,
    .app-heading-sub {
        font-size: clamp(2.2rem, 7vw, 2.8rem);
    }

    .app-bg-text {
        font-size: clamp(4.5rem, 15vw, 7rem);
        letter-spacing: 4px;
    }

    .cta-heading {
        font-size: clamp(2.25rem, 6.5vw, 2.6rem);
    }
}

/* Portrait phones */
@media (max-width: 575.98px) {
    #main-header {
        padding: 10px 12px;
    }

    .navbar-container {
        padding: 8px 12px;
        border-radius: 14px;
    }

    .navbar-brand {
        max-width: calc(100% - 52px);
    }

    .brand-image {
        width: clamp(165px, 53vw, 205px);
    }

    .navbar-toggler {
        padding: 3px 5px;
    }

    .navbar-buttons {
        width: 100%;
    }

    .navbar-buttons .btn-register {
        width: 100%;
        padding: 10px 14px;
        border-color: #052018;
    }

    .hero-section {
        padding: 96px 16px 108px;
    }

    .hero-row {
        gap: 24px;
    }

    .hero-heading {
        font-size: clamp(2rem, 10.2vw, 2.7rem);
        line-height: 1.12;
        margin-bottom: 1rem;
    }

    .hero-description {
        font-size: 0.9rem;
        line-height: 1.58;
    }

    .hero-image-wrapper {
        height: clamp(230px, 64vw, 310px);
        border-radius: 14px;
    }

    .expo-bg-text {
        bottom: 65px !important;
        font-size: clamp(2.8rem, 14vw, 4.5rem);
        letter-spacing: 3px;
    }

    .expo-banner-wrapper {
        left: 16px !important;
        right: 16px !important;
        bottom: -75px !important;
    }

    .expo-banner {
        height: 150px;
        border-radius: 14px;
    }

    .expo-banner-bg {
        border-radius: 14px;
        object-fit: fill;
    }

    .expo-banner-content {
        padding: 12px;
    }

    .expo-upcoming {
        font-size: 1.5rem;
        letter-spacing: 1px;
    }

    .expo-title {
        font-size: 3rem;
        margin-top: 0;
    }

    .expo-tags {
        gap: 6px;
        margin-top: 4px;
    }

    .expo-tag {
        font-size: 0.56rem;
        letter-spacing: 0.6px;
    }

    .expo-line {
        width: 18px;
    }

    .white-section {
        padding: 100px 16px 44px;
        border-radius: 0 0 28px 28px;
    }

    .people-image-wrapper {
        height: clamp(245px, 72vw, 330px);
        border-radius: 14px;
    }

    .people-image-overlay {
        padding: 22px 18px;
    }

    .people-heading {
        font-size: clamp(1.45rem, 6.6vw, 1.85rem);
        line-height: 1.22;
    }

    .people-heading br {
        display: none;
    }

    .green-section {
        padding-inline: 16px;
    }

    .stat-card-img {
        object-position: center;
    }

    .why-attend-italic {
        padding-left: clamp(24px, 10vw, 38px);
    }

    .partner-heading {
        font-size: clamp(1.8rem, 8vw, 2.2rem);
    }

    .partner-cards {
        grid-template-columns: minmax(0, 330px);
        width: 100%;
    }

    .partner-card:last-child {
        grid-column: auto;
        width: 100%;
    }

    .info-bar-item,
    .info-bar-item:first-child,
    .info-bar-item:last-child {
        padding-inline: 4px;
    }

    .info-bar-inner > .info-bar-item:nth-of-type(3),
    .info-bar-inner > .info-bar-item:nth-of-type(7) {
        border-left: 0;
    }

    .app-section {
        padding: 48px 16px 0;
    }

    .app-section-inner {
        padding-bottom: 24px;
    }

    .app-heading,
    .app-heading-sub {
        font-size: clamp(1.85rem, 8.2vw, 2.35rem);
    }

    .app-mockup-img {
        width: 100%;
    }

    .app-mockup {
        width: 100%;
    }

    .app-bg-text {
        bottom: 8px;
        font-size: clamp(3.4rem, 16vw, 5rem);
        letter-spacing: 2px;
    }

    .cta-desc {
        font-size: 0.9rem;
        line-height: 1.6;
    }

    .footer-col {
        min-width: 0;
    }

    .footer-col-list a {
        overflow-wrap: anywhere;
    }
}

/* Very narrow phones: guard long labels and fixed decorative type. */
@media (max-width: 379.98px) {
    .brand-image {
        width: 160px;
    }

    .hero-heading {
        font-size: 1.9rem;
    }

    .hero-image-wrapper {
        height: 220px;
    }

    .expo-banner-wrapper {
        left: 12px !important;
        right: 12px !important;
        bottom: -69px !important;
    }

    .expo-banner {
        height: 138px;
    }

    .expo-upcoming {
        font-size: 1.3rem;
    }

    .expo-title {
        font-size: 2.65rem;
    }

    .expo-line {
        display: none;
    }

    .white-section {
        padding-top: 91px;
    }

    .people-image-wrapper {
        height: 225px;
    }

    .about-heading,
    .why-attend-heading,
    .partner-heading,
    .cta-heading {
        overflow-wrap: anywhere;
    }

    .why-attend-text {
        padding-left: 48px;
    }

    .stat-card,
    .stat-card-wide {
        height: 220px;
    }

    .info-bar-value {
        font-size: 1.12rem;
    }

    .footer-links {
        column-gap: 18px;
    }
}

/* Prevent the CTA columns from pinching just above the tablet breakpoint. */
@media (min-width: 992px) and (max-width: 1099.98px) {
    .cta-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 38px;
    }
}

/* Short viewports: reduce vertical pressure without moving desktop content. */
@media (max-width: 991.98px) and (max-height: 600px) and (orientation: landscape) {
    .navbar-collapse {
        max-height: calc(100dvh - 76px);
    }

    .hero-section {
        padding-top: 92px;
    }

    .hero-row {
        gap: 24px;
    }

    .hero-image-wrapper {
        height: clamp(240px, 70dvh, 330px);
    }
}

@media (min-width: 576px) and (max-width: 991.98px) and (max-height: 600px) and (orientation: landscape) {
    .hero-section {
        padding-bottom: 118px;
    }

    .hero-row {
        flex-direction: row;
        align-items: center;
    }

    .hero-content,
    .hero-image-col {
        flex: 1 1 0;
        width: 50%;
    }

    .hero-content {
        text-align: left;
    }

    .hero-heading {
        font-size: clamp(2.05rem, 4.8vw, 2.7rem);
    }

    .hero-description {
        font-size: 0.84rem;
        line-height: 1.5;
    }

    .expo-banner-wrapper {
        bottom: -78px !important;
    }

    .expo-banner {
        height: 156px;
    }

    .white-section {
        padding-top: 104px;
    }
}

@media (min-width: 992px) and (max-height: 760px) {
    .hero-row {
        min-height: 520px;
    }

    .hero-image-wrapper {
        height: 430px;
    }
}

/* Tablet expo transition: reveal more of the watermark above the banner. */
@media (min-width: 768px) and (max-width: 991.98px) {
    .expo-bg-text {
        bottom: 80px !important;
    }

    .expo-banner-wrapper {
        bottom: -150px !important;
    }

    .white-section {
        padding-top: 190px;
    }
}

/* ================================================================
   Mobile content alignment
   Keep media and form controls intact while centering page copy,
   section headings, action groups, and other presentation content.
   ================================================================ */
@media (max-width: 767.98px),
       (max-width: 991.98px) and (max-height: 600px) and (orientation: landscape) {
    .hero-content,
    .people-image-overlay,
    .about-text,
    .why-attend-inner,
    .info-bar-item,
    .about-hero-content,
    .who-we-are-content,
    .contact-hero-inner,
    .contact-info-heading,
    .contact-form-heading,
    .privacy-hero-inner,
    .privacy-policy-block,
    .privacy-cta-content,
    .exhibitor-form-heading,
    .footer-brand,
    .footer-col {
        text-align: center;
    }

    .about-text,
    .why-attend-desc,
    .about-hero-content,
    .about-hero-desc,
    .who-we-are-content,
    .contact-hero-desc,
    .cta-text,
    .footer-brand {
        margin-inline: auto;
    }

    .why-attend-italic {
        padding-left: 0;
    }

    .why-attend-row {
        grid-template-columns: minmax(0, 1fr);
        justify-items: center;
        gap: 10px;
        text-align: center;
    }

    .why-attend-num,
    .why-attend-title,
    .why-attend-text {
        grid-column: 1;
        width: 100%;
        text-align: center;
    }

    .why-attend-text {
        padding-left: 0;
        margin-inline: auto;
    }

    .info-bar-item {
        align-items: center;
    }

    .cta-inner,
    .privacy-cta-inner {
        align-items: center;
        text-align: center;
    }

    .cta-buttons,
    .privacy-cta-actions {
        width: 100%;
        justify-content: center;
    }

    .contact-info-item {
        flex-direction: column;
        align-items: center;
        gap: 12px;
        text-align: center;
    }

    .contact-info-text {
        width: 100%;
        text-align: center;
    }

    .contact-form,
    .exhibitor-registration-form {
        width: 100%;
        margin-inline: auto;
    }

    .contact-form-label,
    .contact-form-input,
    .contact-form-select,
    .contact-form-textarea,
    .contact-form-error,
    .exhibitor-field,
    .exhibitor-field label,
    .exhibitor-field input,
    .exhibitor-field select,
    .exhibitor-field textarea {
        text-align: left;
    }

    .btn-send {
        align-self: center;
    }

    .privacy-contact-list {
        width: fit-content;
        max-width: 100%;
        margin-inline: auto;
        align-items: flex-start;
    }

    .privacy-contact-list li {
        text-align: left;
    }

    .exhibitor-form-actions {
        justify-content: center;
        flex-wrap: wrap;
    }

    .booth-type-fieldset legend {
        width: 100%;
        text-align: center;
    }

    .booth-type-card {
        justify-content: center;
        text-align: center;
    }

    .booth-card-copy {
        align-items: center;
    }

    .terms-agreement,
    .review-consent-list {
        width: fit-content;
        max-width: 100%;
        margin-inline: auto;
        text-align: left;
    }

    .footer-col-list {
        align-items: center;
    }
}

@media (max-width: 575.98px),
       (max-width: 991.98px) and (max-height: 600px) and (orientation: landscape) {
    .cta-buttons,
    .privacy-cta-actions {
        align-items: center;
    }

    .btn-cta {
        width: min(100%, 320px);
    }

    .privacy-cta-actions .btn {
        width: min(100%, 260px);
    }

    .attendee-modal-dialog h2,
    .attendee-modal-intro {
        text-align: center;
    }

    .attendee-continue-btn {
        width: min(100%, 320px);
        align-self: center;
    }

    .attendee-security-note {
        flex-direction: column;
        gap: 16px;
        text-align: center;
    }
}

@media (max-width: 420px) {
    .exhibitor-form-actions {
        flex-direction: column;
        align-items: center;
    }

    .exhibitor-form-actions .btn {
        width: min(100%, 240px);
    }
}
