@import url("https://fonts.googleapis.com/css2?family=Golos+Text:wght@400;500;600;700;800&display=swap");
/* LookTwinStudio Design System 1.2.0 — токены и базовые классы */
:root{
/* Палитра */
--lt-color-milk:#F6F4ED;--lt-color-ink:#20211F;--lt-color-cherry:#D8463C;--lt-color-sky:#BCD6DF;--lt-color-butter:#EFD970;--lt-color-moss:#566C4D;
/* Цвета знака 1.1: Primary и Inverse берут системные Ink, Milk и Cherry */
--lt-logo-primary:var(--lt-color-ink);--lt-logo-primary-accent:var(--lt-color-cherry);--lt-logo-inverse:var(--lt-color-milk);--lt-logo-inverse-accent:var(--lt-color-cherry);
--lt-color-logo-primary:var(--lt-logo-primary);--lt-color-logo-primary-accent:var(--lt-logo-primary-accent);--lt-color-logo-inverse:var(--lt-logo-inverse);--lt-color-logo-inverse-accent:var(--lt-logo-inverse-accent);
/* Только Heritage-версия, в палитру новых интерфейсов не входят */
--lt-logo-night:#091A21;--lt-logo-blue:#1885C6;--lt-logo-white:#F3F4F4;
--lt-color-logo-night:var(--lt-logo-night);--lt-color-logo-blue:var(--lt-logo-blue);--lt-color-logo-white:var(--lt-logo-white);
/* Роли */
--lt-color-background:var(--lt-color-milk);--lt-color-text:var(--lt-color-ink);--lt-color-text-inverse:var(--lt-color-milk);--lt-color-muted:rgb(32 33 31 / 62%);
--lt-color-accent:var(--lt-color-cherry);--lt-color-highlight:var(--lt-color-butter);--lt-color-info:var(--lt-color-sky);--lt-color-positive:var(--lt-color-moss);
--lt-color-tint:#EFEADB;--lt-color-line:rgb(32 33 31 / 18%);--lt-color-line-strong:rgb(32 33 31 / 42%);--lt-color-media-scrim:rgb(16 16 14 / 42%);
--lt-color-on-dark:var(--lt-color-milk);--lt-color-muted-on-dark:rgb(246 244 237 / 62%);
/* Шрифты */
--lt-font-display:"Golos Text","Trebuchet MS","Arial Narrow",Arial,sans-serif;--lt-font-editorial:Georgia,"Times New Roman",serif;--lt-font-utility:"Courier New",Courier,monospace;
--lt-weight-regular:400;--lt-weight-medium:600;--lt-weight-bold:700;
/* Шкала */
--lt-text-hero:clamp(3.5rem,5.1vw,4.75rem);--lt-leading-hero:.87;--lt-tracking-hero:-.055em;
--lt-text-display:clamp(3rem,4.25vw,4rem);--lt-leading-display:.9;--lt-tracking-display:-.055em;
--lt-text-h2:clamp(2.25rem,3vw,3rem);--lt-leading-heading:.95;--lt-tracking-heading:-.04em;
--lt-text-h3:clamp(1.5rem,2vw,2rem);--lt-leading-h3:1.05;--lt-tracking-h3:-.03em;
--lt-text-body-lg:1.125rem;--lt-text-body:1rem;--lt-text-body-sm:.8125rem;--lt-leading-body:1.5;
--lt-text-utility:.625rem;--lt-leading-utility:1.25;--lt-tracking-utility:.12em;
/* Пространство: базовый шаг 4 px */
--lt-space-1:.25rem;--lt-space-2:.5rem;--lt-space-3:.75rem;--lt-space-4:1rem;--lt-space-6:1.5rem;--lt-space-8:2rem;--lt-space-12:3rem;--lt-space-16:4rem;--lt-space-20:5rem;--lt-space-30:7.5rem;
/* Сетка */
--lt-page-max:100rem;
--lt-page-gutter:clamp(1rem,2.1vw,2rem); /* @kind spacing */
--lt-grid-gap:.5rem;--lt-header-height:5rem;--lt-reading-width:42rem;--lt-hero-min:42.5rem;
--lt-overlap-max:11.25rem;--lt-overlap-safe-zone:13.75rem;
/* Форма */
--lt-border:1px solid var(--lt-color-line);--lt-border-strong:2px solid var(--lt-color-ink);--lt-radius-none:0;--lt-radius-subtle:.125rem;--lt-radius-round:999px;--lt-radius-logo:.25rem;--lt-focus-ring:2px solid var(--lt-color-cherry);
/* Движение */
--lt-duration-fast:180ms; /* @kind other */
--lt-duration-base:280ms; /* @kind other */
--lt-duration-scene:750ms; /* @kind other */
--lt-duration-logo:760ms; /* @kind other */
--lt-duration-aperture:var(--lt-duration-logo); /* @kind other */
--lt-ease-exit:cubic-bezier(.4,0,1,1); /* @kind other */
--lt-ease-standard:cubic-bezier(.2,.8,.2,1); /* @kind other */
/* Слои */
--lt-layer-base:0; /* @kind other */
--lt-layer-media:1; /* @kind other */
--lt-layer-gradient:4; /* @kind other */
--lt-layer-copy:7; /* @kind other */
--lt-layer-header:10; /* @kind other */
--lt-layer-modal:100; /* @kind other */
/* Свет под текстом, входящим в кадр */
--lt-overlap-gradient:linear-gradient(90deg,rgb(246 244 237 / 94%) 0,rgb(246 244 237 / 62%) 34%,rgb(246 244 237 / 18%) 72%,transparent 100%); /* @kind other */
--lt-overlap-gradient-left:linear-gradient(270deg,rgb(246 244 237 / 94%) 0,rgb(246 244 237 / 62%) 34%,rgb(246 244 237 / 18%) 72%,transparent 100%); /* @kind other */
--lt-overlap-glow:0 0 18px rgb(246 244 237 / 96%),0 0 38px rgb(246 244 237 / 80%); /* @kind shadow */
/* Цветовое пятно: один Butter-спот на секцию, только на Milk */
--lt-glow-butter:radial-gradient(circle at 16% 18%,rgb(239 217 112 / 52%),transparent 26%); /* @kind other */
--lt-glow-butter-soft:radial-gradient(circle at 82% 12%,rgb(239 217 112 / 38%),transparent 30%); /* @kind other */
}
@media (max-width:930px){:root{--lt-text-hero:clamp(3rem,11.5vw,4.5rem);--lt-overlap-max:0rem;--lt-overlap-safe-zone:0rem}}
@media (prefers-reduced-motion:reduce){:root{--lt-duration-fast:0ms; /* @kind other */ --lt-duration-base:0ms; /* @kind other */ --lt-duration-scene:0ms; /* @kind other */ --lt-duration-logo:0ms /* @kind other */}}
*{box-sizing:border-box}
body{margin:0;min-width:320px;background:var(--lt-color-background);color:var(--lt-color-text);font:var(--lt-weight-regular) var(--lt-text-body)/var(--lt-leading-body) var(--lt-font-display);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
button{font:inherit}
a{color:var(--lt-color-ink);text-decoration:none;border-bottom:1px solid var(--lt-color-cherry)}
a:hover{background:var(--lt-color-butter);border-bottom-color:var(--lt-color-ink)}
:focus-visible{outline:var(--lt-focus-ring);outline-offset:3px}
h1,h2,h3,h4{margin:0;font-family:var(--lt-font-display);font-weight:var(--lt-weight-bold);color:var(--lt-color-ink)}
/* Утилитарные роли текста */
.lt-utility{font:var(--lt-text-utility)/var(--lt-leading-utility) var(--lt-font-utility);text-transform:uppercase;letter-spacing:var(--lt-tracking-utility)}
.lt-editorial{font:var(--lt-weight-regular) var(--lt-text-body-lg)/var(--lt-leading-body) var(--lt-font-editorial);max-width:var(--lt-reading-width)}
.lt-accent{font-family:var(--lt-font-editorial);font-weight:var(--lt-weight-regular);font-style:italic;color:var(--lt-color-cherry)}
/* Button */
.lt-btn{min-height:2.875rem;padding:0 1.125rem;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:var(--lt-space-2);border:1px solid var(--lt-color-ink);border-radius:var(--lt-radius-subtle);font:var(--lt-weight-bold) var(--lt-text-body-sm)/1 var(--lt-font-display);letter-spacing:0;cursor:pointer;transition:background var(--lt-duration-fast) var(--lt-ease-standard),color var(--lt-duration-fast) var(--lt-ease-standard)}
.lt-btn--primary{background:var(--lt-color-ink);color:var(--lt-color-milk)}
.lt-btn--primary:hover{background:var(--lt-color-butter);color:var(--lt-color-ink)}
.lt-btn--secondary{background:transparent;color:var(--lt-color-ink);font-weight:var(--lt-weight-regular)}
.lt-btn--secondary:hover{background:var(--lt-color-sky)}
.lt-btn--onDark{background:var(--lt-color-milk);color:var(--lt-color-ink);border-color:var(--lt-color-milk)}
.lt-btn--onDark:hover{background:var(--lt-color-butter);border-color:var(--lt-color-butter)}
.lt-link{display:inline-flex;align-items:center;min-height:2.875rem;white-space:nowrap;border-bottom:1px solid currentColor;color:inherit;font:var(--lt-weight-regular) var(--lt-text-body-sm)/1 var(--lt-font-display);cursor:pointer;transition:border-color var(--lt-duration-fast) var(--lt-ease-standard)}
.lt-link:hover{border-bottom-color:var(--lt-color-cherry)}
/* Tag */
.lt-tag{display:inline-flex;align-items:center;padding:8px 10px;border-radius:var(--lt-radius-subtle);font:9px/1 var(--lt-font-utility);text-transform:uppercase;letter-spacing:.09em;white-space:nowrap}
.lt-tag--butter{background:var(--lt-color-butter);color:var(--lt-color-ink)}
.lt-tag--sky{background:var(--lt-color-sky);color:var(--lt-color-ink)}
.lt-tag--cherry{background:var(--lt-color-cherry);color:var(--lt-color-milk)}
.lt-tag--moss{background:var(--lt-color-moss);color:var(--lt-color-milk)}
.lt-tag--outline{background:transparent;color:var(--lt-color-ink);box-shadow:inset 0 0 0 1px var(--lt-color-line-strong)}
/* Source link: подтверждение, а не кнопка */
.lt-source{display:inline-flex;align-items:baseline;gap:.375rem;max-width:22rem;color:var(--lt-color-ink);font:var(--lt-weight-regular) var(--lt-text-body-sm)/1.4 var(--lt-font-display);border-bottom:1px solid var(--lt-color-cherry);transition:background var(--lt-duration-fast) var(--lt-ease-standard)}
.lt-source:hover{background:var(--lt-color-butter);border-bottom-color:var(--lt-color-ink)}
.lt-source::after{content:"↗";font-family:var(--lt-font-utility);font-size:.75rem;line-height:1}
.lt-source__kind{font:var(--lt-text-utility)/1 var(--lt-font-utility);text-transform:uppercase;letter-spacing:var(--lt-tracking-utility);color:var(--lt-color-muted)}
/* SectionHead */
.lt-section-head{display:grid;grid-template-columns:minmax(180px,.6fr) minmax(520px,1.4fr);gap:var(--lt-space-8);margin-bottom:var(--lt-space-12)}
.lt-section-head__id{font:var(--lt-text-utility)/1 var(--lt-font-utility);text-transform:uppercase;letter-spacing:var(--lt-tracking-utility);color:var(--lt-color-muted)}
.lt-section-head__title{max-width:850px;font-size:var(--lt-text-h2);line-height:var(--lt-leading-heading);letter-spacing:var(--lt-tracking-heading)}
.lt-section-head__intro{grid-column:2;max-width:var(--lt-reading-width);margin:calc(var(--lt-space-6) * -1) 0 0;font:var(--lt-text-body-lg)/var(--lt-leading-body) var(--lt-font-editorial)}
/* SiteHeader */
.lt-header{min-height:var(--lt-header-height);padding:0 var(--lt-page-gutter);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--lt-space-6);border-bottom:var(--lt-border);background:rgb(246 244 237 / 94%);backdrop-filter:blur(12px);position:sticky;top:0;z-index:var(--lt-layer-header)}
.lt-header__brand{display:flex;align-items:center;gap:var(--lt-space-3);border:0;color:var(--lt-color-ink);font:var(--lt-weight-bold) var(--lt-text-body)/1 var(--lt-font-display);letter-spacing:-.03em}
.lt-header__brand img{width:36px;height:36px;border-radius:var(--lt-radius-logo)}
.lt-header__note{justify-self:center;font:var(--lt-text-utility)/1 var(--lt-font-utility);text-transform:uppercase;letter-spacing:var(--lt-tracking-utility);color:var(--lt-color-muted)}
.lt-header__right{justify-self:end;display:flex;align-items:center;gap:var(--lt-space-6)}
.lt-header__nav{display:flex;gap:var(--lt-space-6)}
.lt-header__nav a{color:var(--lt-color-ink);border:0;font-size:var(--lt-text-body-sm)}
.lt-header__nav a:hover{border-bottom:1px solid var(--lt-color-ink)}
/* MediaSlot */
.lt-slot{display:grid;place-items:center;min-height:180px;border:var(--lt-border);background:repeating-linear-gradient(135deg,transparent,transparent 9px,rgb(32 33 31 / 7%) 9px,rgb(32 33 31 / 7%) 10px)}
.lt-slot__cap{padding:8px 12px;background:var(--lt-color-milk);font:var(--lt-text-utility)/1.4 var(--lt-font-utility);text-transform:uppercase;letter-spacing:var(--lt-tracking-utility);color:var(--lt-color-muted);text-align:center}
/* MediaPlayer */
.lt-player{position:relative;display:block;overflow:hidden;isolation:isolate;border:0;color:var(--lt-color-milk);background:var(--lt-color-ink)}
.lt-player img{width:100%;height:100%;object-fit:cover}
.lt-player::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(transparent 42%,rgb(16 16 14 / 72%));pointer-events:none}
.lt-player__play{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);width:5rem;height:5rem;display:grid;place-items:center;border:1px solid var(--lt-color-milk);border-radius:var(--lt-radius-round);background:rgb(246 244 237 / 12%);color:var(--lt-color-milk);cursor:pointer;transition:background var(--lt-duration-base) var(--lt-ease-standard)}
.lt-player__play:hover{background:var(--lt-color-milk);color:var(--lt-color-ink)}
.lt-player__play span{display:block;width:0;height:0;margin-left:.25rem;border-left:1.125rem solid currentColor;border-top:.6875rem solid transparent;border-bottom:.6875rem solid transparent}
.lt-player__meta{position:absolute;z-index:3;inset:auto var(--lt-space-6) var(--lt-space-6);display:flex;justify-content:space-between;align-items:end;gap:var(--lt-space-6)}
.lt-player__title{font-size:var(--lt-text-h3);line-height:1;letter-spacing:var(--lt-tracking-heading);color:var(--lt-color-milk)}
.lt-player__spec{font:var(--lt-text-utility)/1.4 var(--lt-font-utility);text-transform:uppercase;letter-spacing:var(--lt-tracking-utility);text-align:right}
.lt-player__tag{position:absolute;z-index:3;top:var(--lt-space-4);left:var(--lt-space-4)}
/* ProjectRoom */
.lt-room{position:relative;display:block;overflow:hidden;isolation:isolate;border:0;color:var(--lt-color-milk)}
.lt-room img{width:100%;height:100%;object-fit:cover;transition:transform var(--lt-duration-scene) var(--lt-ease-standard)}
.lt-room:hover img{transform:scale(1.045)}
.lt-room::after{content:"";position:absolute;inset:38% 0 0;z-index:1;background:linear-gradient(transparent,var(--lt-color-media-scrim) 58%,rgb(16 16 14 / 78%));pointer-events:none}
.lt-room__tag{position:absolute;z-index:3;top:var(--lt-space-4);left:var(--lt-space-4)}
.lt-room__caption{position:absolute;z-index:3;left:var(--lt-space-6);right:var(--lt-space-6);bottom:var(--lt-space-6);display:flex;justify-content:space-between;align-items:end;gap:var(--lt-space-6)}
.lt-room__title{font-size:var(--lt-text-h3);line-height:.95;letter-spacing:var(--lt-tracking-heading);color:var(--lt-color-milk)}
.lt-room__note{max-width:220px;font:9px/1.4 var(--lt-font-utility);text-transform:uppercase;letter-spacing:.08em;text-align:right}
/* TeamCard */
.lt-person{min-height:330px;padding:var(--lt-space-6);display:flex;flex-direction:column;justify-content:space-between;gap:var(--lt-space-8);background:var(--lt-color-milk);transition:background var(--lt-duration-base) var(--lt-ease-standard),color var(--lt-duration-base) var(--lt-ease-standard)}
.lt-person__portrait{width:86px;height:112px;display:grid;place-items:center;overflow:hidden;border:1px solid currentColor;font:italic var(--lt-weight-regular) 42px/1 var(--lt-font-editorial)}
.lt-person__portrait img{width:100%;height:100%;object-fit:cover}
.lt-person__name{margin-bottom:var(--lt-space-1);font-size:1.375rem;letter-spacing:-.025em}
.lt-person__role{font:var(--lt-text-utility)/1.3 var(--lt-font-utility);text-transform:uppercase;letter-spacing:var(--lt-tracking-utility)}
.lt-person__note{margin:var(--lt-space-3) 0 0;font-size:var(--lt-text-body-sm);line-height:1.45}
.lt-person--butter:hover{background:var(--lt-color-butter)}
.lt-person--sky:hover{background:var(--lt-color-sky)}
.lt-person--cherry:hover{background:var(--lt-color-cherry);color:var(--lt-color-milk)}
.lt-person--moss:hover{background:var(--lt-color-moss);color:var(--lt-color-milk)}
.lt-person--cherry:hover .lt-person__name,.lt-person--moss:hover .lt-person__name{color:var(--lt-color-milk)}
/* Signature: текст входит в кадр */
.lt-scene{display:grid;grid-template-columns:minmax(430px,.78fr) minmax(520px,1.22fr);overflow:hidden;isolation:isolate;border-bottom:var(--lt-border)}
.lt-scene--left{grid-template-columns:minmax(520px,1.22fr) minmax(430px,.78fr)}
.lt-scene__copy{position:relative;z-index:var(--lt-layer-copy);padding:var(--lt-space-16) 4.5vw var(--lt-space-12);display:flex;flex-direction:column;justify-content:space-between;gap:var(--lt-space-8);background:var(--lt-color-milk);overflow:visible}
.lt-scene__copy--glow{background:var(--lt-glow-butter),var(--lt-color-milk)}
.lt-scene__media{position:relative;z-index:var(--lt-layer-media);overflow:hidden}
.lt-scene__media::before{content:"";position:absolute;z-index:var(--lt-layer-gradient);inset:0 auto 0 0;width:var(--lt-overlap-safe-zone);background:var(--lt-overlap-gradient);pointer-events:none}
.lt-scene--left .lt-scene__media::before{inset:0 0 0 auto;background:var(--lt-overlap-gradient-left)}
.lt-scene__media img{width:100%;height:100%;object-fit:cover}
.lt-scene__label{position:absolute;z-index:var(--lt-layer-copy);top:var(--lt-space-6);right:var(--lt-space-6)}
.lt-scene--left .lt-scene__label{right:auto;left:var(--lt-space-6)}
/* Текст, выходящий за колонку на кадр: до 180 px */
.lt-crossover{position:relative;z-index:var(--lt-layer-copy);display:block;width:max-content;max-width:calc(100% + var(--lt-overlap-max));text-shadow:var(--lt-overlap-glow)}
.lt-crossover--short{max-width:calc(100% + 120px)}
/* Цветовое пятно на светлой поверхности */
.lt-glow{background:var(--lt-glow-butter),var(--lt-color-milk)}
.lt-glow--soft{background:var(--lt-glow-butter-soft),var(--lt-color-milk)}
.lt-glow--tint{background:var(--lt-glow-butter),var(--lt-color-tint)}
/* CaseChapter */
.lt-chapter{display:grid;grid-template-columns:200px minmax(0,1fr);gap:var(--lt-space-12);padding:var(--lt-space-12) 0;border-top:var(--lt-border)}
.lt-chapter__num{font:var(--lt-weight-bold) 56px/.85 var(--lt-font-display);letter-spacing:-.05em;color:var(--lt-color-line-strong)}
.lt-chapter__field{margin-top:var(--lt-space-4)}
.lt-chapter__field-label{display:block;margin-bottom:var(--lt-space-2);font:var(--lt-weight-bold) var(--lt-text-body-sm)/1.2 var(--lt-font-display);text-transform:uppercase;letter-spacing:.06em;color:var(--lt-color-ink)}
.lt-chapter__field p{margin:0;max-width:var(--lt-reading-width);font:var(--lt-text-body-lg)/var(--lt-leading-body) var(--lt-font-editorial)}
.lt-chapter__kicker{margin-top:var(--lt-space-3);font:var(--lt-text-utility)/1.3 var(--lt-font-utility);text-transform:uppercase;letter-spacing:var(--lt-tracking-utility);color:var(--lt-color-muted)}
.lt-chapter__title{margin-bottom:var(--lt-space-4);font-size:var(--lt-text-h3);line-height:var(--lt-leading-h3);letter-spacing:var(--lt-tracking-h3)}
.lt-chapter__body{max-width:var(--lt-reading-width);font:var(--lt-text-body-lg)/var(--lt-leading-body) var(--lt-font-editorial)}
.lt-chapter__proof{margin-top:var(--lt-space-6);padding-top:var(--lt-space-3);border-top:var(--lt-border)}
.lt-chapter__author{margin-top:var(--lt-space-4);font:var(--lt-text-utility)/1.4 var(--lt-font-utility);text-transform:uppercase;letter-spacing:var(--lt-tracking-utility);color:var(--lt-color-muted)}
@media (max-width:1000px){
.lt-scene,.lt-scene--left{grid-template-columns:1fr}
.lt-scene__media::before,.lt-scene--left .lt-scene__media::before{display:none}
.lt-crossover{width:auto;max-width:100%;text-shadow:none}
.lt-section-head{grid-template-columns:1fr;gap:var(--lt-space-4)}
.lt-section-head__intro{grid-column:1;margin-top:0}
.lt-header{grid-template-columns:1fr auto}
.lt-header__note{display:none}
.lt-header__nav{display:none}
.lt-chapter{grid-template-columns:1fr;gap:var(--lt-space-6)}
}
@media (prefers-reduced-motion:reduce){*{animation-duration:0ms !important;transition-duration:0ms !important}}