/* Fix iOS Safari scrollbar and viewport issues */
html, body {
    overflow-x: hidden;
    max-width: 100vw;
}

body {
    -webkit-overflow-scrolling: touch;
}

/* Prevent horizontal scroll on iOS */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/* Fix viewport width calculation on iOS */
.container-full {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
}

/* Hide scrollbar only on iOS Safari while keeping functionality */
@supports (-webkit-touch-callout: none) {
    ::-webkit-scrollbar {
        width: 0px;
        background: transparent;
    }
}

/* Ensure content doesn't expand beyond viewport while maintaining proper padding */
@media (max-width: 639px) {
    .max-w-7xl, .max-w-4xl {
        max-width: calc(100vw - 2rem);
        margin-left: 1rem;
        margin-right: 1rem;
    }
    
    /* Ensure Hero content has proper padding on mobile */
    .hero-content {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

/* Smooth scrolling and reduce sidebar jitter */
html {
    scroll-behavior: smooth;
}

/* Ensure sidebar stays perfectly fixed */
.sidebar-fixed {
    will-change: auto;
    transform: translateZ(0);
    backface-visibility: hidden;
}

/* Improve rendering performance */
aside {
    contain: layout style paint;
}

/* Scroll margin for anchor links to account for fixed navbar */
section[id] {
    scroll-margin-top: 5rem; /* 64px navbar + 16px extra spacing */
}

h1[id], h2[id], h3[id] {
    scroll-margin-top: 5rem;
}