:root {
    --primary-color: #2596be;
    --secondary-color: #08958e;
    --dark-bg: #0f0f0f;
    --card-bg: #1a1a1a;
    --text-primary: #ffffff;
    --text-secondary: #b0b0b0;
    --error-color: #ff6b6b;
    --border-color: #2a2a2a;
    --success-color: #51cf66;
    --transition-speed: 0.3s;
}

/* Reset and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
    background-color: var(--dark-bg);
    color: var(--text-primary);
    line-height: 1.6;
    overflow-x: hidden;
}

/* Page Container System */
.page {
    display: none;
    opacity: 0;
    transition: opacity var(--transition-speed) ease-in-out;
    min-height: 100vh;
}

.page.active {
    display: flex;
    flex-direction: column;
    opacity: 1;
}

/* Header Styles */
.header {
    background-color: var(--card-bg);
    border-bottom: 1px solid var(--border-color);
    padding: 0.6rem 0;
    position: sticky;
    top: 0;
    z-index: 100;
    backdrop-filter: blur(10px);
    background-color: rgba(26, 26, 26, 0.95);
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 2rem;
}

@media (min-width: 1200px) {
    .header-container {
        padding: 0 4rem;
    }
}

@media (min-width: 1600px) {
    .header-container {
        padding: 0 6rem;
    }
}

@media (min-width: 1900px) {
    .header-container {
        padding: 0 8rem;
    }
}

@media (min-width: 2400px) {
    .header-container {
        padding: 0 10rem;
    }
}

.logo {
    display: flex;
    align-items: center;
    gap: 1rem;
    cursor: pointer;
    transition: transform var(--transition-speed) ease;
}

.logo:hover {
    transform: scale(1.02);
}

.logo-icon {
    width: 100%;
    height: auto;
    max-width: 398px;
    object-fit: contain;
    filter: drop-shadow(0 0 8px rgba(37, 150, 190, 0.4));
}

.logo-text {
    font-size: 2.8rem;
    font-weight: 550;
    letter-spacing: 2px;
    color: #f5f5f5;
}

.signup-btn {
    background: linear-gradient(90deg, #0060a6, #00787b 50%, #009241);
    color: #0f0f0f;
    border: none;
    padding: 0.7rem 1.8rem;
    border-radius: 6px;
    font-weight: 700;
    font-size: 0.95rem;
    cursor: pointer;
    transition: all var(--transition-speed) ease;
    text-transform: uppercase;
    letter-spacing: 1px;
    box-shadow: 0 4px 15px rgba(0, 217, 217, 0.2);
}

.signup-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 217, 217, 0.4);
}

.signup-btn:active {
    transform: translateY(0);
}

/* Calculator Page Styles */
.calculator-container {
    flex: 1;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2rem;
    background: linear-gradient(135deg, #0f0f0f 0%, #1a1a1a 100%);
    position: relative;
    overflow: hidden;
}

.calculator-container::before {
    content: 'MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL';
    position: fixed;
    top: 40%;
    left: 60%;
    width: 200vw;
    height: 250vh;
    transform: translate(-50%, -50%) rotate(45deg);
    font-size: 2.5rem;
    font-weight: 550;
    color: rgba(245, 245, 245, 0.03);
    white-space: normal;
    pointer-events: none;
    z-index: 0;
    line-height: 1.8;
    letter-spacing: 2px;
    font-family: inherit;
}

.calculator-card {
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 3rem;
    width: 100%;
    max-width: 500px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    position: relative;
    z-index: 1;
    margin-top: -90px;
}

.calculator-title {
    font-size: 2.2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    background: linear-gradient(90deg, #0060a6, #00787b 50%, #009241);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    overflow-wrap: break-word;
    word-break: break-word;
    word-wrap: break-word;
    white-space: normal;
    display: block;
    max-width: 100%;
    width: 100%;
}

.calculator-subtitle {
    font-size: 1rem;
    color: var(--text-secondary);
    margin-bottom: 2.5rem;
}

/* Form Styles */
.form-group {
    margin-bottom: 2rem;
    display: flex;
    flex-direction: column;
}

.form-label {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 0.7rem;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.required-asterisk {
    color: var(--error-color);
    font-weight: 700;
}

.form-input {
    background-color: rgba(45, 45, 45, 0.5);
    border: 1.5px solid var(--border-color);
    color: var(--text-primary);
    padding: 1rem;
    border-radius: 8px;
    font-size: 1rem;
    transition: all var(--transition-speed) ease;
    font-family: inherit;
}

.form-input::placeholder {
    color: rgba(176, 176, 176, 0.5);
}

.form-input:focus {
    outline: none;
    border-color: var(--primary-color);
    background-color: rgba(45, 45, 45, 0.8);
    box-shadow: 0 0 0 3px rgba(0, 217, 217, 0.1);
}

/* Input Wrapper for Followers */
.input-wrapper {
    position: relative;
}

.input-description {
    font-size: 0.75rem;
    color: var(--text-secondary);
    margin-top: 0.4rem;
    font-style: italic;
}

/* Dropdown Styles */
.dropdown-wrapper {
    position: relative;
}

.dropdown-search {
    width: 100%;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background-color: var(--card-bg);
    border: 1.5px solid var(--border-color);
    border-top: none;
    border-radius: 0 0 8px 8px;
    max-height: 250px;
    overflow-y: auto;
    z-index: 10;
    display: none;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}

.dropdown-menu.open {
    display: block;
}

.dropdown-item {
    padding: 0.75rem 1rem;
    cursor: pointer;
    transition: background-color var(--transition-speed) ease;
    font-size: 0.95rem;
    border-bottom: 1px solid rgba(42, 42, 42, 0.3);
}

.dropdown-item:last-child {
    border-bottom: none;
}

.dropdown-item:hover,
.dropdown-item.selected {
    background-color: rgba(0, 217, 217, 0.15);
    color: var(--primary-color);
}

/* Scrollbar Styling */
.dropdown-menu::-webkit-scrollbar {
    width: 6px;
}

.dropdown-menu::-webkit-scrollbar-track {
    background: transparent;
}

.dropdown-menu::-webkit-scrollbar-thumb {
    background: var(--primary-color);
    border-radius: 3px;
}

.dropdown-menu::-webkit-scrollbar-thumb:hover {
    background: var(--secondary-color);
}

/* Error Messages */
.error-message {
    color: var(--error-color);
    font-size: 0.8rem;
    margin-top: 0.4rem;
    min-height: 1.2rem;
    display: none;
}

.error-message.show {
    display: block;
}

/* Email Disclaimer */
.email-disclaimer {
    font-size: 0.7rem;
    color: var(--text-secondary);
    margin-top: 0.6rem;
    line-height: 1.4;
    font-weight: 500;
}

/* Slider Styles */
.slider-wrapper {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.form-slider {
    width: 100%;
    height: 8px;
    border-radius: 5px;
    background: linear-gradient(to right, #00d9d9, #08958e);
    outline: none;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
}

.form-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--primary-color);
    cursor: pointer;
    border: 3px solid var(--card-bg);
    box-shadow: 0 2px 8px rgba(0, 217, 217, 0.3);
    transition: all var(--transition-speed) ease;
}

.form-slider::-webkit-slider-thumb:hover {
    background: var(--secondary-color);
    box-shadow: 0 4px 12px rgba(0, 217, 217, 0.5);
    transform: scale(1.1);
}

.form-slider::-moz-range-thumb {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--primary-color);
    cursor: pointer;
    border: 3px solid var(--card-bg);
    box-shadow: 0 2px 8px rgba(0, 217, 217, 0.3);
    transition: all var(--transition-speed) ease;
}

.form-slider::-moz-range-thumb:hover {
    background: var(--secondary-color);
    box-shadow: 0 4px 12px rgba(0, 217, 217, 0.5);
    transform: scale(1.1);
}

.form-slider::-moz-range-track {
    background: transparent;
    border: none;
}

.form-slider::-moz-range-progress {
    background: linear-gradient(to right, #00d9d9, #08958e);
}

.price-input {
    text-align: center;
    font-size: 1.1rem;
    font-weight: 600;
    color: #00d9d9;
    font-family: 'Courier New', monospace;
    letter-spacing: 0.05em;
    pointer-events: none;
    cursor: default;
}

.price-input::selection {
    background-color: transparent;
}

/* Calculate Button */
.calculate-btn {
    background: linear-gradient(90deg, #0060a6, #00787b 50%, #009241);
    color: #0f0f0f;
    border: none;
    padding: 1rem 2rem;
    border-radius: 8px;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: all var(--transition-speed) ease;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 1.5rem;
    box-shadow: 0 8px 20px rgba(0, 217, 217, 0.3);
    width: 100%;
}

.calculate-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(0, 217, 217, 0.4);
}

.calculate-btn:active {
    transform: translateY(-1px);
}

/* Results Page Styles */
.results-container {
    flex: 1;
    max-width: 1200px;
    margin: 0 auto;
    padding: 3rem 2rem;
    width: 100%;
    background: linear-gradient(135deg, #0f0f0f 0%, #1a1a1a 100%);
    position: relative;
    overflow: hidden;
}

.results-container::before {
    content: 'MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL  MY CHANNEL';
    position: fixed;
    top: 40%;
    left: 60%;
    width: 200vw;
    height: 250vh;
    transform: translate(-50%, -50%) rotate(45deg);
    font-size: 2.5rem;
    font-weight: 550;
    color: rgba(245, 245, 245, 0.03);
    white-space: normal;
    pointer-events: none;
    z-index: 0;
    line-height: 1.5;
    letter-spacing: 2px;
}

.results-container::before {
    display: none;
}

.results-section {
    margin-bottom: 3rem;
    animation: slideUp 0.6s ease-out forwards;
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.results-section:nth-child(1) {
    animation-delay: 0s;
}

.results-section:nth-child(2) {
    animation-delay: 0.1s;
}

.results-section:nth-child(3) {
    animation-delay: 0.2s;
}

.results-section:nth-child(4) {
    animation-delay: 0.3s;
}

.results-section:nth-child(5) {
    animation-delay: 0.4s;
}

.results-section:nth-child(6) {
    animation-delay: 0.5s;
}

/* Earnings Section */
.earnings-section {
    text-align: center;
    padding: 2rem 0;
}

.earnings-title {
    font-size: 1.5rem;
    color: var(--text-secondary);
    margin-bottom: 1.5rem;
    font-weight: 500;
}

.earnings-display {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.currency-symbol {
    font-size: 2.5rem;
    color: var(--primary-color);
    font-weight: 700;
}

.earnings-amount {
    font-size: 4rem;
    font-weight: 700;
    background: linear-gradient(90deg, #0060a6, #00787b 50%, #009241);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1;
}

.earnings-period {
    font-size: 1.2rem;
    color: var(--text-secondary);
    font-weight: 500;
}

.earnings-subtitle {
    color: var(--text-secondary);
    font-size: 0.95rem;
}

/* Disclaimer Section */
.disclaimer-section {
    background-color: rgba(0, 217, 217, 0.05);
    border: 1px solid rgba(0, 217, 217, 0.15);
    padding: 1.5rem;
    border-radius: 8px;
    text-align: center;
}

.disclaimer-text {
    color: var(--text-secondary);
    font-size: 0.95rem;
    line-height: 1.6;
}

/* Fee Section */
.fee-section {
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    padding: 2.5rem;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}

.fee-content {
    margin-bottom: 2rem;
}

.section-heading {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    background: linear-gradient(90deg, #0060a6, #00787b 50%, #009241);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.fee-highlight {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.fee-amount {
    font-size: 3.5rem;
    font-weight: 700;
    color: var(--primary-color);
    min-width: 120px;
}

.fee-description {
    color: var(--text-secondary);
    font-size: 0.95rem;
    line-height: 1.6;
}

.highlight-bold {
    color: var(--text-primary);
    font-weight: 700;
}

.primary-cta {
    width: 100%;
    padding: 1.1rem 2rem;
    font-size: 1rem;
}

/* Advantage Section */
.advantage-section {
    background-color: rgba(0, 217, 217, 0.08);
    border: 1px solid rgba(0, 217, 217, 0.15);
    padding: 2.5rem;
    border-radius: 12px;
}

.advantage-text {
    color: var(--text-secondary);
    font-size: 1rem;
    line-height: 1.8;
}

/* Features Section */
.features-section {
    padding: 2rem 0;
}

.features-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1.5rem;
    max-width: 100%;
}

.feature-link {
    text-decoration: none !important;
    color: inherit !important;
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
}

.feature-link:hover {
    text-decoration: none !important;
}

.feature-link:focus {
    outline: none !important;
    text-decoration: none !important;
    border: none !important;
    box-shadow: none !important;
}

.feature-link:visited {
    color: inherit !important;
}

.feature-link:active {
    outline: none !important;
    text-decoration: none !important;
    border: none !important;
}

.feature-box {
    background-color: var(--card-bg);
    border: 2px solid var(--border-color);
    border-radius: 16px;
    padding: 2rem 1.5rem;
    text-align: center;
    transition: all var(--transition-speed) ease;
    cursor: pointer;
}

.feature-box:hover {
    border-color: var(--primary-color);
    box-shadow: 0 8px 30px rgba(0, 217, 217, 0.2);
    transform: translateY(-5px);
}

.feature-icon {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    display: flex;
    justify-content: center;
}

.feature-icon svg {
    width: 50px;
    height: 50px;
    filter: drop-shadow(0 0 8px rgba(0, 217, 217, 0.2));
}

.feature-name {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-primary);
    margin: 0;
}

/* Final CTA Section */
.final-cta-section {
    text-align: center;
    padding: 2rem 0;
}

.primary-cta.large {
    max-width: 500px;
    margin: 0 auto;
    padding: 1.3rem 2.5rem;
    font-size: 1.1rem;
}

/* Recalculate Button */
.recalculate-btn {
    background: linear-gradient(90deg, #0060a6, #00787b 50%, #009241);
    color: #0f0f0f;
    border: none;
    padding: 0.7rem 1.5rem;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 600;
    transition: all var(--transition-speed) ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.7;
}

.recalculate-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 217, 217, 0.3);
}

.recalculate-btn:active {
    transform: translateY(-1px);
}

/* Responsive Design */

/* Smaller desktops (14-inch and smaller) - up to ~1400px */
@media (max-width: 1400px) {
    .calculator-title {
        font-size: 1.8rem;
    }
    .features-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

/* Small phones and tablets */
@media (max-width: 480px) {
    .calculator-card {
        margin-top: 0;
    }
    .header {
        padding: 0.8rem 0;
    }

    .form-slider {
        height: 8px;
    }

    .form-slider::-webkit-slider-thumb {
        width: 24px;
        height: 24px;
    }

    .form-slider::-moz-range-thumb {
        width: 24px;
        height: 24px;
    }

    .header-container {
        gap: 0.5rem;
    }

    .logo-icon {
        max-width: 200px;
    }

    .logo-text {
        font-size: 1rem;
        letter-spacing: 0.5px;
    }

    .calculator-card {
        padding: 1.5rem 1rem;
    }

    .calculator-title {
        font-size: 1.2rem;
        overflow-wrap: break-word;
        word-break: break-word;
    }
    
    .features-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .calculator-container {
        padding: 1rem;
    }

    .results-container {
        padding: 1rem 0.75rem;
    }

    .earnings-amount {
        font-size: 2.5rem;
    }

    .currency-symbol {
        font-size: 1.5rem;
    }

    .earnings-period {
        font-size: 0.9rem;
    }

    .feature-box {
        padding: 1rem 0.75rem;
    }

    .feature-icon {
        font-size: 1.8rem;
    }

    .fee-highlight {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 1rem;
    }

    .fee-amount {
        font-size: 2rem;
        min-width: auto;
    }

    .section-heading {
        font-size: 1.2rem;
    }

    .recalculate-btn {
        left: 1rem;
        bottom: 1rem;
        padding: 0.6rem 1.2rem;
        font-size: 0.75rem;
    }

    .signup-btn {
        padding: 0.6rem 1.2rem;
        font-size: 0.8rem;
    }
}

@media (min-width: 481px) and (max-width: 768px) {
    .calculator-card {
        margin-top: -30px;
    }
    .logo-icon {
        max-width: 240px;
    }

    .calculator-title {
        font-size: 1.5rem;
        overflow-wrap: break-word;
    }

    .form-slider {
        height: 8px;
    }

    .form-slider::-webkit-slider-thumb {
        width: 24px;
        height: 24px;
    }

    .form-slider::-moz-range-thumb {
        width: 24px;
        height: 24px;
    }
    
    .features-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* Medium devices 769px - 900px */
@media (min-width: 769px) and (max-width: 900px) {
    .calculator-card {
        margin-top: -50px;
    }
    .logo-icon {
        max-width: 280px;
    }

    .calculator-title {
        font-size: 1.9rem;
    }

    .form-slider {
        height: 8px;
    }

    .form-slider::-webkit-slider-thumb {
        width: 24px;
        height: 24px;
    }

    .form-slider::-moz-range-thumb {
        width: 24px;
        height: 24px;
    }
    
    .features-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* Large desktops 901px+ */
@media (min-width: 901px) {
    .features-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

/* Footer Styles */
footer.footer {
    background-color: var(--card-bg);
    border-top: 1px solid var(--border-color);
    padding: 3rem 2rem 1.5rem;
    margin-top: 3rem;
    width: 100%;
    position: relative;
    z-index: 10;
}

.footer-content {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 2rem;
    margin-bottom: 2rem;
}

.footer-section h4 {
    color: var(--text-primary);
    font-size: 0.95rem;
    font-weight: 600;
    margin-bottom: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

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

.footer-section li {
    margin-bottom: 0.6rem;
}

.footer-section a {
    color: var(--text-secondary);
    text-decoration: none;
    font-size: 0.85rem;
    transition: color var(--transition-speed) ease;
}

.footer-section a:hover {
    color: var(--primary-color);
}

.footer-bottom {
    max-width: 1200px;
    margin: 0 auto;
    padding-top: 2rem;
    border-top: 1px solid var(--border-color);
    text-align: center;
    color: var(--text-secondary);
    font-size: 0.8rem;
}