/* LOCAL FONTS */

@font-face {
    font-family: 'Roboto';
    src: url('fonts/Roboto-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Libre Bodoni';
    src: url('fonts/LibreBodoni-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}



/* 🔒 Anti-Fingerprint ID: p1fn */

/* ============================================
   🔄 MODERN CSS RESET
   ============================================ */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

body {
    min-height: 100vh;
    line-height: 1.6;
    overflow-x: hidden !important;
    max-width: 100vw;
    width: 100%;
    position: relative;
}

img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
    height: auto;
}

input, button, textarea, select {
    font: inherit;
}

p, h1, h2, h3, h4, h5, h6 {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

a {
    text-decoration: none;
    color: inherit;
}

ul, ol {
    list-style: none;
}


/* ============================================
   🎨 CSS VARIABLES (Design Tokens)
   Prefix: p1fn
   ============================================ */
:root {
    /* Colors */
    --p1fn-primary: #0d9488;
    --p1fn-primary-dark: color-mix(in srgb, #0d9488 80%, black);
    --p1fn-primary-light: color-mix(in srgb, #0d9488 20%, white);
    --p1fn-secondary: #14b8a6;
    --p1fn-bg: #f0fdfa;
    --p1fn-text-dark: #1a1a1a;
    --p1fn-text-gray: #6b7280;
    --p1fn-text-light: #9ca3af;
    --p1fn-border: #e5e7eb;
    
    /* Typography */
    --p1fn-font-heading: 'Roboto', system-ui, sans-serif;
    --p1fn-font-body: 'Libre Bodoni', system-ui, sans-serif;
    
    /* Spacing */
    --p1fn-space-4: 1rem;
    --p1fn-space-6: 2rem;
    --p1fn-space-8: 3rem;
    --p1fn-space-12: 5rem;
    
    /* Design */
    --p1fn-radius: 8px;
    --p1fn-shadow: 0 10px 30px rgba(0,0,0,0.2);
    --p1fn-shadow-lg: 0 10px 30px rgba(0,0,0,0.15);
    --p1fn-shadow-xl: 0 20px 50px rgba(0,0,0,0.2);
}


/* BASE STYLES */
/* 🔥 FORCED LIGHT BACKGROUND - всегда белый/светлый фон */
body {
    font-family: var(--p1fn-font-body);
    font-size: 16px;
    line-height: 1.7;
    color: #1a1a1a !important; /* Тёмный текст */
    background: #ffffff !important; /* Белый фон */
    background-color: #ffffff !important;
}

/* 🔥 ПРИНУДИТЕЛЬНО светлые секции */
section {
    background: #ffffff;
    background-color: #ffffff;
    color: #1a1a1a;
}

/* Чередующиеся светлые секции для визуального разделения */
section:nth-child(even) {
    background: #f9fafb;
    background-color: #f9fafb;
}

/* Hero секция - всегда белая */
section[class*="hero"],
.p1fn_hero,
[class*="_hero"] {
    background: #ffffff !important;
    background-color: #ffffff !important;
    color: #1a1a1a !important;
}

/* Все контейнеры внутри секций - светлый фон */
section > div,
section > * {
    color: inherit;
}

/* 🔥 Гарантируем что текст тёмный на светлом фоне (кроме футера!) */
body > *:not(footer) h1,
body > *:not(footer) h2,
body > *:not(footer) h3,
body > *:not(footer) h4,
body > *:not(footer) h5,
body > *:not(footer) h6,
section:not([class*="footer"]) h1,
section:not([class*="footer"]) h2,
section:not([class*="footer"]) h3,
section:not([class*="footer"]) h4,
section:not([class*="footer"]) h5,
section:not([class*="footer"]) h6 {
    color: #1a1a1a;
}

/* 🔥 Футер - ВСЕГДА белый текст на тёмном фоне */
footer h1, footer h2, footer h3, footer h4, footer h5, footer h6,
[class*="footer"] h1, [class*="footer"] h2, [class*="footer"] h3,
[class*="footer"] h4, [class*="footer"] h5, [class*="footer"] h6 {
    color: #ffffff !important;
}

footer p, footer span, footer div, footer li, footer a,
[class*="footer"] p, [class*="footer"] span, [class*="footer"] div,
[class*="footer"] li, [class*="footer"] a {
    color: #d1d5db !important;
}

/* Параграфы и текст в секциях (кроме футера) */
section:not([class*="footer"]) p,
section:not([class*="footer"]) span,
section:not([class*="footer"]) li,
main p, main span, main li {
    color: #374151;
}


/* TYPOGRAPHY */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--p1fn-font-heading);
    font-weight: 700;
    line-height: 1.2;
    color: var(--p1fn-text-dark);
}

h1, .p1fn_text-h1 {
    font-size: clamp(2rem, 5vw, 3.5rem);
    margin-bottom: var(--p1fn-space-6);
}

h2, .p1fn_text-h2 {
    font-size: clamp(1.75rem, 4vw, 2.625rem);
    margin-bottom: 1.5rem;
}

h3, .p1fn_text-h3 {
    font-size: clamp(1.375rem, 3.5vw, 2rem);
    margin-bottom: 1rem;
}

p {
    margin-bottom: 1rem;
    color: var(--p1fn-text-gray);
}


/* LAYOUT */
.p1fn_container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 5vw, 2.5rem);
    overflow-x: hidden;
}

section {
    padding: clamp(3rem, 8vw, 6rem) 0;
    position: relative;
    width: 100%;
    overflow-x: hidden;
}

/* 🔥 FIX: Гарантированное центрирование контента внутри секций */
section > * {
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
    padding-left: clamp(1rem, 5vw, 2.5rem);
    padding-right: clamp(1rem, 5vw, 2.5rem);
}

/* Исключения для вложенных элементов (они уже внутри родителя) */
section > * > * {
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
    max-width: 100%;
}


/* UTILITIES */
.p1fn_flex { display: flex; }
.p1fn_flex-col { flex-direction: column; }
.p1fn_items-center { align-items: center; }
.p1fn_justify-between { justify-content: space-between; }
.p1fn_gap-4 { gap: var(--p1fn-space-4); }
.p1fn_gap-6 { gap: var(--p1fn-space-6); }
.p1fn_text-center { text-align: center; }
.p1fn_rounded { border-radius: var(--p1fn-radius); }
.p1fn_rounded-xl { border-radius: 24px; }
.p1fn_shadow { box-shadow: var(--p1fn-shadow); }
.p1fn_shadow-lg { box-shadow: var(--p1fn-shadow-lg); }
.p1fn_w-full { width: 100%; }
.p1fn_mb-4 { margin-bottom: var(--p1fn-space-4); }
.p1fn_mb-6 { margin-bottom: var(--p1fn-space-6); }


/* GRID SYSTEM */
.p1fn_grid-2, .p1fn_grid-3, .p1fn_grid-4, .p1fn_grid-auto {
    display: grid;
    gap: clamp(1.5rem, 3vw, 2.5rem);
    width: 100%;
}

.p1fn_grid-auto { grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); }
.p1fn_grid-2 { grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); }
.p1fn_grid-3 { grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); }
.p1fn_grid-4 { grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); }

@media (min-width: 768px) {
    .p1fn_grid-2 { grid-template-columns: repeat(2, 1fr); }
    .p1fn_grid-3 { grid-template-columns: repeat(3, 1fr); }
    .p1fn_grid-4 { grid-template-columns: repeat(4, 1fr); }
}

.p1fn_services-grid { 
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
    gap: clamp(1.5rem, 4vw, 2.5rem);
}

.p1fn_testimonials-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
    gap: 1.5rem;
}


/* FORMS */
/* 🔥 Универсальные стили для любых форм (включая AI-generated) */
form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
}

/* Стили для label + input wrapper */
form > div,
form > label,
form > p {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    width: 100%;
}

/* Стили для inline label+input (AI иногда генерирует так) */
form label {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    font-weight: 600;
    font-size: 0.875rem;
    color: var(--p1fn-text-dark);
}

/* Базовые стили для всех полей ввода */
form input[type="text"],
form input[type="email"],
form input[type="tel"],
form input[type="number"],
form input[type="password"],
form textarea,
form select {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0.875rem 1rem;
    font-size: 1rem;
    color: var(--p1fn-text-dark);
    background: white;
    border: 2px solid var(--p1fn-border);
    border-radius: var(--p1fn-radius);
    transition: all 0.25s;
    box-sizing: border-box;
}

form input:focus,
form textarea:focus,
form select:focus {
    outline: none;
    border-color: var(--p1fn-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--p1fn-primary) 10%, transparent);
}

form textarea {
    min-height: 120px;
    resize: vertical;
}

form button[type="submit"],
form input[type="submit"] {
    width: 100%;
    margin-top: 1rem;
}

.p1fn_form-group {
    margin-bottom: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.p1fn_form-label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    font-size: 0.875rem;
    color: var(--p1fn-text-dark);
}

.p1fn_form-input,
.p1fn_form-textarea,
.p1fn_form-select {
    width: 100%;
    padding: 0.875rem 1rem;
    font-size: 1rem;
    color: var(--p1fn-text-dark);
    background: white;
    border: 2px solid var(--p1fn-border);
    border-radius: var(--p1fn-radius);
    transition: all 0.25s;
}

.p1fn_form-input:focus,
.p1fn_form-textarea:focus,
.p1fn_form-select:focus {
    outline: none;
    border-color: var(--p1fn-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--p1fn-primary) 10%, transparent);
}

.p1fn_form-checkbox {
    width: 1.25rem;
    height: 1.25rem;
    margin: 0;
    cursor: pointer;
    accent-color: var(--p1fn-primary);
}

.p1fn_form-checkbox-wrapper {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}


/* BUTTONS */
.p1fn_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.875rem 2rem;
    font-size: 1rem;
    font-weight: 600;
    border: none;
    border-radius: var(--p1fn-radius);
    cursor: pointer;
    transition: all 0.25s;
    min-height: 48px;
    min-width: 44px;
}

.p1fn_btn-primary {
    background: var(--p1fn-primary);
    color: white;
    box-shadow: var(--p1fn-shadow);
}

.p1fn_btn-primary:hover {
    background: var(--p1fn-primary-dark);
    transform: translateY(-2px);
    box-shadow: var(--p1fn-shadow-lg);
}

.p1fn_btn-secondary {
    background: white;
    color: var(--p1fn-primary);
    border: 2px solid var(--p1fn-primary);
}

.p1fn_btn-secondary:hover {
    background: var(--p1fn-primary);
    color: white;
}

.p1fn_btn-sm { padding: 0.625rem 1.25rem; font-size: 0.875rem; min-height: 40px; }
.p1fn_btn-lg { padding: 1.125rem 2.5rem; font-size: 1.125rem; min-height: 56px; }
.p1fn_btn-full { width: 100%; }


/* CARDS */
.p1fn_card {
    background: white;
    border-radius: 16px;
    box-shadow: var(--p1fn-shadow);
    padding: clamp(1.5rem, 4vw, 2.5rem);
    transition: all 0.25s;
    height: 100%;
}

.p1fn_card:hover {
    transform: translateY(-4px);
    box-shadow: var(--p1fn-shadow-xl);
}

.p1fn_card-image {
    width: 100%;
    border-radius: var(--p1fn-radius);
    margin-bottom: 1rem;
}

.p1fn_service-card {
    background: white;
    padding: clamp(2rem, 4vw, 2.5rem);
    border-radius: 16px;
    box-shadow: var(--p1fn-shadow);
    transition: all 0.25s;
}

.p1fn_service-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--p1fn-shadow-xl);
}

.p1fn_service-icon {
    width: 64px;
    height: 64px;
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--p1fn-primary) 10%, transparent);
    color: var(--p1fn-primary);
    border-radius: 12px;
    font-size: 2rem;
}

.p1fn_testimonial-card {
    background: white;
    padding: 2rem;
    border-radius: 16px;
    box-shadow: var(--p1fn-shadow);
}

.p1fn_testimonial-text p {
    font-size: 1.125rem;
    line-height: 1.8;
    margin-bottom: 1.5rem;
    font-style: italic;
}

.p1fn_testimonial-author {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.p1fn_testimonial-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
}

.p1fn_testimonial-name {
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.p1fn_testimonial-role {
    font-size: 0.875rem;
    color: var(--p1fn-text-light);
}


/* NAVIGATION */
.p1fn_header {
    position: sticky;
    top: 0;
    z-index: 1020;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    width: 100%;
    /* 🔥 НЕ используем overflow-x: hidden - это обрезает мобильное меню! */
}

.p1fn_header-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 70px;
    padding: 0 clamp(1rem, 5vw, 2.5rem);
    max-width: 1400px;
    margin: 0 auto;
    position: relative;
    /* 🔥 Убираем overflow чтобы nav мог выходить за пределы */
}

.p1fn_header-logo {
    font-size: 1.5rem;
    font-weight: 700;
    z-index: 1030;
}

.p1fn_header-nav {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.p1fn_header-link {
    font-weight: 500;
    color: var(--p1fn-text-gray);
    padding: 0.5rem 0.75rem;
    border-radius: var(--p1fn-radius);
    transition: all 0.2s;
}

.p1fn_header-link:hover {
    color: var(--p1fn-primary);
    background: color-mix(in srgb, var(--p1fn-primary) 10%, transparent);
}

/* 🔥 MOBILE MENU TOGGLE (burger button) */
/* Support both .mobile-menu-toggle and .menu-toggle for AI compatibility */
.p1fn_mobile-menu-toggle,
.p1fn_menu-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    z-index: 1030;
}

.p1fn_mobile-menu-toggle span,
.p1fn_menu-toggle span {
    width: 24px;
    height: 3px;
    background: var(--p1fn-text-dark);
    border-radius: 2px;
    transition: all 0.3s ease;
}

/* Burger animation when active */
.p1fn_mobile-menu-toggle.active span:nth-child(1),
.p1fn_menu-toggle.active span:nth-child(1) {
    transform: rotate(45deg) translate(6px, 6px);
}

.p1fn_mobile-menu-toggle.active span:nth-child(2),
.p1fn_menu-toggle.active span:nth-child(2) {
    opacity: 0;
}

.p1fn_mobile-menu-toggle.active span:nth-child(3),
.p1fn_menu-toggle.active span:nth-child(3) {
    transform: rotate(-45deg) translate(6px, -6px);
}

/* 🔥 MOBILE NAVIGATION PANEL - Uses .header-nav class for consistency */
/* On mobile, desktop .header-nav transforms to slide-in panel */
@media (max-width: 768px) {
    /* 🔥 BODY LOCK when menu is open */
    body.menu-open {
        overflow: hidden !important;
        position: fixed;
        width: 100%;
        height: 100%;
    }
    
    /* 🔥 КРИТИЧНО: Header должен разрешать выход nav за свои пределы! */
    /* Используем более специфичные селекторы чтобы не затронуть .section-header и т.д. */
    .p1fn_header,
    header:not(section):not(.p1fn_section-header):not([class*="section"]) {
        overflow: visible !important;
        /* Убираем transform и backdrop-filter которые создают stacking context */
    }
    
    .p1fn_header-container,
    header:not(section):not(.p1fn_section-header) > div {
        overflow: visible !important;
    }

    /* 🔥 КРИТИЧНО: Поддержка любого nav элемента внутри header */
    /* По умолчанию - ПОЛНОСТЬЮ СКРЫТО через display: none */
    .p1fn_header nav,
    .p1fn_header-container nav,
    .p1fn_header-nav,
    nav.p1fn_header-nav,
    header nav {
        display: none !important; /* Полностью скрыто по умолчанию */
    }
    
    /* 🔥 КРИТИЧНО: Поддержка .active для любого nav - показываем и позиционируем */
    .p1fn_header nav.active,
    .p1fn_header-container nav.active,
    .p1fn_header-nav.active,
    nav.p1fn_header-nav.active,
    header nav.active {
        display: flex !important;
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        left: auto !important;
        bottom: 0 !important;
        width: min(300px, 85vw) !important;
        max-width: 300px !important;
        height: 100vh !important;
        height: 100dvh !important;
        background: #ffffff !important;
        box-shadow: -5px 0 25px rgba(0,0,0,0.3) !important;
        z-index: 9999 !important;
        padding: 100px 1.5rem 2rem 1.5rem !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0.25rem !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        transform: translateX(0) !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* 🔥 КРИТИЧНО: Видимость и стили ссылок в мобильном меню */
    /* Поддержка любого nav внутри header */
    .p1fn_header nav a,
    .p1fn_header-container nav a,
    .p1fn_header-nav a,
    .p1fn_header-nav .p1fn_header-link,
    header nav a {
        display: block !important;
        width: 100% !important;
        padding: 1rem 1.25rem !important;
        font-size: 1.125rem !important;
        font-weight: 500 !important;
        color: #1a1a1a !important;
        background: transparent !important;
        border: none !important;
        border-radius: 10px !important;
        text-align: left !important;
        text-decoration: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        transition: background 0.2s ease, color 0.2s ease !important;
        margin-bottom: 0.25rem !important;
    }
    
    .p1fn_header nav a:hover,
    .p1fn_header-container nav a:hover,
    .p1fn_header-nav a:hover,
    .p1fn_header-nav a:focus,
    .p1fn_header-nav .p1fn_header-link:hover,
    .p1fn_header-nav .p1fn_header-link:focus,
    header nav a:hover {
        background: rgba(0, 0, 0, 0.05) !important;
        color: var(--p1fn-primary, #3b82f6) !important;
    }
    
    /* Стили для кнопки CTA в мобильном меню */
    .p1fn_header nav .p1fn_btn,
    .p1fn_header-container nav .p1fn_btn,
    .p1fn_header-nav .p1fn_btn,
    .p1fn_header-nav [class*="_btn"],
    header nav [class*="btn"] {
        width: 100% !important;
        margin-top: 1.5rem !important;
        padding: 1rem 1.5rem !important;
        justify-content: center !important;
        display: flex !important;
        font-weight: 600 !important;
    }
}

/* 🔥 OVERLAY for mobile nav (mobile only) */
.p1fn_nav-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,0.5);
    backdrop-filter: blur(3px);
    z-index: 1024;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s;
    pointer-events: none; /* Prevent clicks when hidden */
}

.p1fn_nav-overlay.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto; /* Enable clicks when visible */
}


/* HERO */
.p1fn_hero {
    min-height: clamp(500px, 80vh, 700px);
    display: flex;
    align-items: center;
    padding: clamp(4rem, 10vw, 8rem) 0;
    width: 100%;
}

.p1fn_hero-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(2rem, 5vw, 4rem);
    align-items: center;
    width: 100%;
}

@media (min-width: 768px) {
    .p1fn_hero-grid {
        grid-template-columns: 1fr 1fr;
        align-items: center;
        justify-items: start;
    }
}

.p1fn_hero-content {
    width: 100%;
}

.p1fn_hero-title {
    font-size: clamp(2.5rem, 6vw, 4rem);
    font-weight: 800;
    line-height: 1.1;
    margin-bottom: 1.5rem;
}

.p1fn_hero-description {
    font-size: clamp(1.125rem, 2vw, 1.375rem);
    line-height: 1.7;
    color: var(--p1fn-text-gray);
    margin-bottom: 2rem;
}

.p1fn_hero-cta {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.p1fn_hero-image {
    width: 100%;
    border-radius: 24px;
    box-shadow: var(--p1fn-shadow-xl);
}

/* 🔥 CONTACT GRID - адаптивная сетка для контактной секции */
.p1fn_contact-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(2rem, 5vw, 3rem);
    align-items: start;
    width: 100%;
}

@media (min-width: 768px) {
    .p1fn_contact-grid {
        grid-template-columns: 1fr 1fr;
        align-items: start;
    }
}

.p1fn_contact-info {
    width: 100%;
}

.p1fn_contact-img {
    width: 100%;
    max-width: 100%;
    border-radius: 16px;
    object-fit: cover;
}


/* SECTIONS */
.p1fn_section-header {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 3rem;
}

.p1fn_section-title {
    font-size: clamp(2rem, 5vw, 3rem);
    margin-bottom: 1rem;
}

.p1fn_section-description {
    font-size: 1.25rem;
    color: var(--p1fn-text-gray);
}

.p1fn_faq-list {
    max-width: 800px;
    margin: 0 auto;
}

.p1fn_faq-item {
    padding: 1.5rem 0;
    border-bottom: 1px solid var(--p1fn-border);
}

.p1fn_faq-question {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
}

.p1fn_faq-answer {
    color: var(--p1fn-text-gray);
}


/* FOOTER */
.p1fn_footer {
    background: #111827;
    color: #e5e7eb; /* Lighter text for better contrast */
    padding: 5rem 0 2rem;
    width: 100%;
    overflow-x: hidden;
}

.p1fn_footer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
    margin-bottom: 3rem;
}

.p1fn_footer-column h3 {
    color: #ffffff; /* Pure white for headings */
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.p1fn_footer-link {
    display: block;
    color: #d1d5db;
    padding: 0.5rem 0;
    transition: color 0.2s;
}

.p1fn_footer-link:hover {
    color: var(--p1fn-primary);
    text-decoration: underline;
}

.p1fn_footer-bottom {
    padding-top: 2rem;
    border-top: 1px solid rgba(255,255,255,0.1);
    text-align: center;
}

.p1fn_footer-disclaimer {
    font-size: 0.875rem;
    line-height: 1.6;
    opacity: 0.7;
    margin-top: 2rem;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 1rem;
    word-wrap: break-word;
    overflow-wrap: break-word;
    text-align: center;
}


/* RESPONSIVE */
@media (max-width: 768px) {
    section { padding: 3rem 0; }
    
    .p1fn_grid-2, .p1fn_grid-3, .p1fn_grid-4,
    .p1fn_services-grid, .p1fn_testimonials-grid,
    .p1fn_hero-grid, .p1fn_contact-grid {
        grid-template-columns: 1fr !important;
    }
    
    .p1fn_btn { width: 100%; max-width: 400px; }
    .p1fn_hero-cta { flex-direction: column; align-items: stretch; }
    
    /* 🔥 Изображения на полную ширину */
    .p1fn_hero-image,
    .p1fn_about-img,
    .p1fn_contact-img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }
    
    /* 🔥 CRITICAL: Show burger menu on mobile */
    .p1fn_mobile-menu-toggle,
    .p1fn_menu-toggle {
        display: flex !important;
    }
}

@media (min-width: 769px) {
    /* 🔥 CRITICAL: Hide burger on desktop */
    .p1fn_mobile-menu-toggle,
    .p1fn_menu-toggle,
    [class*="mobile-menu-toggle"],
    [class*="menu-toggle"],
    button[aria-label*="menu"] {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
    
    .p1fn_nav-overlay,
    [class*="nav-overlay"],
    [class*="overlay"] {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
    
    /* 🔥 CRITICAL: Ensure desktop nav is visible and positioned normally */
    /* Поддержка любого nav внутри header */
    .p1fn_header nav,
    .p1fn_header-container nav,
    .p1fn_header-nav,
    header nav {
        position: static !important;
        width: auto !important;
        height: auto !important;
        max-width: none !important;
        background: transparent !important;
        box-shadow: none !important;
        padding: 0 !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 1.5rem !important;
        display: flex !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        overflow: visible !important;
        z-index: auto !important;
    }
    
    /* Desktop nav links - исключаем кнопки (.btn) */
    .p1fn_header nav a:not([class*="btn"]),
    .p1fn_header-container nav a:not([class*="btn"]),
    .p1fn_header-nav a:not([class*="btn"]),
    .p1fn_header-nav .p1fn_header-link,
    header nav a:not([class*="btn"]) {
        display: inline-flex !important;
        width: auto !important;
        padding: 0.5rem 0.75rem !important;
        font-size: 1rem !important;
        font-weight: 500 !important;
        margin-bottom: 0 !important;
        background: transparent !important;
    }
    
    /* 🔥 Desktop CTA buttons in nav - сохраняем стили кнопок */
    .p1fn_header nav a[class*="btn"],
    .p1fn_header-container nav a[class*="btn"],
    .p1fn_header-nav a[class*="btn"],
    header nav a[class*="btn"] {
        display: inline-flex !important;
        width: auto !important;
        padding: 0.625rem 1.25rem !important;
        font-size: 0.875rem !important;
        font-weight: 600 !important;
        margin-bottom: 0 !important;
        /* НЕ перезаписываем background - кнопка должна иметь свой цвет! */
    }
}

@media (min-width: 1024px) {
    section { padding: clamp(4rem, 10vw, 7.5rem) 0; }
}


/* ANIMATIONS */
@keyframes p1fn_fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}


/* ACCESSIBILITY */
*:focus-visible {
    outline: 2px solid var(--p1fn-primary);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}