/*
Theme Name: Custom Auto Theme
Author: System
Version: 1.0
*/
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { scroll-behavior: smooth; font-size: 16px; } body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif; color: #0a0a0a; background: #fafafa; line-height: 1.7; } :root { --bg-main: #fafafa; --bg-secondary: #f5f5f5; --bg-white: #ffffff; --accent-red: #e63946; --accent-red-dark: #d62828; --text-primary: #0a0a0a; --text-secondary: #4a4a4a; --border: #e0e0e0; --shadow: 0 2px 8px rgba(0,0,0,0.08); } .zurnexi-header { background: var(--bg-white); border-bottom: 3px solid var(--accent-red); position: sticky; top: 0; z-index: 100; box-shadow: var(--shadow); } .zurnexi-header-inner { max-width: 1400px; margin: 0 auto; padding: 16px 24px; display: flex; justify-content: space-between; align-items: center; } .zurnexi-logo { font-size: 2.5rem; font-weight: 900; color: var(--accent-red); letter-spacing: -0.05em; text-decoration: none; text-transform: uppercase; } .zurnexi-nav { display: flex; gap: 32px; align-items: center; } .zurnexi-nav a { font-size: 0.9rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-primary); text-decoration: none; transition: color 0.2s; position: relative; } .zurnexi-nav a::after { content: ''; position: absolute; bottom: -4px; left: 0; width: 0; height: 3px; background: var(--accent-red); transition: width 0.3s; } .zurnexi-nav a:hover { color: var(--accent-red); } .zurnexi-nav a:hover::after { width: 100%; } .zurnexi-burger { display: none; flex-direction: column; gap: 6px; cursor: pointer; background: none; border: none; padding: 8px; } .zurnexi-burger span { display: block; width: 28px; height: 3px; background: var(--text-primary); transition: all 0.3s; } .zurnexi-hero { background: var(--bg-white); border-bottom: 2px solid var(--border); padding: 80px 24px 60px; min-height: 75vh; display: flex; align-items: center; } .zurnexi-hero-inner { max-width: 1000px; margin: 0 auto; } .zurnexi-hero-tag { display: inline-block; background: var(--accent-red); color: #fff; font-size: 0.7rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.15em; padding: 6px 16px; margin-bottom: 24px; } .zurnexi-hero-title { font-size: clamp(2.5rem, 6vw, 4.5rem); font-weight: 900; line-height: 1.1; color: var(--text-primary); margin-bottom: 24px; letter-spacing: -0.02em; } .zurnexi-hero-subtitle { font-size: clamp(1.1rem, 2vw, 1.4rem); color: var(--text-secondary); max-width: 800px; line-height: 1.6; font-weight: 400; } .zurnexi-main { max-width: 1400px; margin: 0 auto; padding: 60px 24px; display: grid; grid-template-columns: 1fr 380px; gap: 60px; align-items: start; } .zurnexi-content { max-width: 800px; } .zurnexi-section { margin-bottom: 48px; } .zurnexi-section h2 { font-size: clamp(1.8rem, 3vw, 2.4rem); font-weight: 900; color: var(--text-primary); margin-bottom: 20px; line-height: 1.2; } .zurnexi-section h3 { font-size: clamp(1.4rem, 2.5vw, 1.8rem); font-weight: 800; color: var(--text-primary); margin: 32px 0 16px; } .zurnexi-section p { font-size: 1.05rem; color: var(--text-secondary); margin-bottom: 16px; line-height: 1.75; } .zurnexi-highlight { background: var(--accent-red); color: #fff; padding: 36px 40px; margin: 48px 0; border-radius: 0; position: relative; overflow: hidden; } .zurnexi-highlight::before { content: ''; position: absolute; top: -20px; right: -20px; width: 100px; height: 100px; background: rgba(255,255,255,0.1); border-radius: 50%; } .zurnexi-highlight h3 { color: #fff; font-size: 1.6rem; font-weight: 900; margin-bottom: 16px; text-transform: uppercase; letter-spacing: 0.05em; } .zurnexi-highlight p { color: rgba(255,255,255,0.95); font-size: 1.1rem; line-height: 1.7; margin-bottom: 0; } .zurnexi-checklist { background: var(--bg-white); border-left: 5px solid var(--accent-red); padding: 32px 36px; margin: 40px 0; box-shadow: var(--shadow); } .zurnexi-checklist h3 { font-size: 1.4rem; font-weight: 800; margin-bottom: 20px; color: var(--text-primary); } .zurnexi-checklist ul { list-style: none; } .zurnexi-checklist li { padding: 12px 0; font-size: 1.05rem; color: var(--text-secondary); border-bottom: 1px solid var(--border); position: relative; padding-left: 36px; } .zurnexi-checklist li:last-child { border-bottom: none; } .zurnexi-checklist li::before { content: '✓'; position: absolute; left: 0; color: var(--accent-red); font-weight: 900; font-size: 1.3rem; } .zurnexi-tips { background: linear-gradient(135deg, #fff 0%, var(--bg-secondary) 100%); border: 3px solid var(--accent-red); padding: 32px 36px; margin: 40px 0; } .zurnexi-tips h3 { font-size: 1.4rem; font-weight: 800; color: var(--accent-red); margin-bottom: 20px; text-transform: uppercase; letter-spacing: 0.05em; } .zurnexi-tips ul { list-style: none; } .zurnexi-tips li { padding: 10px 0; font-size: 1.05rem; color: var(--text-secondary); line-height: 1.7; padding-left: 24px; position: relative; } .zurnexi-tips li::before { content: '→'; position: absolute; left: 0; color: var(--accent-red); font-weight: 900; } .zurnexi-quote { background: var(--bg-white); border-left: 6px solid var(--text-primary); padding: 40px 48px; margin: 48px 0; box-shadow: var(--shadow); } .zurnexi-quote blockquote { font-size: 1.4rem; font-style: italic; line-height: 1.6; color: var(--text-primary); font-weight: 500; margin-bottom: 16px; } .zurnexi-quote cite { font-size: 1rem; color: var(--text-secondary); font-style: normal; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; } .zurnexi-img { margin: 48px 0; } .zurnexi-img img { width: 100%; height: auto; display: block; border: 3px solid var(--border); } .zurnexi-img figcaption { font-size: 0.85rem; color: var(--text-secondary); margin-top: 12px; font-style: italic; text-align: center; } .zurnexi-sidebar { position: sticky; top: 100px; } .zurnexi-sidebar-block { background: var(--bg-white); border: 2px solid var(--border); padding: 28px 24px; margin-bottom: 32px; box-shadow: var(--shadow); } .zurnexi-sidebar-block h3 { font-size: 1.1rem; font-weight: 900; color: var(--text-primary); margin-bottom: 20px; text-transform: uppercase; letter-spacing: 0.1em; padding-bottom: 12px; border-bottom: 3px solid var(--accent-red); } .zurnexi-sidebar-post { padding: 16px 0; border-bottom: 1px solid var(--border); } .zurnexi-sidebar-post:last-child { border-bottom: none; } .zurnexi-sidebar-post span { display: block; font-size: 0.7rem; color: var(--accent-red); font-weight: 900; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 6px; } .zurnexi-sidebar-post a { font-size: 1rem; font-weight: 700; color: var(--text-primary); text-decoration: none; display: block; line-height: 1.4; transition: color 0.2s; } .zurnexi-sidebar-post a:hover { color: var(--accent-red); } .zurnexi-newsletter { background: var(--text-primary); color: #fff; padding: 32px 28px; margin-bottom: 32px; } .zurnexi-newsletter h3 { font-size: 1.2rem; font-weight: 900; margin-bottom: 12px; text-transform: uppercase; letter-spacing: 0.05em; } .zurnexi-newsletter p { font-size: 0.9rem; color: rgba(255,255,255,0.85); margin-bottom: 20px; line-height: 1.6; } .zurnexi-newsletter input { width: 100%; padding: 14px 16px; border: none; font-size: 0.95rem; margin-bottom: 12px; font-family: inherit; } .zurnexi-newsletter button { width: 100%; padding: 14px; background: var(--accent-red); color: #fff; border: none; font-weight: 900; font-size: 0.95rem; text-transform: uppercase; letter-spacing: 0.1em; cursor: pointer; transition: background 0.2s; } .zurnexi-newsletter button:hover { background: var(--accent-red-dark); } .zurnexi-footer { background: var(--text-primary); color: rgba(255,255,255,0.7); padding: 48px 24px 24px; margin-top: 80px; } .zurnexi-footer-inner { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; margin-bottom: 32px; } .zurnexi-footer h4 { color: #fff; font-size: 1rem; font-weight: 900; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 16px; } .zurnexi-footer p, .zurnexi-footer li { font-size: 0.9rem; line-height: 1.7; } .zurnexi-footer ul { list-style: none; } .zurnexi-footer a { color: rgba(255,255,255,0.6); text-decoration: none; transition: color 0.2s; } .zurnexi-footer a:hover { color: #fff; } .zurnexi-footer-bottom { max-width: 1400px; margin: 0 auto; padding-top: 24px; border-top: 1px solid rgba(255,255,255,0.1); text-align: center; font-size: 0.8rem; } .zurnexi-disclaimer { max-width: 1000px; margin: 32px auto 0; font-size: 0.75rem; line-height: 1.6; color: rgba(255,255,255,0.5); text-align: center; } .zurnexi-success { text-align: center; padding: 100px 24px; max-width: 800px; margin: 0 auto; } .zurnexi-success h1 { font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 900; color: var(--text-primary); margin-bottom: 24px; } .zurnexi-success p { font-size: 1.2rem; color: var(--text-secondary); margin-bottom: 32px; line-height: 1.6; } .zurnexi-success a { display: inline-block; background: var(--accent-red); color: #fff; padding: 16px 40px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.1em; text-decoration: none; transition: background 0.2s; } .zurnexi-success a:hover { background: var(--accent-red-dark); } .zurnexi-legal { max-width: 1000px; margin: 0 auto; padding: 60px 24px; } .zurnexi-legal h1 { font-size: clamp(2rem, 4vw, 3rem); font-weight: 900; color: var(--text-primary); margin-bottom: 32px; } .zurnexi-legal h2 { font-size: 1.6rem; font-weight: 800; color: var(--text-primary); margin: 40px 0 16px; } .zurnexi-legal p { font-size: 1.05rem; color: var(--text-secondary); margin-bottom: 16px; line-height: 1.75; } .zurnexi-legal ul, .zurnexi-legal ol { margin: 16px 0 16px 24px; } .zurnexi-legal li { font-size: 1.05rem; color: var(--text-secondary); margin-bottom: 8px; line-height: 1.75; } .zurnexi-404 { text-align: center; padding: 100px 24px; max-width: 800px; margin: 0 auto; } .zurnexi-404 h1 { font-size: clamp(3rem, 8vw, 6rem); font-weight: 900; color: var(--accent-red); margin-bottom: 24px; } .zurnexi-404 p { font-size: 1.3rem; color: var(--text-secondary); margin-bottom: 40px; } .zurnexi-404 a { display: inline-block; background: var(--text-primary); color: #fff; padding: 16px 40px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.1em; text-decoration: none; margin: 8px; transition: background 0.2s; } .zurnexi-404 a:hover { background: var(--accent-red); } .zurnexi-cookies-banner { position: fixed; bottom: 24px; right: 24px; max-width: 420px; background: var(--bg-white); border: 3px solid var(--accent-red); padding: 24px; box-shadow: 0 8px 32px rgba(0,0,0,0.15); z-index: 1000; } .zurnexi-cookies-banner:target { display: none; } .zurnexi-cookies-banner p { font-size: 0.9rem; color: var(--text-secondary); margin-bottom: 16px; line-height: 1.6; } .zurnexi-cookies-banner a { color: var(--accent-red); text-decoration: underline; } .zurnexi-cookies-banner .zurnexi-cookies-btns { display: flex; gap: 12px; } .zurnexi-cookies-banner button, .zurnexi-cookies-banner a.zurnexi-btn { flex: 1; padding: 10px; font-size: 0.85rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; cursor: pointer; text-align: center; text-decoration: none; display: block; transition: all 0.2s; border: 2px solid var(--text-primary); } .zurnexi-cookies-banner .zurnexi-accept { background: var(--accent-red); color: #fff; border-color: var(--accent-red); } .zurnexi-cookies-banner .zurnexi-accept:hover { background: var(--accent-red-dark); border-color: var(--accent-red-dark); } .zurnexi-cookies-banner .zurnexi-decline { background: transparent; color: var(--text-primary); } .zurnexi-cookies-banner .zurnexi-decline:hover { background: var(--bg-secondary); } @media (max-width: 1100px) { .zurnexi-main { grid-template-columns: 1fr; gap: 40px; } .zurnexi-sidebar { position: static; max-width: 600px; } } @media (max-width: 768px) { .zurnexi-nav { display: none; } .zurnexi-nav.zurnexi-open { display: flex; flex-direction: column; position: absolute; top: 100%; left: 0; right: 0; background: var(--bg-white); padding: 24px; border-bottom: 3px solid var(--accent-red); box-shadow: var(--shadow); align-items: flex-start; } .zurnexi-burger { display: flex; } .zurnexi-hero { padding: 60px 20px 40px; min-height: 60vh; } .zurnexi-main { padding: 40px 20px; } .zurnexi-highlight { padding: 28px 24px; } .zurnexi-checklist, .zurnexi-tips { padding: 24px 20px; } .zurnexi-quote { padding: 28px 24px; } .zurnexi-footer-inner { grid-template-columns: 1fr; gap: 32px; } .zurnexi-cookies-banner { left: 16px; right: 16px; max-width: none; } } @media (max-width: 480px) { .zurnexi-hero-title { font-size: 2rem; } .zurnexi-section h2 { font-size: 1.5rem; } }