/* ОБЪЕКТ — блок «Разберём Ваш объект до первой встречи» (objr-*).
   Изолирован от main.css: ни одного общего класса. Все размеры, растущие с шириной экрана, — только через clamp().
   Цвета и размеры — из objekt-tokens.css. Переломы: 1100px (две колонки), 768px (иллюстрация над формой), 680px (телефонные размеры). */
/* main.css гасит рамку фокуса у всего (* { outline: none !important }) — поэтому у :focus-visible здесь !important. */

.objr,
.objr *,
.objr *::before,
.objr *::after{box-sizing:border-box;}

.objr{
  background:var(--objekt-color-bg);
  color:var(--objekt-color-cream);
  font-family:var(--objekt-font-body);
  padding:var(--objekt-section-py) 0;
}
.objr-wrap{
  width:var(--objekt-container-w);
  max-width:var(--objekt-container-max);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);
  grid-template-rows:1fr auto auto 1fr;
  grid-template-areas:
    ".    media"
    "head media"
    "body media"
    ".    media";
  column-gap:clamp(32px, 2.8vw, 64px);
}
.objr-head{grid-area:head;}
.objr-body{grid-area:body;}
.objr-media{grid-area:media;}

/* --- эйдброу --- */
.objr-eyebrow{
  display:flex;align-items:center;gap:24px;
  font-size:var(--objekt-fs-meta);
  letter-spacing:0.3em;
  text-transform:uppercase;
  color:var(--objekt-color-accent);
  margin:0 0 24px;
}
.objr-eyebrow span{flex-shrink:0;}
.objr-eyebrow i{display:block;flex:1;height:1px;background:var(--objekt-color-line-strong);}

/* --- заголовок --- */
.objr .objr-title{
  font-family:var(--objekt-font-heading);
  font-weight:500;
  font-size:var(--objekt-fs-display-split);
  line-height:var(--objekt-lh-display);
  letter-spacing:var(--objekt-tracking-heading);
  text-transform:none;
  margin:0 0 28px;
  padding:0;
}
.objr-title-main,
.objr-title-accent{display:block;}
.objr-title-main{color:var(--objekt-color-cream);}
.objr-title-accent{color:var(--objekt-color-accent);}

.objr-subtitle{
  font-size:var(--objekt-fs-lead);
  line-height:var(--objekt-lh-lead);
  color:var(--objekt-color-text-light);
  max-width:560px;
  margin:0;
}

/* --- форма --- */
.objr-form{margin:40px 0 0;padding:0;}
.objr-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  grid-template-areas:
    "name     phone"
    "attach   btn"
    "consents consents";
  gap:16px;
}
.objr-field--name{grid-area:name;}
.objr-cell--phone{grid-area:phone;}
.objr-cell--attach{grid-area:attach;}
.objr-cell--btn{grid-area:btn;}
.objr-cell--consents{grid-area:consents;margin-top:8px;}
.objr-cell{min-width:0;}

.objr-field{
  display:flex;align-items:center;gap:16px;
  height:var(--objekt-field-h);
  padding:0 20px;
  background:var(--objekt-color-field-bg);
  border:1px solid var(--objekt-color-line);
  border-radius:var(--objekt-radius-field);
  cursor:text;
  transition:border-color .2s;
  margin:0;
}
.objr-field:hover{border-color:var(--objekt-color-line-strong);}
.objr-field:focus-within{border-color:var(--objekt-color-accent);}
.objr-field.has-error{border-color:var(--objekt-color-error);}

.objr-field__icon{display:flex;flex-shrink:0;width:24px;height:24px;color:var(--objekt-color-text-light);}
.objr-field__icon svg{width:100%;height:100%;display:block;}

/* main.css красит все input в чёрный через !important — перебиваем только внутри блока */
.objr .objr-input{
  flex:1;min-width:0;height:100%;
  margin:0;padding:0;
  background:transparent;
  border:0;border-radius:0;
  box-shadow:none;outline:none;
  -webkit-appearance:none;appearance:none;
  font-family:var(--objekt-font-body);
  font-size:var(--objekt-fs-body);
  color:var(--objekt-color-cream) !important;
}
.objr .objr-input::placeholder{color:var(--objekt-color-text-light) !important;opacity:1;}
.objr .objr-input:-webkit-autofill,
.objr .objr-input:-webkit-autofill:hover,
.objr .objr-input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--objekt-color-cream) !important;
  -webkit-box-shadow:0 0 0 1000px var(--objekt-color-bg) inset !important;
  caret-color:var(--objekt-color-cream);
}

/* --- прикрепить материалы --- */
.objr-attach{padding:0;gap:0;cursor:pointer;}
.objr-attach__trigger{
  flex:1;min-width:0;height:100%;
  display:flex;align-items:center;gap:16px;
  padding:0 16px 0 20px;
  cursor:pointer;
  margin:0;
}
.objr-attach__label{
  font-size:var(--objekt-fs-body);
  color:var(--objekt-color-text-light);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.objr-attach__plus{
  flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  width:52px;height:60%;
  border-left:1px solid var(--objekt-color-line);
  color:var(--objekt-color-text-light);
  cursor:pointer;
  margin:0;
  transition:color .2s;
}
.objr-attach__plus svg{width:22px;height:22px;display:block;}
.objr-attach:hover .objr-attach__plus{color:var(--objekt-color-accent);}
.objr-attach__input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;overflow:hidden;}
.objr-attach:focus-within{border-color:var(--objekt-color-accent);}

.objr-files{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;}
.objr-files:not(:empty){margin-top:12px;}
.objr-file{
  display:flex;align-items:center;gap:8px;
  max-width:100%;
  padding:6px 6px 6px 12px;
  border:1px solid var(--objekt-color-line);
  border-radius:var(--objekt-radius-field);
  font-size:var(--objekt-fs-meta);
  color:var(--objekt-color-text-light);
  margin:0;
}
.objr-file__name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
.objr-file__size{flex-shrink:0;color:var(--objekt-color-text-muted);}
.objr .objr-file__remove{
  flex-shrink:0;
  width:24px;height:24px;
  display:flex;align-items:center;justify-content:center;
  margin:0;padding:0;
  background:transparent;border:0;border-radius:50%;
  color:var(--objekt-color-text-light);
  font-size:18px;line-height:1;
  cursor:pointer;
}
.objr .objr-file__remove:hover{color:var(--objekt-color-cream);background:var(--objekt-color-line);}
.objr-hint{font-size:var(--objekt-fs-caption);color:var(--objekt-color-text-muted);margin-top:8px;}
.objr-hint:empty{display:none;}

/* --- кнопка --- */
.objr .objr-btn{
  width:100%;
  height:var(--objekt-field-h);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  margin:0;
  padding:0 28px 0 clamp(24px, 2.3vw, 44px);
  background:var(--objekt-color-accent);
  color:var(--objekt-color-bg);
  border:0;
  border-radius:var(--objekt-radius-field);
  box-shadow:none;
  font-family:var(--objekt-font-body);
  font-size:var(--objekt-fs-button);
  font-weight:500;
  text-align:left;
  cursor:pointer;
  transition:background-color .2s, opacity .2s;
}
.objr .objr-btn:hover{background:var(--objekt-color-accent-hover);}
.objr .objr-btn:focus-visible{outline:2px solid var(--objekt-color-cream) !important;outline-offset:3px;}
.objr .objr-btn:disabled{opacity:.6;cursor:wait;}
.objr-btn__text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.objr-btn__arrow{display:flex;flex-shrink:0;width:26px;height:26px;transition:transform .2s;}
.objr-btn__arrow svg{width:100%;height:100%;display:block;}
.objr .objr-btn:hover .objr-btn__arrow{transform:translateX(4px);}

/* --- согласия --- */
.objr-check{
  display:flex;align-items:center;gap:16px;
  font-size:var(--objekt-fs-body);
  line-height:1.4;
  color:var(--objekt-color-text-light);
  cursor:pointer;
  margin:0;
}
.objr-check + .objr-check{margin-top:12px;}
.objr-check__input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.objr-check__box{
  flex-shrink:0;
  width:26px;height:26px;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--objekt-color-line-strong);
  border-radius:3px;
  color:transparent;
  transition:background-color .2s, border-color .2s, color .2s;
}
.objr-check__box svg{width:18px;height:18px;display:block;}
.objr-check:hover .objr-check__box{border-color:var(--objekt-color-accent);}
.objr-check__input:checked + .objr-check__box{background:var(--objekt-color-accent);border-color:var(--objekt-color-accent);color:var(--objekt-color-bg);}
.objr-check__input:focus-visible + .objr-check__box{outline:2px solid var(--objekt-color-accent) !important;outline-offset:2px;}
.objr-check.has-error .objr-check__box{border-color:var(--objekt-color-error);}
.objr-check__text a{
  color:var(--objekt-color-accent);
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:4px;
}
.objr-check__text a:hover{color:var(--objekt-color-accent-hover);}

/* --- ошибки --- */
.objr-error{
  display:none;
  font-size:var(--objekt-fs-small);
  line-height:var(--objekt-lh-small);
  color:var(--objekt-color-error);
  margin-top:8px;
}
.objr-error.is-shown{display:block;}
.objr-error--submit.is-shown{margin-top:16px;}

.objr-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

/* --- успешная отправка --- */
.objr-success{
  margin:40px 0 0;
  padding:32px;
  border:1px solid var(--objekt-color-line);
  border-radius:var(--objekt-radius-field);
  background:var(--objekt-color-field-bg);
}
.objr-success[hidden]{display:none;}
.objr-success__icon{
  display:flex;align-items:center;justify-content:center;
  width:48px;height:48px;border-radius:50%;
  background:var(--objekt-color-accent);color:var(--objekt-color-bg);
  margin-bottom:20px;
}
.objr-success__icon svg{width:26px;height:26px;display:block;}
.objr-success__title{
  font-family:var(--objekt-font-heading);
  font-weight:500;
  font-size:var(--objekt-fs-h3);
  line-height:var(--objekt-lh-heading);
  color:var(--objekt-color-cream);
  margin-bottom:12px;
}
.objr-success__text{font-size:var(--objekt-fs-body);line-height:var(--objekt-lh-body);color:var(--objekt-color-text-light);margin:0;max-width:520px;}

/* --- строка «конфиденциально» --- */
.objr-trust{
  display:flex;align-items:center;gap:14px;
  margin-top:32px;
  padding-top:24px;
  border-top:1px solid var(--objekt-color-line);
  font-size:var(--objekt-fs-small);
  line-height:var(--objekt-lh-small);
  color:var(--objekt-color-text-muted);
}
.objr-trust__icon{display:flex;flex-shrink:0;width:24px;height:24px;color:var(--objekt-color-accent);}
.objr-trust__icon svg{width:100%;height:100%;display:block;}

/* --- правая часть: «какие материалы подойдут» — заголовок, иллюстрация, подпись --- */
.objr-media{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  align-self:center;
  text-align:center;
  min-width:0;
}
.objr-media__title{
  font-family:var(--objekt-font-heading);
  font-weight:400;
  font-size:clamp(22px, 1.55vw, 34px);
  line-height:1.2;
  text-wrap:balance;          /* если строка не помещается — делится на две ровные, без висящего слова */
  color:var(--objekt-color-cream);
  margin:0 0 clamp(14px, 1.4vw, 28px);
}
.objr-media__art{position:relative;width:100%;perspective:1200px;}
/* мягкая тень под иллюстрацией — смещается вместе с наклоном */
.objr-media__art::after{
  content:"";
  position:absolute;left:12%;right:12%;bottom:2%;height:14%;
  z-index:0;
  background:radial-gradient(ellipse at center, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0) 70%);
  filter:blur(8px);
  transform:translate(calc(var(--objr-tx, 0) * -10px), 0);
  transition:transform .5s ease;
  pointer-events:none;
}
.objr-media__tilt{
  position:relative;z-index:1;
  transform:rotateX(var(--objr-rx, 0deg)) rotateY(var(--objr-ry, 0deg));
  transition:transform .5s cubic-bezier(.2,.7,.2,1);
  will-change:transform;
}
/* края картинки растворяются в фоне блока — без видимой «коробки» */
.objr-media__img{
  display:block;width:100%;height:auto;
  -webkit-mask-image:linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%), linear-gradient(to bottom, transparent 0, #000 6%, #000 94%, transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%), linear-gradient(to bottom, transparent 0, #000 6%, #000 94%, transparent 100%);
  mask-composite:intersect;
}
.objr-media__caption{
  font-size:clamp(15px, 0.95vw, 19px);
  line-height:1.5;
  color:var(--objekt-color-accent);
  margin:clamp(12px, 1.2vw, 24px) 0 0;
}
/* появление при первом попадании в экран (класс ставит JS; без JS картинка видна сразу) */
.objr-media.is-reveal .objr-media__art{opacity:0;transform:translateY(24px);transition:opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1);}
.objr-media.is-reveal.is-shown .objr-media__art{opacity:1;transform:none;}

/* --- ноутбуки 1100–1500: левая колонка узкая для пары «материалы + кнопка», ставим их в отдельные строки --- */
@media (min-width:1100px) and (max-width:1500px){
  .objr-grid{
    grid-template-areas:
      "name     phone"
      "attach   attach"
      "consents consents"
      "btn      btn";
  }
  .objr-cell--btn{margin-top:8px;}
  .objr .objr-btn{position:relative;justify-content:center;padding:0 64px;}
  .objr-btn__arrow{position:absolute;right:28px;top:50%;margin-top:-13px;}
}

/* --- планшет (768–1099): одна колонка, иллюстрация с подписями под формой, по центру, до 560px --- */
@media (max-width:1099px){
  .objr-wrap{
    width:86.25vw;
    max-width:720px;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:none;
    grid-template-areas:
      "head"
      "body"
      "media";
  }
  .objr .objr-title{font-size:var(--objekt-fs-display);}
  .objr-media{margin:56px auto 0;width:100%;max-width:560px;}
  .objr-form{margin-top:32px;}
  .objr-grid{
    grid-template-columns:minmax(0,1fr);
    grid-template-areas:
      "name"
      "phone"
      "attach"
      "consents"
      "btn";
  }
  .objr-cell--btn{margin-top:8px;}
  /* кнопка на всю ширину: текст по центру, стрелка у правого края — как на мобильном референсе */
  .objr .objr-btn{position:relative;justify-content:center;padding:0 64px;}
  .objr-btn__arrow{position:absolute;right:28px;top:50%;margin-top:-13px;}
}

/* --- телефон (до 767): сначала «что можно прислать», потом форма --- */
@media (max-width:767px){
  .objr-wrap{
    grid-template-areas:
      "head"
      "media"
      "body";
  }
  .objr-media{margin:36px auto 0;max-width:none;}
}

/* --- телефон --- */
@media (max-width:680px){
  .objr{padding:64px 0;}
  .objr-wrap{width:auto;max-width:none;padding:0 20px;}
  .objr-eyebrow{font-size:var(--objekt-fs-caption);letter-spacing:0.24em;gap:16px;margin-bottom:18px;}
  .objr .objr-title{font-size:clamp(30px, 8.6vw, 40px);margin-bottom:20px;}
  .objr-subtitle{font-size:var(--objekt-fs-body);max-width:none;}
  .objr-media{margin-top:28px;}
  .objr-form{margin-top:24px;}
  .objr-grid{gap:12px;}
  .objr-field{padding:0 16px;gap:14px;}
  .objr-attach{padding:0;}
  .objr-attach__trigger{padding:0 12px 0 16px;gap:14px;}
  .objr-attach__plus{width:56px;}
  /* согласия на телефоне — 12px, чтобы каждое помещалось в одну строку */
  .objr-check{font-size:var(--objekt-fs-caption);gap:10px;}
  .objr-check__box{width:20px;height:20px;}
  .objr-check__box svg{width:14px;height:14px;}
  .objr .objr-btn{padding:0 56px;}
  .objr-btn__arrow{right:20px;}
  .objr-trust{margin-top:28px;padding-top:20px;align-items:flex-start;font-size:var(--objekt-fs-meta);}
  .objr-success{padding:24px 20px;}
}

/* ---------- «Направление: …» с карты «Где мы работаем» (параметр direction, страница «Контакты») ---------- */
.objr .objr-dir{display:inline-flex;align-items:center;gap:10px;max-width:100%;margin:0 0 14px;padding:8px 8px 8px 14px;border:1px solid var(--objekt-color-accent);font-size:15px;line-height:1.3;color:var(--objekt-color-cream);}
.objr .objr-dir[hidden]{display:none;}
.objr .objr-dir__text{min-width:0;}
.objr .objr-dir__label{font-weight:500;color:var(--objekt-color-accent);}
.objr .objr-dir__x{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:28px;height:28px;margin:0;padding:0;border:0;border-radius:50%;background:transparent;color:var(--objekt-color-cream);cursor:pointer;box-shadow:none;-webkit-appearance:none;appearance:none;transition:background-color .2s ease;}
.objr .objr-dir__x svg{width:16px;height:16px;}
.objr .objr-dir__x:hover{background:rgba(169,150,125,0.2);}
.objr .objr-dir__x:focus-visible{outline:2px solid var(--objekt-color-accent) !important;outline-offset:2px;}
.objr .objr-dir.is-flash{animation:objrFlash 1s ease;}
@keyframes objrFlash{0%{box-shadow:0 0 0 0 rgba(169,150,125,0.7);}100%{box-shadow:0 0 0 12px rgba(169,150,125,0);}}
@media (prefers-reduced-motion: reduce){ .objr .objr-dir.is-flash{animation:none;} }

/* ---------- поле «Ваш вопрос» (question=1) и компактная форма (variant=compact) — «База знаний» ---------- */
.objr .objr-sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.objr .objr-field--task{grid-area:task;height:auto;min-height:96px;align-items:stretch;padding:14px 20px;}
.objr .objr-textarea{width:100%;min-height:68px;resize:vertical;border:0 !important;background:transparent !important;color:var(--objekt-color-cream) !important;font-family:inherit;font-size:var(--objekt-fs-body);line-height:1.5;outline:none;box-shadow:none;padding:0;margin:0;}
.objr .objr-textarea::placeholder{color:rgba(245,242,237,0.5) !important;opacity:1;}
.objr .objr-grid--q{grid-template-areas:"name phone" "task task" "attach btn" "consents consents";}
@media (min-width:1100px) and (max-width:1500px){ .objr .objr-grid--q{grid-template-areas:"name phone" "task task" "attach attach" "consents consents" "btn btn";} }
@media (max-width:1099px){ .objr .objr-grid--q{grid-template-areas:"name" "phone" "task" "attach" "consents" "btn";} }
/* компактная: одна колонка, без иллюстрации и имени */
.objr.objr--compact{padding:0;background:transparent;}
.objr.objr--compact .objr-wrap{width:auto;max-width:none;display:block;padding:0;}
.objr.objr--compact .objr-title{font-size:clamp(24px, 1.7vw, 30px);margin:0 0 10px;}
.objr.objr--compact .objr-title-main,
.objr.objr--compact .objr-title-accent{display:inline;}
.objr.objr--compact .objr-subtitle{font-size:15px;line-height:1.5;}
.objr.objr--compact .objr-form{margin-top:18px;}
.objr.objr--compact .objr-grid,
.objr.objr--compact .objr-grid--q{grid-template-columns:minmax(0, 1fr);grid-template-areas:"phone" "task" "attach" "consents" "btn";gap:12px;}
.objr.objr--compact .objr-cell--btn{margin-top:4px;}
.objr.objr--compact .objr-btn{position:relative;justify-content:center;padding:0 56px;width:100%;}
.objr.objr--compact .objr-btn__arrow{position:absolute;right:22px;top:50%;margin-top:-13px;}
.objr.objr--compact .objr-check{font-size:var(--objekt-fs-caption);gap:10px;}
.objr.objr--compact .objr-trust{margin-top:14px;font-size:12px;}
.objr .objr-person{float:right;display:block;width:72px;height:72px;margin:0 0 8px 14px;border-radius:50%;overflow:hidden;border:1px solid var(--objekt-color-line-strong);}
.objr .objr-person__img{display:block;width:100%;height:100%;object-fit:cover;}
.objr .objr-person__mono{display:grid;place-items:center;width:100%;height:100%;font-family:var(--objekt-font-heading);font-size:30px;color:var(--objekt-color-accent);}