/* === DESIGN SYSTEM === */
:root {
  /* Палитра */
  --c-bg: #FAF8F5;
  --c-bg-alt: #F2EDE7;
  --c-bg-card: #FFFFFF;
  --c-text: #2C2418;
  --c-text-soft: #6B5D4F;
  --c-text-muted: #9A8D7F;
  --c-accent: #B8733A;
  --c-accent-hover: #9E5F2B;
  --c-accent-light: rgba(184,115,58,.10);
  --c-copper: #C27E45;
  --c-wood: #8B6914;
  --c-border: #E5DED4;
  --c-border-light: #EDE8E0;
  --c-success: #5A8C5A;
  --c-error: #B84A4A;
  --c-overlay: rgba(44,36,24,.6);

  /* Типографика */
  --f-body: 'Georgia', 'Times New Roman', 'Noto Serif', serif;
  --f-heading: 'Segoe UI', 'Helvetica Neue', 'Arial', sans-serif;
  --f-mono: 'Courier New', monospace;

  /* Размеры */
  --fs-xs: .75rem;
  --fs-sm: .875rem;
  --fs-base: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: 1.25rem;
  --fs-xl: 1.5rem;
  --fs-2xl: 2rem;
  --fs-3xl: 2.5rem;
  --fs-4xl: 3.25rem;

  /* Отступы */
  --sp-xs: .25rem;
  --sp-sm: .5rem;
  --sp-md: 1rem;
  --sp-lg: 1.5rem;
  --sp-xl: 2rem;
  --sp-2xl: 3rem;
  --sp-3xl: 4rem;
  --sp-4xl: 6rem;

  /* Формы */
  --radius-sm: 8px;
  --radius: 16px;
  --radius-lg: 24px;
  --radius-full: 999px;

  /* Тени */
  --shadow-sm: 0 1px 3px rgba(44,36,24,.06);
  --shadow: 0 4px 16px rgba(44,36,24,.08);
  --shadow-lg: 0 8px 32px rgba(44,36,24,.12);
  --shadow-accent: 0 4px 20px rgba(184,115,58,.25);

  /* Переходы */
  --tr: .3s cubic-bezier(.4,0,.2,1);
  --tr-fast: .15s ease;

  /* Сетка */
  --container: 1200px;
  --container-narrow: 860px;
}

/* === RESET === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;font-size:16px}
body{font-family:var(--f-body);color:var(--c-text);background:var(--c-bg);line-height:1.7;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
img,svg{display:block;max-width:100%}
a{color:var(--c-accent);text-decoration:none;transition:color var(--tr-fast)}
a:hover{color:var(--c-accent-hover)}
ul,ol{list-style:none}
button,input,select,textarea{font:inherit;color:inherit;border:none;background:none}
button{cursor:pointer}
h1,h2,h3,h4,h5,h6{font-family:var(--f-heading);line-height:1.25;font-weight:700;color:var(--c-text)}

/* === ФОКУС === */
:focus-visible{outline:2px solid var(--c-accent);outline-offset:3px;border-radius:var(--radius-sm)}

/* === УТИЛИТЫ === */
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--sp-lg)}
.container--narrow{max-width:var(--container-narrow)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.section{padding:var(--sp-4xl) 0}
.section--alt{background:var(--c-bg-alt)}
.text-center{text-align:center}
.text-muted{color:var(--c-text-muted)}
.text-soft{color:var(--c-text-soft)}
.text-accent{color:var(--c-accent)}

/* === КНОПКИ === */
.btn{display:inline-flex;align-items:center;gap:var(--sp-sm);padding:.875rem 2rem;border-radius:var(--radius);font-family:var(--f-heading);font-size:var(--fs-base);font-weight:600;transition:all var(--tr);text-align:center;justify-content:center;line-height:1.2}
.btn--primary{background:var(--c-accent);color:#fff}
.btn--primary:hover{background:var(--c-accent-hover);color:#fff;box-shadow:var(--shadow-accent);transform:translateY(-1px)}
.btn--outline{border:2px solid var(--c-border);color:var(--c-text)}
.btn--outline:hover{border-color:var(--c-accent);color:var(--c-accent)}
.btn--ghost{color:var(--c-accent);padding:.875rem 1rem}
.btn--ghost:hover{background:var(--c-accent-light)}
.btn--sm{padding:.625rem 1.25rem;font-size:var(--fs-sm)}
.btn--block{width:100%}
.btn svg{width:20px;height:20px;flex-shrink:0}

/* === ШАПКА === */
.header{position:sticky;top:0;z-index:100;background:rgba(250,248,245,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--c-border-light);transition:box-shadow var(--tr)}
.header--scrolled{box-shadow:var(--shadow)}
.header__inner{display:flex;align-items:center;justify-content:space-between;height:72px}
.logo{display:flex;align-items:center;gap:var(--sp-sm);font-family:var(--f-heading);font-weight:700;font-size:var(--fs-lg);color:var(--c-text);text-decoration:none}
.logo:hover{color:var(--c-text)}
.logo svg{width:36px;height:36px;color:var(--c-accent)}
.logo__sub{font-size:var(--fs-xs);font-weight:400;color:var(--c-text-muted);display:block;line-height:1.1;margin-top:2px}

/* Навигация */
.nav{display:flex;align-items:center;gap:var(--sp-xs)}
.nav__link{padding:.5rem .75rem;font-family:var(--f-heading);font-size:var(--fs-sm);font-weight:500;color:var(--c-text-soft);border-radius:var(--radius-sm);transition:all var(--tr-fast)}
.nav__link:hover,.nav__link--active{color:var(--c-accent);background:var(--c-accent-light)}
.nav__cta{margin-left:var(--sp-sm)}

/* Бургер */
.burger{display:none;width:44px;height:44px;align-items:center;justify-content:center;border-radius:var(--radius-sm);transition:background var(--tr-fast)}
.burger:hover{background:var(--c-accent-light)}
.burger span,.burger span::before,.burger span::after{display:block;width:22px;height:2px;background:var(--c-text);border-radius:2px;transition:all var(--tr)}
.burger span{position:relative}
.burger span::before,.burger span::after{content:'';position:absolute;left:0}
.burger span::before{top:-7px}
.burger span::after{top:7px}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.burger[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}

/* Моб. меню */
.mobile-nav{display:none;position:fixed;top:72px;left:0;right:0;bottom:0;background:var(--c-bg);z-index:99;padding:var(--sp-xl);overflow-y:auto;transform:translateY(-10px);opacity:0;transition:all var(--tr)}
.mobile-nav--open{display:flex;flex-direction:column;gap:var(--sp-sm);transform:translateY(0);opacity:1}
.mobile-nav .nav__link{display:block;padding:.75rem var(--sp-md);font-size:var(--fs-md);border-radius:var(--radius-sm)}

/* === ГЕРОЙ === */
.hero{position:relative;padding:var(--sp-4xl) 0;overflow:hidden;min-height:520px;display:flex;align-items:center}
.hero__bg{position:absolute;inset:0;z-index:0;opacity:.06}
.hero__content{position:relative;z-index:1;max-width:680px}
.hero__badge{display:inline-flex;align-items:center;gap:var(--sp-sm);padding:.5rem 1rem;background:var(--c-accent-light);border-radius:var(--radius-full);font-family:var(--f-heading);font-size:var(--fs-sm);font-weight:600;color:var(--c-accent);margin-bottom:var(--sp-lg)}
.hero h1{font-size:var(--fs-4xl);margin-bottom:var(--sp-lg);letter-spacing:-.02em}
.hero__lead{font-size:var(--fs-lg);color:var(--c-text-soft);margin-bottom:var(--sp-2xl);max-width:560px}
.hero__actions{display:flex;gap:var(--sp-md);flex-wrap:wrap}
.hero__decor{position:absolute;right:-40px;top:50%;transform:translateY(-50%);width:420px;height:420px;opacity:.08;z-index:0}

/* === КАРТОЧКИ === */
.card{background:var(--c-bg-card);border-radius:var(--radius-lg);border:1px solid var(--c-border-light);padding:var(--sp-2xl);transition:all var(--tr)}
.card:hover{box-shadow:var(--shadow);border-color:var(--c-border)}
.card--accent:hover{border-color:var(--c-accent);box-shadow:var(--shadow-accent)}
.card__icon{width:48px;height:48px;border-radius:var(--radius);background:var(--c-accent-light);display:flex;align-items:center;justify-content:center;margin-bottom:var(--sp-lg);color:var(--c-accent)}
.card__icon svg{width:24px;height:24px}
.card__title{font-family:var(--f-heading);font-size:var(--fs-lg);font-weight:600;margin-bottom:var(--sp-sm)}
.card__text{color:var(--c-text-soft);font-size:var(--fs-sm);line-height:1.65}
.card__link{display:inline-flex;align-items:center;gap:var(--sp-xs);margin-top:var(--sp-lg);font-family:var(--f-heading);font-size:var(--fs-sm);font-weight:600;color:var(--c-accent)}
.card__link:hover{gap:var(--sp-sm)}
.card__link svg{width:16px;height:16px;transition:transform var(--tr-fast)}
.card__link:hover svg{transform:translateX(3px)}

/* Сетки карточек */
.grid{display:grid;gap:var(--sp-xl)}
.grid--2{grid-template-columns:repeat(2,1fr)}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}

/* === СЕКЦИЯ ЗАГОЛОВКА === */
.section__header{max-width:640px;margin-bottom:var(--sp-3xl)}
.section__header--center{margin-left:auto;margin-right:auto;text-align:center}
.section__label{display:inline-flex;align-items:center;gap:var(--sp-sm);font-family:var(--f-heading);font-size:var(--fs-sm);font-weight:600;color:var(--c-accent);text-transform:uppercase;letter-spacing:.06em;margin-bottom:var(--sp-md)}
.section__title{font-size:var(--fs-3xl);margin-bottom:var(--sp-md);letter-spacing:-.01em}
.section__desc{font-size:var(--fs-md);color:var(--c-text-soft)}

/* === ЭТАПЫ === */
.steps{counter-reset:step}
.step{counter-increment:step;position:relative;padding-left:72px;padding-bottom:var(--sp-2xl)}
.step::before{content:counter(step);position:absolute;left:0;top:0;width:48px;height:48px;border-radius:50%;background:var(--c-accent-light);color:var(--c-accent);font-family:var(--f-heading);font-weight:700;font-size:var(--fs-lg);display:flex;align-items:center;justify-content:center}
.step::after{content:'';position:absolute;left:23px;top:56px;bottom:0;width:2px;background:var(--c-border)}
.step:last-child::after{display:none}
.step:last-child{padding-bottom:0}
.step__title{font-family:var(--f-heading);font-size:var(--fs-lg);font-weight:600;margin-bottom:var(--sp-xs)}
.step__text{color:var(--c-text-soft);font-size:var(--fs-sm)}

/* === ПАКЕТЫ/ТАРИФЫ === */
.package{background:var(--c-bg-card);border:2px solid var(--c-border-light);border-radius:var(--radius-lg);padding:var(--sp-2xl);display:flex;flex-direction:column}
.package--featured{border-color:var(--c-accent);position:relative}
.package--featured::before{content:'Популярный выбор';position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--c-accent);color:#fff;font-family:var(--f-heading);font-size:var(--fs-xs);font-weight:600;padding:.375rem 1rem;border-radius:var(--radius-full);white-space:nowrap}
.package__name{font-family:var(--f-heading);font-size:var(--fs-xl);font-weight:700;margin-bottom:var(--sp-sm)}
.package__desc{color:var(--c-text-soft);font-size:var(--fs-sm);margin-bottom:var(--sp-xl);line-height:1.6}
.package__list{display:flex;flex-direction:column;gap:var(--sp-sm);margin-bottom:var(--sp-xl);flex-grow:1}
.package__item{display:flex;align-items:flex-start;gap:var(--sp-sm);font-size:var(--fs-sm);color:var(--c-text-soft)}
.package__item svg{width:18px;height:18px;color:var(--c-success);flex-shrink:0;margin-top:2px}
.package__note{font-size:var(--fs-xs);color:var(--c-text-muted);margin-bottom:var(--sp-lg);padding:var(--sp-md);background:var(--c-bg-alt);border-radius:var(--radius-sm)}

/* === FAQ === */
.faq-item{border-bottom:1px solid var(--c-border-light)}
.faq-item__q{width:100%;text-align:left;padding:var(--sp-lg) 0;font-family:var(--f-heading);font-size:var(--fs-md);font-weight:600;color:var(--c-text);display:flex;justify-content:space-between;align-items:center;gap:var(--sp-md);cursor:pointer;transition:color var(--tr-fast)}
.faq-item__q:hover{color:var(--c-accent)}
.faq-item__q svg{width:20px;height:20px;flex-shrink:0;transition:transform var(--tr);color:var(--c-text-muted)}
.faq-item__q[aria-expanded="true"] svg{transform:rotate(180deg);color:var(--c-accent)}
.faq-item__a{overflow:hidden;max-height:0;transition:max-height .4s ease;padding:0}
.faq-item__a-inner{padding:0 0 var(--sp-lg);color:var(--c-text-soft);font-size:var(--fs-sm);line-height:1.7}

/* === ФОРМА === */
.form{display:flex;flex-direction:column;gap:var(--sp-lg)}
.form__group{display:flex;flex-direction:column;gap:var(--sp-xs)}
.form__label{font-family:var(--f-heading);font-size:var(--fs-sm);font-weight:600;color:var(--c-text)}
.form__input,.form__textarea{padding:.875rem 1rem;border:2px solid var(--c-border);border-radius:var(--radius);font-size:var(--fs-base);transition:border-color var(--tr-fast);background:var(--c-bg-card)}
.form__input:focus,.form__textarea:focus{border-color:var(--c-accent);outline:none}
.form__input::placeholder,.form__textarea::placeholder{color:var(--c-text-muted)}
.form__textarea{resize:vertical;min-height:120px}
.form__checkbox{display:flex;align-items:flex-start;gap:var(--sp-sm)}
.form__checkbox input[type="checkbox"]{width:20px;height:20px;accent-color:var(--c-accent);margin-top:2px;flex-shrink:0;cursor:pointer}
.form__checkbox label{font-size:var(--fs-sm);color:var(--c-text-soft);cursor:pointer}
.form__error{font-size:var(--fs-xs);color:var(--c-error)}
.form__success{padding:var(--sp-lg);background:rgba(90,140,90,.1);border:1px solid var(--c-success);border-radius:var(--radius);color:var(--c-success);font-family:var(--f-heading);text-align:center}
.hp-field{position:absolute;left:-9999px;top:-9999px}

/* === ПОДВАЛ === */
.footer{background:var(--c-text);color:rgba(255,255,255,.6);padding:var(--sp-3xl) 0 var(--sp-xl);margin-top:auto}
.footer a{color:rgba(255,255,255,.75)}
.footer a:hover{color:#fff}
.footer__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:var(--sp-2xl);margin-bottom:var(--sp-3xl)}
.footer__brand{max-width:280px}
.footer__brand .logo{color:#fff}
.footer__brand .logo svg{color:var(--c-copper)}
.footer__brand p{margin-top:var(--sp-md);font-size:var(--fs-sm);line-height:1.65}
.footer__heading{font-family:var(--f-heading);font-size:var(--fs-sm);font-weight:600;color:#fff;margin-bottom:var(--sp-lg);text-transform:uppercase;letter-spacing:.05em}
.footer__links{display:flex;flex-direction:column;gap:var(--sp-sm)}
.footer__links a{font-size:var(--fs-sm);padding:2px 0}
.footer__bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:var(--sp-xl);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--sp-md);font-size:var(--fs-xs)}

/* === ХЛЕБНЫЕ КРОШКИ === */
.breadcrumbs{padding:var(--sp-lg) 0;font-family:var(--f-heading);font-size:var(--fs-sm)}
.breadcrumbs__list{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-xs)}
.breadcrumbs__list li{display:flex;align-items:center;gap:var(--sp-xs)}
.breadcrumbs__list li+li::before{content:'→';color:var(--c-text-muted);font-size:.75rem}
.breadcrumbs__list a{color:var(--c-text-muted)}
.breadcrumbs__list a:hover{color:var(--c-accent)}
.breadcrumbs__list [aria-current]{color:var(--c-text-soft)}

/* === СТРАНИЦА HERO-БАННЕР === */
.page-hero{padding:var(--sp-3xl) 0 var(--sp-2xl);background:var(--c-bg-alt);position:relative;overflow:hidden}
.page-hero h1{font-size:var(--fs-3xl);margin-bottom:var(--sp-md)}
.page-hero__desc{font-size:var(--fs-md);color:var(--c-text-soft);max-width:600px}

/* === ГЕОГРАФИЯ === */
.geo-list{display:flex;flex-wrap:wrap;gap:var(--sp-sm)}
.geo-list__item{padding:.375rem .875rem;background:var(--c-bg-card);border:1px solid var(--c-border-light);border-radius:var(--radius-full);font-family:var(--f-heading);font-size:var(--fs-sm);color:var(--c-text-soft);transition:all var(--tr-fast)}
.geo-list__item:hover{border-color:var(--c-accent);color:var(--c-accent);background:var(--c-accent-light)}

/* === 404 === */
.error-page{display:flex;align-items:center;justify-content:center;min-height:60vh;text-align:center}
.error-page h1{font-size:6rem;color:var(--c-accent);opacity:.3;line-height:1}
.error-page p{margin:var(--sp-md) 0 var(--sp-xl);color:var(--c-text-soft)}

/* === СПАСИБО === */
.thanks-page{display:flex;align-items:center;justify-content:center;min-height:50vh;text-align:center}
.thanks-page__icon{width:72px;height:72px;border-radius:50%;background:rgba(90,140,90,.1);color:var(--c-success);display:flex;align-items:center;justify-content:center;margin:0 auto var(--sp-xl)}
.thanks-page__icon svg{width:36px;height:36px}

/* === ПРАЙВЕСИ === */
.prose{max-width:var(--container-narrow);margin:0 auto}
.prose h2{font-size:var(--fs-xl);margin:var(--sp-2xl) 0 var(--sp-md)}
.prose h3{font-size:var(--fs-lg);margin:var(--sp-xl) 0 var(--sp-sm)}
.prose p{margin-bottom:var(--sp-md);color:var(--c-text-soft);line-height:1.75}
.prose ul{margin:var(--sp-md) 0;padding-left:var(--sp-xl)}
.prose ul li{margin-bottom:var(--sp-sm);color:var(--c-text-soft);position:relative;padding-left:var(--sp-md)}
.prose ul li::before{content:'—';position:absolute;left:0;color:var(--c-accent)}

/* === ПРОЕКТ-КАРТОЧКА === */
.project-card{background:var(--c-bg-card);border-radius:var(--radius-lg);border:1px solid var(--c-border-light);overflow:hidden;transition:all var(--tr)}
.project-card:hover{box-shadow:var(--shadow);border-color:var(--c-border)}
.project-card__visual{height:200px;background:var(--c-bg-alt);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.project-card__visual svg{width:80px;height:80px;color:var(--c-accent);opacity:.3}
.project-card__body{padding:var(--sp-xl)}
.project-card__title{font-family:var(--f-heading);font-size:var(--fs-lg);font-weight:600;margin-bottom:var(--sp-sm)}
.project-card__meta{display:flex;gap:var(--sp-md);margin-bottom:var(--sp-md);flex-wrap:wrap}
.project-card__tag{font-family:var(--f-heading);font-size:var(--fs-xs);font-weight:600;padding:.25rem .625rem;background:var(--c-accent-light);color:var(--c-accent);border-radius:var(--radius-full)}
.project-card__text{font-size:var(--fs-sm);color:var(--c-text-soft);line-height:1.65}

/* === SOLUTION CARD === */
.solution-card{background:var(--c-bg-card);border-radius:var(--radius-lg);border:1px solid var(--c-border-light);padding:var(--sp-2xl);transition:all var(--tr)}
.solution-card:hover{box-shadow:var(--shadow);border-color:var(--c-border)}
.solution-card__label{font-family:var(--f-heading);font-size:var(--fs-xs);font-weight:600;color:var(--c-accent);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--sp-md)}
.solution-card__title{font-family:var(--f-heading);font-size:var(--fs-lg);font-weight:600;margin-bottom:var(--sp-md)}
.solution-card__section{margin-bottom:var(--sp-md)}
.solution-card__section-label{font-family:var(--f-heading);font-size:var(--fs-xs);font-weight:600;color:var(--c-text-muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:var(--sp-xs)}
.solution-card__section p{font-size:var(--fs-sm);color:var(--c-text-soft);line-height:1.65}

/* === АНИМАЦИИ === */
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.animate-in{animation:fadeUp .6s ease forwards;opacity:0}
.animate-delay-1{animation-delay:.1s}
.animate-delay-2{animation-delay:.2s}
.animate-delay-3{animation-delay:.3s}

/* === АДАПТИВНОСТЬ === */
@media(max-width:1024px){
  .grid--4{grid-template-columns:repeat(2,1fr)}
  .grid--3{grid-template-columns:repeat(2,1fr)}
  .footer__grid{grid-template-columns:repeat(2,1fr)}
  .hero h1{font-size:var(--fs-3xl)}
  .hero__decor{width:300px;height:300px;right:-60px}
}
@media(max-width:768px){
  :root{--fs-4xl:2.25rem;--fs-3xl:1.875rem;--fs-2xl:1.5rem}
  .nav{display:none}
  .burger{display:flex}
  .grid--4,.grid--3,.grid--2{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr}
  .hero{min-height:auto;padding:var(--sp-3xl) 0}
  .hero__decor{display:none}
  .section{padding:var(--sp-3xl) 0}
  .header__inner{height:60px}
  .mobile-nav{top:60px}
  .hero__actions{flex-direction:column}
  .hero__actions .btn{width:100%}
  .step{padding-left:56px}
  .step::before{width:40px;height:40px;font-size:var(--fs-base)}
  .step::after{left:19px;top:48px}
  .footer__bottom{flex-direction:column;text-align:center}
  .breadcrumbs{padding:var(--sp-md) 0}
}
@media(max-width:480px){
  .container{padding:0 var(--sp-md)}
  .card{padding:var(--sp-xl)}
  .package{padding:var(--sp-xl)}
}

/* Полоска прогресса чтения */
.reading-progress{position:fixed;top:0;left:0;height:3px;background:var(--c-accent);z-index:101;transition:width .1s linear;width:0}
