/* KLEN v12: editorial photography within Ilya's approved identity. */
:root{--motion-fast:180ms;--motion-page:650ms;--ease-editorial:cubic-bezier(.22,.68,.2,1)}
@view-transition{navigation:auto}::view-transition-old(root),::view-transition-new(root){animation-duration:220ms}
.button,.header-cta{text-decoration:none}.button:focus-visible::after{animation:klen-light .9s ease-out}.button[aria-disabled=true]{opacity:.6;pointer-events:none}
.hero h1 .title-line>span{animation:none!important}.hero-photo,.js .hero-actions,.js .hero-note{animation:none!important}.hero-visual{will-change:auto}.hero-work-link{font-size:16px}.hero-note{font-size:14px}
.services{padding-block:72px}.service-grid{gap:38px}.service-card{border-top-color:var(--olive)}.service-index{font-size:14px}.service-card h3{margin-top:18px}.service-card p{max-width:35ch}
.portfolio-head{margin-bottom:40px}.project-tab{position:relative}.project-tab img{aspect-ratio:1.4;object-position:center 53%;filter:none!important}.project-tab:not(.is-active){color:var(--muted)}.project-tab.is-active{border-bottom-width:2px}.project-tab span{font-size:15px}.project-tab:hover img{transform:translateY(-4px)}.project-tab:focus-visible{outline-offset:6px}
.project-stage{padding:28px;background:#ebe5d8;gap:42px;grid-template-columns:minmax(0,1.5fr) minmax(0,.7fr)}.stage-image{background:#e1dacb;aspect-ratio:4/3}.stage-image img{object-fit:contain}.stage-zoom{font-size:14px;bottom:18px;left:18px;max-width:calc(100% - 36px)}.project-status{font-size:12px}.project-meta h3{font-size:clamp(30px,3vw,42px);margin-bottom:18px}.project-meta>p{line-height:1.55}.project-panel{margin-block:22px}.project-thumb:only-child{display:none}.portfolio-cta{min-width:0;width:100%;margin-top:14px}.text-link{display:inline-flex;align-items:center;gap:25px;padding-block:12px;border-bottom:1px solid var(--olive);text-decoration:none;font-size:18px;line-height:1.3}.text-link span{transition:transform .25s}.text-link:hover span{transform:translate(3px,-3px)}.project-detail-link{margin-top:18px}.gallery-fallback{display:flex;flex-wrap:wrap;gap:20px;padding-top:24px}
.process-spread{display:grid;grid-template-columns:1fr 1.1fr;gap:8%;align-items:center;margin-top:44px}.process-visual{position:relative;margin:0;overflow:hidden;max-height:680px}.process-visual img{width:100%;height:100%;max-height:640px;object-fit:cover;object-position:center 60%}.process-visual figcaption{position:absolute;bottom:20px;left:20px;background:var(--cream);padding:7px 14px;font-size:14px}.process-spread .approach-steps{display:block;margin:0;width:100%;padding:0}.process-spread .approach-steps li{display:grid;grid-template-columns:45px 1fr;border-top:1px solid var(--line);padding:28px 0;gap:0 20px}.process-spread .approach-steps li>span{grid-row:1/3;font-size:18px}.process-spread .approach-steps h3{margin-bottom:12px;font-size:32px}.process-spread .approach-steps p{grid-column:2;max-width:34ch;font-size:18px}
.gallery-feedback{position:absolute;z-index:2;top:70px;left:50%;transform:translateX(-50%);width:min(90%,600px);text-align:center;pointer-events:none}.gallery-status:empty{display:none}.gallery-status{display:inline-block;background:var(--cream);color:var(--ink);padding:12px 18px;margin:0;font-size:16px}.gallery-retry{pointer-events:auto;display:block;margin:10px auto;padding:12px 22px;background:var(--olive);color:var(--cream);border:1px solid var(--cream)}.lightbox img.is-loading{opacity:.25}.lightbox-controls{background:var(--cream);padding:8px 14px;min-width:min(90%,420px)}.lightbox-controls button{padding-inline:14px}
.back-link{display:inline-block;text-decoration:none;border-bottom:1px solid var(--line);padding-block:10px;margin-bottom:32px;font-size:16px}.story-page .header-inner{padding-block:16px}.story-page .brand-emblem{width:104px;height:104px}.story-page .wordmark{font-size:48px}.story-page .brand-tagline{font-size:10px}.story-intro{display:grid;grid-template-columns:.85fr 1.15fr;gap:8%;align-items:center;padding-block:65px 90px}.story-intro h1{font-size:clamp(55px,7.5vw,108px);line-height:.98;letter-spacing:-.035em;margin:18px 0 30px;font-weight:400}.story-intro h1 em{font-weight:400;color:var(--olive)}.story-lead{font-size:22px;max-width:28ch;line-height:1.5;margin-bottom:32px}.story-cover{margin:0}.story-cover img{width:100%;height:min(76vh,820px);object-fit:cover;object-position:center 60%}.story-cover a{display:block;overflow:hidden}.story-cover img,.story-frame img{transition:transform 1.1s var(--ease-editorial)}.story-cover a:hover img,.story-frame a:hover img{transform:scale(1.025)}.story-cover figcaption,.story-frame figcaption{font-size:16px;padding-top:16px;display:flex;gap:24px;color:var(--muted)}.story-scroll{display:flex;max-width:max-content;margin-top:25px}.story-note{display:grid;grid-template-columns:1fr 1fr;gap:20px 10%;align-items:center;border-top:1px solid var(--line);padding-block:55px 65px}.story-note .eyebrow{grid-column:1/-1;margin:0}.story-note h2{font-size:clamp(36px,4vw,56px);margin:0}.story-note p{font-size:21px;line-height:1.55;margin:0;max-width:42ch}.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px 9%;align-items:start}.story-frame{margin:0;min-width:0}.story-frame:nth-child(even){margin-top:140px}.story-frame a{display:block;overflow:hidden}.story-frame img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover}.story-frame:last-child:nth-child(odd){width:76%;margin-left:24%}.story-next{margin-block:100px 80px;border-top:1px solid var(--line)}.story-next>a{position:relative;display:block;padding:38px 230px 38px 0;text-decoration:none;min-height:200px}.story-next .eyebrow{display:block}.next-title{font-size:clamp(34px,4.8vw,64px);line-height:1.15}.next-title span{display:inline-block;transition:transform .4s}.story-next a:hover .next-title span{transform:translate(8px,-8px)}.story-next img{position:absolute;right:0;top:30px;width:170px;height:155px;object-fit:cover}.story-page .final-cta{margin-top:40px}
.contact-page{min-height:100svh;background:var(--cream)}.contact-shell{width:min(90%,650px);margin:auto;padding:45px 0 80px}.contact-shell h1{font-size:clamp(46px,7vw,76px);line-height:1.02;font-weight:400;letter-spacing:-.035em;margin:15px 0 25px}.contact-intro{font-size:21px;max-width:40ch}.contact-shell .lead-form{padding:0}.contact-shell .lead-form>label{margin-bottom:20px}.contact-shell .lead-form input,.contact-shell .lead-form textarea{background:#fbf8f0}.contact-shell .lead-form .lead-consent{font-size:15px}.contact-shell .lead-status{font-size:17px}.native-error{font-size:20px;color:#8b3030}.lead-consent{font-size:14px}.lead-status{font-size:16px}.lead-dialog .lead-form{padding:0}.lead-dialog{padding:36px}.lead-form label{line-height:1.4}.contact-shell .back-link{margin-bottom:40px}
.js .story-frame[data-reveal]{transform:translateY(24px);clip-path:inset(5% 0 0 0);transition:opacity .65s ease,transform .8s var(--ease-editorial),clip-path .8s var(--ease-editorial)}.js .story-frame.is-visible{transform:none;clip-path:inset(0)}
@media(max-width:1000px){.project-stage{gap:25px;padding:20px;grid-template-columns:1.25fr 1fr}.process-spread{gap:6%}.story-intro{gap:5%}.story-page .brand-emblem{width:90px;height:90px}}
@media(max-width:680px){.hero-work-link{font-size:14px}.hero-note{font-size:14px}.services{padding-block:52px}.service-card h3{margin-top:10px}.project-stage{padding:14px;gap:25px;grid-template-columns:1fr}.project-meta h3{font-size:34px}.project-side{padding:4px 6px 10px}.project-panel{grid-template-columns:repeat(4,minmax(0,1fr))}.project-tab b{font-size:17px}.project-tab img{aspect-ratio:1.45}.project-tab span{font-size:14px}.project-switcher{gap:24px 14px}.stage-zoom{font-size:13px;padding:9px 11px}.process-spread{grid-template-columns:1fr;gap:30px;margin-top:26px}.process-visual{max-height:440px}.process-visual img{height:440px;object-position:center 55%}.process-spread .approach-steps li{padding:24px 0;grid-template-columns:30px 1fr;gap:0 12px}.process-spread .approach-steps h3{font-size:29px}.process-spread .approach-steps p{font-size:18px}.story-page .header-inner{padding-top:15px}.story-page .brand{flex-basis:auto}.story-page .brand-emblem{width:76px;height:76px}.story-page .wordmark{font-size:38px}.story-page .brand-tagline{font-size:9px}.story-page .nav{flex-basis:100%;margin-top:6px}.story-intro{grid-template-columns:1fr;padding-block:30px 50px;gap:40px}.story-intro h1{font-size:65px}.story-lead{font-size:21px;max-width:32ch}.story-cover img{height:auto;aspect-ratio:3/4;object-fit:contain}.story-intro .back-link{margin-bottom:24px}.story-note{grid-template-columns:1fr;gap:18px;padding-block:35px 40px}.story-note p{font-size:20px}.story-grid{grid-template-columns:1fr;gap:40px}.story-frame:nth-child(even){margin-top:0}.story-frame:last-child:nth-child(odd){width:100%;margin-left:0}.story-cover figcaption,.story-frame figcaption{font-size:15px;gap:14px}.story-next{margin-block:55px 40px}.story-next>a{padding:25px 105px 25px 0;min-height:145px}.story-next img{width:85px;height:100px;top:25px}.next-title{font-size:30px}.story-next .eyebrow{font-size:10px;letter-spacing:.08em}.gallery-feedback{top:58px}.lightbox-controls{gap:8px;padding-inline:6px}.lightbox-controls button{font-size:14px;padding-inline:8px}.lead-dialog{padding:24px}.contact-shell{padding-top:25px}.contact-shell .lead-consent{font-size:14px}}
@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none!important}.js .story-frame[data-reveal]{clip-path:none;transform:none;opacity:1}.story-cover img,.story-frame img,.project-tab img{transition:none;transform:none!important}}

/* v13: literal corrections from Ilya's rich-text messages, 22 October. */
#fears-title{font-size:clamp(32.4px,3.69vw,52.2px)}
#approach-title{font-style:italic}
.field-hint{display:block;font-size:16px;line-height:1.45;color:var(--muted);margin:9px 0 12px;font-weight:400}
@media(max-width:680px){#fears-title{font-size:34.2px}.field-hint{font-size:15px}}
/* Илья 27.10 (msg 327139): «Слушаем/Проектируем/Создаём» по линии заголовков шагов */
@media(min-width:681px){#approach .approach-grid{grid-template-columns:1fr 1.1fr;column-gap:8%}#approach .approach-grid h2{padding-left:65px}}
@media(min-width:681px) and (max-width:1000px){#approach .approach-grid{column-gap:6%}}

@media(min-width:901px){.project-switcher{grid-template-columns:repeat(5,minmax(0,1fr))}}