/*
Theme Name: Avtomobilista
Theme URI: https://avtomobilista.ru
Author: Avtomobilista
Description: Custom theme for avtomobilista.ru — auto import landing page.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: avtomobilista
*/

:root{
  --bg: oklch(0.15 0.025 250);
  --bg-alt: oklch(0.12 0.022 250);
  --bg-footer: oklch(0.1 0.02 250);
  --bg-header: oklch(0.13 0.025 250 / 0.92);
  --card: oklch(0.18 0.025 250);
  --card-form: oklch(0.2 0.025 250);
  --input-bg: oklch(0.14 0.02 250);
  --border: oklch(1 0 0 / 0.08);
  --border-soft: oklch(1 0 0 / 0.07);
  --border-strong: oklch(1 0 0 / 0.18);
  --text: oklch(0.97 0.005 250);
  --text-soft: oklch(0.85 0.01 250);
  --text-soft2: oklch(0.75 0.015 250);
  --text-muted: oklch(0.72 0.02 250);
  --text-dim: oklch(0.68 0.02 250);
  --text-dimmer: oklch(0.62 0.02 250);
  --text-faint: oklch(0.6 0.02 250);
  --text-faintest: oklch(0.5 0.02 250);
  --accent: oklch(0.72 0.19 45);
  --accent-text: oklch(0.76 0.17 45);
  --accent-on: oklch(0.16 0.02 45);
  --accent-soft: oklch(0.72 0.19 45 / 0.14);
  --accent-soft2: oklch(0.72 0.19 45 / 0.18);
  --accent-border: oklch(0.72 0.19 45 / 0.35);
  --error: oklch(0.72 0.17 25);
  --wa: oklch(0.4 0.12 150);
  --tg: oklch(0.55 0.15 235);
  --photo-a: oklch(0.22 0.03 250);
  --photo-b: oklch(0.19 0.025 250);
  --photo-a2: oklch(0.24 0.03 250);
  --photo-b2: oklch(0.2 0.025 250);
}

html{ scroll-behavior:smooth; }
body{ margin:0; background:var(--bg); font-family:'Manrope',sans-serif; color:var(--text); }
*, *::before, *::after{ box-sizing:border-box; }
::selection{ background:var(--accent); color:var(--accent-on); }
input::placeholder, textarea::placeholder{ color:var(--text-faint); }
a{ color:inherit; }
img{ max-width:100%; display:block; }

.site-wrap{ background:var(--bg); color:var(--text); min-height:100vh; overflow-x:hidden; }

.container{ max-width:1280px; margin:0 auto; padding:0 24px; }
.section{ padding:80px 24px; }
.section-alt{ background:var(--bg-alt); }
.section-title{ font-family:'Unbounded',sans-serif; font-weight:600; font-size:clamp(26px,3vw,36px); margin:0 0 44px; text-align:center; }
.section-subtitle{ text-align:center; color:var(--text-dim); font-size:15px; margin:0 0 36px; }

/* Buttons */
.btn{ text-decoration:none; display:inline-flex; align-items:center; justify-content:center; border-radius:12px; font-weight:700; cursor:pointer; border:none; }
.btn-primary{ background:var(--accent); color:var(--accent-on); }
.btn-outline{ border:1px solid var(--border-strong); color:var(--text); font-weight:600; background:transparent; }
.btn-lg{ font-size:16px; padding:16px 28px; }
.btn-pill{ border-radius:999px; font-size:14px; padding:11px 20px; }
.btn-block{ width:100%; padding:16px; font-size:16px; }

/* Header */
.site-header{ position:sticky; top:0; z-index:100; background:var(--bg-header); backdrop-filter:blur(10px); border-bottom:1px solid var(--border); }
.header-inner{ max-width:1280px; margin:0 auto; padding:16px 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.logo{ display:flex; align-items:center; gap:10px; text-decoration:none; flex:none; }
.logo-badge{ width:40px; height:40px; border-radius:10px; background:var(--accent); display:flex; align-items:center; justify-content:center; font-family:'Unbounded',sans-serif; font-weight:700; font-size:18px; color:var(--accent-on); flex:none; }
.logo-text{ font-family:'Unbounded',sans-serif; font-weight:600; font-size:17px; color:var(--text); white-space:nowrap; }
.logo-text .accent{ color:var(--accent); }
.main-nav{ display:flex; align-items:center; gap:24px; flex-wrap:wrap; flex:1; justify-content:center; font-size:14px; font-weight:500; }
.main-nav a{ text-decoration:none; color:var(--text-soft); opacity:0.9; }
.header-actions{ display:flex; align-items:center; gap:16px; flex:none; }
.header-phone{ text-decoration:none; font-family:'Unbounded',sans-serif; font-weight:600; font-size:15px; color:var(--text); white-space:nowrap; }

/* Hero */
.hero{ max-width:1280px; margin:0 auto; padding:clamp(40px,7vw,88px) 24px; display:flex; gap:48px; align-items:center; flex-wrap:wrap; }
.hero-content{ flex:1 1 480px; min-width:320px; }
.hero-badge{ display:inline-block; padding:6px 14px; border-radius:999px; background:var(--accent-soft); border:1px solid var(--accent-border); color:var(--accent-text); font-size:13px; font-weight:600; margin-bottom:20px; }
.hero-title{ font-family:'Unbounded',sans-serif; font-weight:700; font-size:clamp(32px,4.2vw,54px); line-height:1.12; margin:0 0 20px; text-wrap:pretty; }
.hero-title .accent{ color:var(--accent); }
.hero-desc{ font-size:clamp(16px,1.6vw,19px); line-height:1.6; color:var(--text-muted); margin:0 0 28px; max-width:560px; }
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:36px; }
.hero-form{ background:var(--card-form); border:1px solid var(--border); border-radius:16px; padding:20px; display:flex; gap:12px; flex-wrap:wrap; max-width:560px; }
.hero-form input{ flex:1 1 200px; background:var(--input-bg); border:1px solid var(--border-strong); border-radius:10px; padding:13px 14px; color:var(--text); font-size:15px; outline:none; }
.hero-form button{ flex:1 1 140px; padding:13px 18px; font-size:15px; border-radius:10px; }
.form-success{ padding:8px 4px; font-size:15px; color:var(--accent-text); font-weight:600; }
.form-error{ color:var(--error); font-size:13px; margin-top:8px; }
.hero-visual{ flex:1 1 420px; min-width:300px; }
.photo-box{ width:100%; border-radius:20px; border:1px solid var(--border-strong); background:repeating-linear-gradient(135deg, var(--photo-a), var(--photo-a) 14px, var(--photo-b) 14px, var(--photo-b) 28px); display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.photo-box-hero{ aspect-ratio:4/3; }
.photo-label{ background:oklch(0.13 0.02 250 / 0.75); padding:10px 18px; border-radius:8px; font-family:monospace; font-size:13px; color:var(--text-soft); text-align:center; }

/* Why us */
.why-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:24px; }
.why-card{ background:var(--card); border:1px solid var(--border-soft); border-radius:16px; padding:28px 22px; }
.why-icon-wrap{ width:46px; height:46px; border-radius:12px; background:var(--accent-soft); display:flex; align-items:center; justify-content:center; margin-bottom:18px; }
.why-icon-dot{ width:18px; height:18px; border-radius:50%; border:3px solid var(--accent); }
.why-title{ font-weight:700; font-size:16px; margin-bottom:8px; line-height:1.3; }
.why-desc{ font-size:14px; line-height:1.55; color:var(--text-dim); }

/* Steps */
.steps-list{ display:flex; flex-direction:column; gap:0; }
.step-row{ display:flex; gap:24px; padding:22px 0; border-bottom:1px solid var(--border-soft); }
.step-row:last-child{ border-bottom:none; }
.step-num{ flex:none; width:52px; height:52px; border-radius:50%; background:var(--accent-soft); border:1px solid var(--accent-border); color:var(--accent-text); font-family:'Unbounded',sans-serif; font-weight:700; font-size:18px; display:flex; align-items:center; justify-content:center; }
.step-body{ flex:1; }
.step-title{ font-weight:700; font-size:17px; margin-bottom:6px; }
.step-desc{ font-size:14.5px; line-height:1.55; color:var(--text-dim); }

/* Countries */
.countries-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; }
.country-card{ background:var(--card); border:1px solid var(--border-soft); border-radius:18px; padding:30px 26px; }
.country-name{ font-family:'Unbounded',sans-serif; font-weight:700; font-size:21px; margin-bottom:16px; color:var(--accent); }
.field-label{ font-size:13px; text-transform:uppercase; letter-spacing:0.04em; color:var(--text-faint); margin-bottom:4px; }
.field-value{ font-size:14.5px; margin-bottom:16px; line-height:1.5; }
.field-value-last{ font-size:14.5px; line-height:1.5; color:var(--text-soft2); }

/* Catalog / cases */
.catalog-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; }
.case-card{ background:var(--card); border:1px solid var(--border-soft); border-radius:16px; overflow:hidden; }
.case-photo{ aspect-ratio:16/10; background:repeating-linear-gradient(135deg, var(--photo-a2), var(--photo-a2) 12px, var(--photo-b2) 12px, var(--photo-b2) 24px); display:flex; align-items:center; justify-content:center; }
.case-photo img{ width:100%; height:100%; object-fit:cover; }
.case-photo-label{ font-family:monospace; font-size:12px; color:var(--text-soft); background:oklch(0.13 0.02 250 / 0.7); padding:6px 12px; border-radius:6px; }
.case-body{ padding:20px; }
.case-model{ font-weight:700; font-size:16.5px; margin-bottom:4px; }
.case-meta{ font-size:13px; color:var(--text-dimmer); margin-bottom:14px; }
.case-footer{ display:flex; justify-content:space-between; font-size:14px; padding-top:12px; border-top:1px solid var(--border-soft); }
.case-footer-label{ color:var(--text-faint); }
.case-price{ font-weight:700; color:var(--accent-text); }
.case-days{ font-weight:700; }

/* Calculator / lead form */
.calculator-wrap{ max-width:720px; margin:0 auto; }
.calculator-form{ background:var(--card); border:1px solid var(--border); border-radius:20px; padding:32px; }
.form-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin-bottom:16px; }
.form-field label{ font-size:13px; color:var(--text-dim); display:block; margin-bottom:6px; }
.form-field select, .form-field input, .calculator-form > textarea{ width:100%; background:var(--input-bg); border:1px solid var(--border-strong); border-radius:10px; padding:13px 14px; color:var(--text); font-size:15px; }
.calculator-form textarea{ font-family:inherit; resize:vertical; margin-bottom:20px; }
.form-error-block{ color:var(--error); font-size:13.5px; margin-bottom:14px; }
.success-block{ text-align:center; padding:30px 10px; }
.success-title{ font-family:'Unbounded',sans-serif; font-weight:700; font-size:20px; color:var(--accent-text); margin-bottom:8px; }
.success-desc{ font-size:14.5px; color:var(--text-dim); }

/* Reviews */
.reviews-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:24px; }
.review-card{ background:var(--card); border:1px solid var(--border-soft); border-radius:16px; padding:26px; }
.review-text{ font-size:14.5px; line-height:1.6; color:var(--text-soft); margin-bottom:20px; }
.review-footer{ display:flex; align-items:center; gap:12px; padding-top:16px; border-top:1px solid var(--border-soft); }
.review-avatar{ width:38px; height:38px; border-radius:50%; background:var(--accent-soft2); color:var(--accent-text); font-weight:700; font-family:'Unbounded',sans-serif; display:flex; align-items:center; justify-content:center; flex:none; }
.review-name{ font-weight:700; font-size:14.5px; }
.review-car{ font-size:12.5px; color:var(--text-faint); }

/* FAQ */
.faq-list{ display:flex; flex-direction:column; gap:12px; }
.faq-item{ background:var(--card); border:1px solid var(--border-soft); border-radius:14px; padding:20px 24px; cursor:pointer; }
.faq-head{ display:flex; justify-content:space-between; align-items:center; gap:16px; }
.faq-question{ font-weight:700; font-size:15.5px; }
.faq-toggle{ flex:none; width:24px; height:24px; border-radius:50%; border:1px solid var(--border-strong); display:flex; align-items:center; justify-content:center; font-size:15px; color:var(--accent); font-weight:700; }
.faq-answer{ font-size:14.5px; line-height:1.6; color:var(--text-dim); margin-top:14px; display:none; }
.faq-item.is-open .faq-answer{ display:block; }

/* Contacts */
.contacts-wrap{ max-width:1280px; margin:0 auto; display:flex; gap:48px; flex-wrap:wrap; }
.contacts-info{ flex:1 1 380px; min-width:300px; }
.contacts-title{ font-family:'Unbounded',sans-serif; font-weight:600; font-size:clamp(26px,3vw,36px); margin:0 0 24px; }
.contact-phone{ display:block; text-decoration:none; font-family:'Unbounded',sans-serif; font-weight:700; font-size:28px; color:var(--text); margin-bottom:20px; }
.contact-buttons{ display:flex; gap:12px; margin-bottom:28px; }
.contact-btn{ text-decoration:none; display:flex; align-items:center; gap:8px; background:var(--card-form); border:1px solid var(--border-strong); padding:12px 18px; border-radius:10px; font-size:14.5px; font-weight:600; }
.map-box{ width:100%; aspect-ratio:16/9; border-radius:16px; background:repeating-linear-gradient(135deg, var(--photo-a), var(--photo-a) 14px, var(--photo-b) 14px, var(--photo-b) 28px); display:flex; align-items:center; justify-content:center; }
.contact-form-wrap{ flex:1 1 380px; min-width:300px; }
.contact-form{ background:var(--card); border:1px solid var(--border); border-radius:20px; padding:28px; }
.contact-form-title{ font-weight:700; font-size:16px; margin-bottom:18px; }
.contact-form input, .contact-form textarea{ width:100%; background:var(--input-bg); border:1px solid var(--border-strong); border-radius:10px; padding:13px 14px; color:var(--text); font-size:15px; margin-bottom:14px; }
.contact-form textarea{ font-family:inherit; resize:vertical; }

/* Footer */
.site-footer{ background:var(--bg-footer); border-top:1px solid var(--border-soft); padding:48px 24px 28px; }
.footer-inner{ max-width:1280px; margin:0 auto; display:flex; justify-content:space-between; gap:32px; flex-wrap:wrap; }
.footer-brand{ flex:1 1 280px; }
.footer-logo{ display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.footer-logo-badge{ width:34px; height:34px; border-radius:8px; background:var(--accent); display:flex; align-items:center; justify-content:center; font-family:'Unbounded',sans-serif; font-weight:700; font-size:15px; color:var(--accent-on); }
.footer-logo-text{ font-family:'Unbounded',sans-serif; font-weight:600; font-size:15.5px; }
.footer-desc{ font-size:13.5px; color:var(--text-faint); line-height:1.6; max-width:320px; }
.footer-nav{ display:flex; gap:20px; flex-wrap:wrap; font-size:13.5px; color:var(--text-dimmer); }
.footer-nav a{ text-decoration:none; color:inherit; }
.footer-contact{ font-size:13.5px; color:var(--text-dimmer); }
.footer-phone{ font-weight:600; color:var(--text-soft); margin-bottom:6px; }
.footer-bottom{ max-width:1280px; margin:32px auto 0; padding-top:20px; border-top:1px solid oklch(1 0 0 / 0.06); font-size:12.5px; color:var(--text-faintest); }

/* Sticky actions */
.sticky-actions{ position:fixed; right:20px; bottom:20px; display:flex; flex-direction:column; gap:10px; z-index:200; }
.sticky-btn{ width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; text-decoration:none; font-weight:700; font-size:12px; box-shadow:0 6px 18px oklch(0.1 0.02 250 / 0.5); }
.sticky-call{ background:var(--accent); color:var(--accent-on); }
.sticky-wa{ background:var(--wa); color:#fff; }
.sticky-tg{ background:var(--tg); color:#fff; }
