/* TRIGGER ART — единый фирменный слой.
   Заменяет typography-refresh.css, editorial-refresh.css и personality.css.
   Палитра взята из персонажа: бумага, грифель, оранжевая кепка, синий свитер.
   Шрифты лежат локально (assets/fonts), запросов к Google нет. */

@font-face{font-family:Unbounded;font-weight:700;font-display:swap;src:url(assets/fonts/unbounded-cyrillic-700-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Unbounded;font-weight:700;font-display:swap;src:url(assets/fonts/unbounded-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:Unbounded;font-weight:800;font-display:swap;src:url(assets/fonts/unbounded-cyrillic-800-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Unbounded;font-weight:800;font-display:swap;src:url(assets/fonts/unbounded-latin-800-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'Golos Text';font-weight:400;font-display:swap;src:url(assets/fonts/golos-text-cyrillic-400-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos Text';font-weight:400;font-display:swap;src:url(assets/fonts/golos-text-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2190-2193,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'Golos Text';font-weight:500;font-display:swap;src:url(assets/fonts/golos-text-cyrillic-500-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos Text';font-weight:500;font-display:swap;src:url(assets/fonts/golos-text-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2190-2193,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'Golos Text';font-weight:700;font-display:swap;src:url(assets/fonts/golos-text-cyrillic-700-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos Text';font-weight:700;font-display:swap;src:url(assets/fonts/golos-text-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2190-2193,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'Golos Text';font-weight:800;font-display:swap;src:url(assets/fonts/golos-text-cyrillic-800-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Golos Text';font-weight:800;font-display:swap;src:url(assets/fonts/golos-text-latin-800-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2190-2193,U+2212,U+FEFF,U+FFFD}

/* Layout concept: бумажный лист, на котором оранжевым помечено «нажать», а синим — «работает». */
:root{
  --paper:#f5f1ea;        /* лист */
  --paper-2:#ece5d9;      /* тень листа, второй фон секций */
  --card:#fffdf9;         /* карточка */
  --ink:#1c1a18;          /* грифель */
  --muted:#5f5850;
  --orange:#e8571c;       /* кепка: действие */
  --orange-ink:#b9400c;   /* оранжевый для текста на светлом */
  --orange-pale:#fbe1d0;
  --sweater:#2c4cb0;      /* свитер: результат */
  --sweater-pale:#e1e7f7;
  --blue:#e8571c;         /* старое имя акцента в style.css = оранжевый */
  --display-font:Unbounded,'Arial Black',Arial,sans-serif;
  --ui-font:'Golos Text',Arial,Helvetica,sans-serif;
  --hand-font:Caveat,'Segoe Print',cursive;
  --line:transparent;
  --pale:var(--orange-pale);
}
html{background:var(--paper)}
body{background:var(--paper);color:var(--ink)}
body,button,input,select,textarea{font-family:var(--ui-font)}

/* ---------- Typography ---------- */
h1,h2,h3,.logo,.service h3,.steps h3,.price-list h3,.benefits h3{font-family:var(--display-font)}
h1,h2{font-weight:800;letter-spacing:-.045em;line-height:1.1;text-wrap:balance}
h3{font-weight:700;letter-spacing:-.03em;line-height:1.22}
.hero h1{font-size:clamp(38px,4.6vw,68px);letter-spacing:-.05em;line-height:1.1}
.section-heading h2,.flow-section h2,.contact-copy h2,.journal-heading h2{font-size:clamp(30px,3.7vw,54px);letter-spacing:-.045em;line-height:1.12}
.service h3{font-size:clamp(21px,1.8vw,26px);letter-spacing:-.04em}
.price-list h3{font-size:clamp(15px,1.3vw,18px);letter-spacing:-.02em}
.steps h3,.benefits h3{font-size:18px;letter-spacing:-.03em}
.logo{font-size:18px;letter-spacing:-.04em;font-weight:800}
.logo-art,.hand-note,.cat-whisper,.industry-num{font-family:var(--hand-font);letter-spacing:0}
.logo-art{color:var(--orange-ink)}
.soft{color:var(--sweater)!important}
.kicker{letter-spacing:.14em;color:var(--muted)}
.nav-links{font-weight:700;letter-spacing:-.01em}
.button,.price-filters button,.service-link,.text-link{font-weight:800;letter-spacing:-.01em}
p{text-wrap:pretty}

/* Highlight under «вместо вас» — оранжевый маркер, как в постере */
.marked:before{background:var(--orange-pale)!important;inset:12% -3% 2%}
.marked svg path{stroke:var(--orange)}

/* ---------- Quiet surfaces, one shadow language ---------- */
.nav,.service,.service.product,.chat,.chat-header,.chat-body,.lab-ticket,.benefits,.benefits article,
.brief-form,.faq-list,.question,.process-section,.flow-art,.flow-price,.price-filters button,
.price-list>a,.ai-chat,.ai-head,.ai-input,.ai-msg,.ai-bot,.ai-result,.ai-again,.ai-start,
.industry,.industry-paper,.contact-section,.lab,.mini-check,.service-link,.service-art,
.service-link>span,.form-error,.chat-footer{border:0!important;border-block:0!important}
.nav{background:var(--card);box-shadow:0 10px 30px rgba(28,26,24,.06)}
.nav-cta{white-space:nowrap}
.service{background:var(--card);border-radius:22px;box-shadow:none!important}
.service-link{border-top:0!important;padding-top:16px}
.ai-chat,.chat,.brief-form{box-shadow:0 12px 32px rgba(28,26,24,.07)}
.ai-head,.chat-header,.ai-input,.ai-msg.ai-bot{background:var(--card)}
.logo-switch{background:var(--orange-pale)}
.trigger{border:3px solid var(--ink)!important;box-shadow:4px 5px 0 var(--ink)}
.trigger-knob{border:2px solid var(--ink)!important}
.trigger[aria-pressed=true]{background:var(--orange)}
.button.blue{background:var(--orange);color:#fff;box-shadow:0 4px 0 #a9390a}
.button.blue:hover{background:#d24d16;box-shadow:0 6px 0 #a9390a,0 10px 18px rgba(28,26,24,.12)}
.button.dark{background:var(--ink);color:#fff}
.button.dark:hover{background:var(--sweater);color:#fff}
:where(button,a,input,select,textarea,summary):focus-visible{outline:3px solid var(--sweater)!important;outline-offset:4px}

/* Hero */
.hero h1 .period{color:var(--orange)}
.cat-whisper{font-size:clamp(22px,2vw,30px);font-weight:700;color:var(--orange-ink);line-height:1.18;transform:rotate(-2deg);margin:14px 0 6px;max-width:460px}
.lab{background:var(--paper-2)}
.lab-hero{width:186px;right:-24px;top:-44px}
.ticker{color:var(--ink)}
.ticker i{color:var(--orange)}

/* Services: one hover for all, the card warms up like paper under a lamp */
.service{transition:background-color .3s ease,transform .3s ease}
.service:hover,.service:focus-within{background:#fff4ea;transform:translateY(-5px)}
.service:hover .service-link>span:not(.sr-only),.service:focus-within .service-link>span:not(.sr-only){background:var(--orange);color:#fff}
.service-link>span:not(.sr-only){background:var(--orange-pale)}
.service-art:before{background:var(--orange-pale)!important}
.services-grid .product{grid-column:2/-1;background:var(--sweater-pale)}
.services-grid .question{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:flex-start;gap:28px;min-height:0;padding:30px 34px;background:var(--ink);color:#fff;border-style:solid}
.services-grid .question h3{font-size:clamp(22px,2.2vw,30px)}
.services-grid .question>p{color:#d9d2c8;margin:0}
.services-grid .question .hand-question{position:static;transform:rotate(10deg);font-size:64px;line-height:1;color:var(--orange)}
.services-grid .question .round-arrow{position:static;margin-left:auto;background:var(--orange)!important;color:#fff!important}
.services-grid .question:hover{background:var(--sweater)!important;transform:translateY(-3px)}

/* Flow band: синий свитер — здесь всё «работает» */
.flow-section{background:var(--sweater)!important;color:#fff}
.flow-section:before{border-color:rgba(255,255,255,.18)}
.flow-section .kicker{color:#c9d3f2}
.flow-section h2 .underlined:after{border-bottom-color:var(--orange)}
.flow-price{background:var(--orange)!important;color:#fff;transform:rotate(3deg);box-shadow:0 10px 0 rgba(0,0,0,.12)}
.flow-price small{color:#ffe7d9!important}
.flow-art{background:var(--card)!important;color:var(--ink)}
.flow-bottom p{color:#e3e8fa!important}
.flow-section .button.dark{background:var(--card);color:var(--ink)}
.flow-section .button.dark:hover{background:var(--orange);color:#fff}

/* Industries */
.industry{transition:transform .3s ease}
.industry:hover{transform:translateY(-4px)}
.industry:hover img{transform:rotate(-3deg) scale(1.04)}
.industry-blue{background:var(--sweater)}
.industry-paper{background:var(--card)}
.industry-orange{background:var(--orange-pale);color:var(--ink)}
.industry-num{font-size:32px}
.industry-orange .industry-num{color:var(--orange-ink)}

/* Prices */
.price-filters button{background:var(--card)}
.price-filters button:hover{background:var(--orange-pale)!important;color:var(--ink)!important}
.price-filters button.active{background:var(--ink)!important;color:#fff!important}
.price-list>a{border-bottom:0!important;border-radius:14px;margin:4px 0;background:rgba(255,253,249,.6);transition:background-color .2s,transform .2s}
.price-list>a:hover{background:var(--card)!important;transform:translateX(4px)}
.price-list>a:hover>span{color:var(--orange)}
.price-list>a>span{color:var(--sweater)}

/* Process */
.process-section{background:var(--card)}
.steps article{border-radius:20px;padding:4px 6px;transition:transform .25s}
.steps article:hover{transform:translateY(-3px)}
.step-num{color:#e7ddd0}.blue-num{color:var(--orange)}
.step-mark{color:var(--sweater)}
.benefits article>span{color:var(--orange)}

/* FAQ */
.faq-section h2 .soft{color:var(--sweater)}
.faq-list details{border-bottom:1px solid #e4dbcd!important}
.faq-list summary:hover{color:var(--orange-ink)}

/* Journal */
.journal-section{padding:100px 0 110px;background:var(--paper-2);color:var(--ink)}
.journal-heading{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:38px}
.journal-heading h2{margin:20px 0 0}
.journal-heading h2 span{color:var(--sweater)}
.journal-intro{display:flex;align-items:center;gap:16px;max-width:300px;font-size:15px;line-height:1.5;color:var(--muted)}
.journal-intro img{width:83px;height:83px;object-fit:contain}
.journal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.journal-card{min-height:270px;border-radius:22px;padding:30px;display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:var(--card);transition:background-color .3s,color .3s,transform .3s}
.journal-card-2{background:var(--sweater-pale)}.journal-card-3{background:var(--orange-pale)}.journal-card-4{background:var(--card)}
.journal-card:hover{background:var(--ink)!important;color:#fff;transform:translateY(-6px) rotate(-.4deg)}
.journal-card:nth-child(even):hover{background:var(--sweater)!important;transform:translateY(-6px) rotate(.4deg)}
.journal-meta{display:flex;justify-content:space-between;font-size:12px;text-transform:uppercase;font-weight:800;letter-spacing:.08em}
.journal-card-title{display:block;margin:24px 0 14px;font-family:var(--display-font);font-size:clamp(19px,1.9vw,27px);letter-spacing:-.04em;line-height:1.25;font-weight:800}
.journal-desc{font-size:15px;line-height:1.6;opacity:.82;max-width:530px}
.journal-read{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:30px;font-size:14px;font-weight:800}
.journal-read span{font-size:26px}
.journal-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:28px;font-size:14px;color:var(--muted)}
.journal-all{display:inline-flex;gap:30px;align-items:center;border-radius:99px;background:var(--ink);color:#fff;padding:16px 25px;text-decoration:none;font-weight:800;transition:background-color .25s}
.journal-all:hover{background:var(--orange);color:#fff}

/* Contact: грифельная доска; переключатель настроения перекрашивает её в синий свитер */
.contact-section{background:var(--ink);color:#fff;transition:background-color .4s ease;position:relative}
.contact-copy h2>span{color:#ff8a57!important}
.contact-copy>p,.contact-copy .kicker{color:#d6cec3}
.contact-section.contact-play{background:var(--sweater)!important}
.contact-section.contact-play .contact-copy h2>span{color:#ffc39f!important}
.contact-section.contact-play .contact-copy>p,.contact-section.contact-play .contact-copy .kicker{color:#e3e8fa}
.mood-switch{display:flex;align-items:center;gap:13px;max-width:360px;border:0;border-radius:100px;padding:14px 19px;background:#fff7ef;color:var(--ink);cursor:pointer;font:700 14px var(--ui-font);text-align:left;margin-top:14px;transition:background-color .25s,transform .25s}
.mood-switch:hover{background:var(--orange-pale);transform:rotate(-2deg)}
.mood-switch span:last-child{margin-left:auto;font-size:23px}
.mood-dot{color:var(--orange);font-size:25px}
.mood-response{font:700 16px var(--ui-font);max-width:360px;margin-top:15px!important;color:#fff}
.contact-play .mood-switch{background:var(--orange);color:#fff}.contact-play .mood-dot{color:#fff}
.brief-form .button.blue{background:var(--orange);color:#fff}

/* Footer and legal */
.legal-links{display:flex;gap:16px 24px;flex-wrap:wrap;align-items:center;width:100%;font-size:13px}
.legal-links a{color:inherit;text-underline-offset:4px;opacity:.76}
.legal-links a:hover{opacity:1;color:var(--orange-ink)}
.nav-links a:hover,.footer a:hover{color:var(--orange-ink)!important}
.nav-links a:after{background:var(--orange)}

/* Cookie notice: компактная плашка в углу, не перекрывает первый экран */
.cookie-bar[hidden]{display:none!important}
.cookie-bar{position:fixed;z-index:9999;left:max(20px,env(safe-area-inset-left,0px));bottom:max(20px,env(safe-area-inset-bottom,0px));width:min(400px,calc(100vw - 40px));background:var(--card);color:var(--ink);padding:16px 18px;box-shadow:0 14px 44px rgba(28,26,24,.18);border-radius:20px;display:flex;gap:14px;align-items:center;border:0}
.cookie-copy strong{font-size:15px;font-weight:800;display:block;margin-bottom:3px}
.cookie-copy p{margin:0;font-size:13px;line-height:1.45;color:var(--muted)}
.cookie-copy a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.cookie-okay{flex:none;background:var(--ink);color:#fff;border:0;border-radius:999px;padding:12px 16px;min-height:44px;cursor:pointer;font-size:14px;font-weight:800;transition:background-color .15s}
.cookie-okay:hover{background:var(--orange)}

/* Cat sidekick */
.cat-sidekick{position:fixed;right:max(18px,env(safe-area-inset-right,0px));bottom:max(18px,env(safe-area-inset-bottom,0px));z-index:90;display:flex;align-items:flex-end;gap:8px;max-width:min(330px,calc(100vw - 32px));pointer-events:none}
.cat-sidekick-button{order:2;flex:0 0 auto;width:66px;height:66px;background:var(--orange-pale);border:0;border-radius:22px;cursor:pointer;pointer-events:auto;box-shadow:0 8px 24px rgba(28,26,24,.12);transition:transform .2s}
.cat-sidekick-button:hover{transform:rotate(-7deg) scale(1.04)}
.cat-sidekick-button img{max-width:100%;max-height:100%;object-fit:contain}
.cat-sidekick-quote{padding:11px 15px;background:var(--ink);color:#fff;border-radius:17px 17px 5px 17px;font-size:13px;line-height:1.4;max-width:220px;margin:0 0 6px;box-shadow:0 8px 22px rgba(0,0,0,.1);pointer-events:auto}

@media(max-width:1000px){
 .services-grid .product{grid-column:1/-1}
}
@media(max-width:850px){
 .lab-hero{width:140px;right:-8px;top:-36px}
}
@media(max-width:780px){
 .journal-heading{align-items:start;flex-direction:column}
 .journal-grid{grid-template-columns:1fr}
 .journal-section{padding:75px 0}
 .journal-card{min-height:230px}
 .journal-bottom{align-items:flex-start;flex-direction:column}
 .services-grid .question{flex-wrap:wrap;gap:12px 20px;padding:26px}
}
@media(max-width:640px){
 .hero h1{font-size:clamp(32px,9vw,46px);letter-spacing:-.045em}
 .section-heading h2,.flow-section h2,.contact-copy h2,.journal-heading h2{font-size:clamp(27px,7.6vw,38px)}
 .service h3{font-size:22px}
 .logo{font-size:16px}
 .nav-cta{font-size:13px;padding:9px 13px;gap:8px}
 .nav-cta>span{display:none}
 .nav{gap:10px;padding-right:12px}
 .lab-hero{width:112px;top:-42px;right:-2px}
 .cookie-bar{left:10px;right:10px;bottom:10px;width:auto;flex-direction:row;padding:12px 14px}
 .cookie-copy p{font-size:12px}
 .cat-sidekick{right:10px;bottom:10px}
 .cat-sidekick-button{width:54px;height:54px}
 .cat-sidekick-quote{display:none}
 body:has(.cookie-bar:not([hidden])) .cat-sidekick{display:none}
 .services-grid .question .hand-question{display:none}
}
@media(prefers-reduced-motion:reduce){
 .service,.industry,.steps article,.journal-card,.contact-section,.price-list>a,.cat-sidekick-button,.cookie-okay,.mood-switch,.industry img{transition:none!important}
 .service:hover,.industry:hover,.journal-card:hover,.price-list>a:hover{transform:none!important}
}