/* Эффект метеорита — временная главная страница */
:root{color-scheme:light;--bg:#f5f8fb;--ink:#142945;--sub:#586d80;--line:#d9e2eb;--warm:#e9be93;--accent:#ad784e;--navy:#0c213e;--white:#fff}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Segoe UI",Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
a:focus-visible{outline:3px solid #186cc1;outline-offset:4px}
.wrap{width:min(100% - 96px,1216px);margin-inline:auto}
.site-header{border-bottom:1px solid var(--line)}
.header-inner{min-height:106px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.identity{display:inline-flex;align-items:center;gap:13px;min-width:0;text-decoration:none}
.identity-mark{flex:none;width:59px;height:59px}
.identity-type{display:flex;flex-direction:column;gap:4px;min-width:0}
.identity-type strong{font-size:26px;line-height:1.09;font-weight:750;letter-spacing:-.048em}
.identity-type small{font-size:11px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:#7b8c9d}
.header-contact{text-decoration:none;border-bottom:1px solid #8f9cab;padding-bottom:8px;font-size:14px;font-weight:700;white-space:nowrap}
.header-contact span{padding-left:12px;color:var(--accent)}
.header-contact:hover,.quiet-link:hover,.footer-links a:hover{color:#9f632f}
.hero{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:clamp(32px,5.4vw,78px);align-items:center;padding-top:76px;padding-bottom:72px}
.hero-copy{padding-bottom:10px}
.eyebrow{display:flex;align-items:center;gap:12px;color:#a5774f;text-transform:uppercase;letter-spacing:.15em;font-size:12px;font-weight:750;margin:0}
.eyebrow-line{width:30px;height:1px;background:#a5774f;flex:none}
h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(54px,6vw,83px);line-height:1.07;letter-spacing:-.065em;margin:32px 0 29px;max-width:700px}
h1 em{font-style:normal;color:#bc875c}
.hero-lead{font-size:clamp(18px,1.55vw,21px);line-height:1.72;letter-spacing:-.012em;max-width:580px;margin:0}
.hero-lead strong{font-weight:700}
.hero-secondary{color:var(--sub);font-size:15px;line-height:1.87;max-width:545px;margin:22px 0 0}
.hero-actions{display:flex;align-items:center;gap:25px;flex-wrap:wrap;margin-top:35px}
.main-link{display:inline-flex;gap:32px;align-items:center;justify-content:space-between;padding:16px 18px;color:#fff;background:#173653;font-weight:700;font-size:14px;text-decoration:none;transition:background .2s,transform .2s}
.main-link:hover{background:#0e2642;transform:translateY(-2px)}
.main-link span{font-size:19px;font-weight:400;color:var(--warm)}
.quiet-link{text-decoration:none;font-size:15px;font-weight:700;border-bottom:1px solid #90a1b0;padding-bottom:8px;white-space:nowrap}
.quiet-link span{color:var(--accent);padding-left:8px}
.art-panel{position:relative;aspect-ratio: 1 / 1.055;background:#0b203c;isolation:isolate;overflow:hidden;box-shadow:0 14px 40px rgba(20,41,69,.07)}
.art-panel::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 72% 55%,rgba(61,136,192,.23),transparent 55%);z-index:-1}
.art-panel>img{display:block;width:100%;height:100%;object-fit:contain;padding:20px}
.art-top,.art-bottom{position:absolute;left:32px;right:32px;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#d8e9f1;font-size:10px;font-weight:650;letter-spacing:.17em;text-transform:uppercase;pointer-events:none}
.art-top{top:29px}.art-bottom{bottom:27px}.art-bottom>span:last-child{opacity:.62}
.section{border-top:1px solid var(--line);padding-top:57px;padding-bottom:66px}
.section-intro{display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,1fr);gap:35px;align-items:start;margin-bottom:31px}
.section-kicker{font-size:12px;letter-spacing:.15em;text-transform:uppercase;font-weight:750;color:#a5774f;padding-top:12px}
h2{font-size:clamp(26px,2.85vw,37px);line-height:1.25;font-weight:600;letter-spacing:-.05em;margin:0;max-width:710px}
.service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);background:rgba(255,255,255,.7)}
.service{padding:30px 25px 32px;min-height:209px;border-right:1px solid var(--line)}
.service:last-child{border-right:0}
.service-num{font:16px Georgia,serif;color:#b17e57}
.service h3{font-size:18px;line-height:1.25;letter-spacing:-.028em;margin:38px 0 11px;font-weight:700}
.service p{font-size:13px;line-height:1.7;color:#657689;margin:0}
.projects{padding-top:16px;padding-bottom:79px}
.projects-intro{margin-bottom:26px}
.project-list{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.project{display:grid;grid-template-columns: minmax(0,.8fr) minmax(0,1.35fr) minmax(0,.8fr) 25px;gap:16px;align-items:center;text-decoration:none;padding:24px 5px;border-bottom:1px solid var(--line);transition:background .2s,padding .2s}
.project:last-child{border-bottom:0}
.project:hover{background:rgba(255,255,255,.8);padding-inline:12px}
.project-type{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:#9a7f65}
.project strong{font-size:18px;letter-spacing:-.025em}
.project-address{font-size:14px;color:#637b91}
.project-arrow{font-size:19px;color:#a77a58;justify-self:end}
.site-footer{border-top:1px solid #d3dce4;background:#e9eff3}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:32px;padding-block:35px 40px}
.footer-title{font-size:18px;font-weight:780;letter-spacing:-.045em}
.site-footer p{font-size:12px;line-height:1.8;color:#6f8191;margin:10px 0 0}
.footer-links{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:14px 27px}
.footer-links a{font-size:14px;font-weight:650;text-decoration-thickness:1px;text-underline-offset:5px}
@media(max-width:1000px){.wrap{width:min(100% - 56px,1216px)}.hero{gap:30px;grid-template-columns:minmax(0,1fr) minmax(0,.86fr)}h1{font-size:clamp(53px,6.2vw,75px)}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.service:nth-child(2){border-right:0}.service:nth-child(-n+2){border-bottom:1px solid var(--line)}.service{min-height:185px}}
@media(max-width:760px){.header-inner{min-height:90px}.identity-type strong{font-size:22px}.identity-mark{width:48px;height:48px}.hero{grid-template-columns:1fr;padding-top:55px;padding-bottom:54px;gap:42px}.hero-copy{padding-bottom:0}.hero-lead{max-width:650px}.art-panel{aspect-ratio:1.25 / 1;max-height:550px}.section-intro{grid-template-columns:1fr;gap:14px}.section-kicker{padding-top:0}.project{grid-template-columns:1fr 1fr 25px;gap:7px 14px}.project-type{grid-column:1 / -1}.project-address{grid-column:2}.project strong{grid-column:1}.project-arrow{grid-column:3;grid-row:2}.footer-inner{align-items:flex-start;flex-direction:column}.footer-links{justify-content:flex-start}}
@media(max-width:520px){.wrap{width:calc(100% - 40px)}.header-inner{min-height:82px}.identity{gap:7px}.identity-mark{width:43px;height:43px}.identity-type strong{font-size:19px}.identity-type small{font-size:8px;letter-spacing:.1em}.header-contact{font-size:0;padding-bottom:0;border:0}.header-contact span{font-size:24px;padding:7px}.hero{padding-top:50px;gap:33px}h1{font-size:clamp(49px,11.8vw,68px);margin:27px 0 26px}.hero-actions{gap:22px}.main-link{padding:15px 17px}.art-panel{aspect-ratio:1.08/1}.art-top,.art-bottom{left:19px;right:19px;font-size:9px}.service-grid{grid-template-columns:1fr}.service{border-right:0;border-bottom:1px solid var(--line);min-height:0;padding:24px}.service:last-child{border-bottom:0}.service h3{margin-top:20px}.section{padding-block:42px 45px}.projects{padding-top:12px;padding-bottom:55px}.project{grid-template-columns:1fr 25px;gap:7px}.project strong{grid-column:1}.project-address{grid-column:1}.project-arrow{grid-column:2;grid-row:2/4;align-self:center}.footer-links{flex-direction:column;align-items:flex-start;gap:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}


/* Верхний экран: текст на отдельной подложке, фотография без перекрытия */
.workspace-hero{
  display:grid;
  grid-template-columns:37% minmax(0,1fr);
  min-height:490px;
  overflow:hidden;
  border-bottom:1px solid var(--line);
  background:#e8f2fa;
}
.workspace-hero-content{
  display:flex;
  align-items:center;
  min-width:0;
  padding:50px clamp(30px,4.4vw,78px) 54px max(38px, calc((100vw - 1216px)/2));
  background:linear-gradient(125deg,#eff6fb 5%,#e5f0f9 100%);
}
.workspace-hero-copy{max-width:390px;min-width:0}
.workspace-hero .eyebrow{
  color:#8f684c;
  font-size:11px;
  line-height:1.55;
  letter-spacing:.13em;
}
.workspace-hero .eyebrow-line{background:#af7955;width:27px}
.workspace-hero h1{
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(49px,3.75vw,70px);
  line-height:1.07;
  letter-spacing:-.065em;
  font-weight:400;
  max-width:100%;
  margin:29px 0 24px;
  color:#102747;
  overflow-wrap:normal;
}
.workspace-hero h1 em{display:block;color:#a76941;font-style:normal}
.workspace-hero-caption{
  max-width:310px;
  margin:0;
  padding-top:18px;
  border-top:1px solid rgba(42,82,111,.21);
  font-size:clamp(16px,1.28vw,19px);
  line-height:1.62;
  font-weight:500;
  color:#31516c;
}
.workspace-hero-visual{position:relative;min-width:0;min-height:490px;overflow:hidden}
.workspace-photo{
  display:block;
  position:absolute;
  inset:0;
  width:100%;height:100%;
  object-fit:cover;
  object-position:59% 50%;
}
.status{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(30px,6vw,86px);
  padding-block:58px 67px;
}
.status-main{max-width:640px}
.status-kicker{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:750;color:#a5774f;margin:0 0 19px}
.status .hero-lead{font-size:clamp(18px,1.5vw,21px)}
.status .hero-secondary{margin:0}
.status .hero-actions{margin-top:26px}

/* Мини-проекты и игровые страницы */
.play-section{background:#f0f5f8;border-top:1px solid var(--line);padding-block:74px 83px}
.play-intro{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:clamp(30px,6vw,95px);align-items:end;margin-bottom:33px}
.play-intro .section-kicker{display:block;margin-bottom:16px;padding-top:0}
.play-intro h2{font-size:clamp(31px,3.45vw,48px);max-width:610px}
.play-intro-text{color:var(--sub);font-size:15px;line-height:1.78}
.play-intro-text p{margin:0 0 10px}
.play-intro-text p:last-child{margin-bottom:0}
.play-intro-text .play-claim{font-size:clamp(18px,1.5vw,21px);line-height:1.47;color:var(--ink);font-weight:700;letter-spacing:-.025em;margin-bottom:13px}
.play-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.play-card{display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid #dae3ea;text-decoration:none;overflow:hidden;transition:box-shadow .2s,transform .2s}
.play-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(24,47,73,.10)}
.play-topline{display:flex;justify-content:space-between;gap:20px;padding:23px 29px 0;font-size:10px;color:#6f7f8f;font-weight:760;letter-spacing:.12em;text-transform:uppercase}
.play-art{display:flex;justify-content:center;align-items:center;overflow:hidden;min-height:202px;margin:0 25px;background:#f5f1f7}
.play-art svg{width:min(100%,240px);height:188px;display:block;filter:drop-shadow(0 8px 12px rgba(23,31,48,.13))}
.play-art-coffee{background:#ecf3f8}
.play-card-body{padding:24px 29px 28px;display:flex;flex-direction:column;gap:13px;flex:1}
.play-card-body strong{font-size:clamp(22px,2.25vw,27px);font-weight:700;line-height:1.22;letter-spacing:-.045em}
.play-card-body>span:nth-child(2){color:#607488;font-size:14px;line-height:1.7;max-width:460px}
.play-visit{margin-top:auto;padding-top:9px;font-size:13px;font-weight:750;color:#9b663f;display:flex;justify-content:space-between;gap:12px;align-items:center}
.play-visit>span{font-size:19px}
.play-cta{display:flex;align-items:center;justify-content:space-between;gap:35px;border-top:1px solid #d3dfe8;margin-top:41px;padding-top:29px}
.play-cta h3{font-size:clamp(19px,1.7vw,23px);line-height:1.35;letter-spacing:-.03em;font-weight:700;margin:0}
.play-cta p{font-size:14px;line-height:1.6;color:var(--sub);margin:9px 0 0}
.play-cta>a{display:inline-flex;align-items:center;justify-content:space-between;gap:40px;padding:16px 19px;background:#183a59;color:#fff;text-decoration:none;font-size:14px;font-weight:700;white-space:nowrap;flex:none}
.play-cta>a:hover{background:#102a45}
.play-cta>a span{color:var(--warm);font-size:18px}
/* Адаптивность верхнего блока и игровых карточек */
@media(max-width:1200px){
  .workspace-hero{grid-template-columns:39% minmax(0,1fr);min-height:440px}
  .workspace-hero-content{padding-left:clamp(30px,4vw,48px);padding-right:28px}
  .workspace-hero-visual{min-height:440px}
  .workspace-hero h1{font-size:clamp(45px,4.3vw,60px)}
}
@media(max-width:880px){
  .workspace-hero{grid-template-columns:42% minmax(0,1fr);min-height:380px}
  .workspace-hero-visual{min-height:380px}
  .workspace-hero-content{padding:32px 23px 35px 30px}
  .workspace-hero h1{font-size:clamp(42px,5.3vw,53px)}
  .workspace-hero-caption{font-size:16px}
}
@media(max-width:760px){
  .workspace-hero{grid-template-columns:1fr;min-height:0}
  .workspace-hero-visual{grid-row:1;min-height:0;aspect-ratio:2.45/1}
  .workspace-photo{object-position:70% center}
  .workspace-hero-content{grid-row:2;padding:34px max(28px,6vw) 39px}
  .workspace-hero-copy{max-width:580px}
  .workspace-hero h1{font-size:clamp(51px,8vw,67px);margin:19px 0 20px}
  .workspace-hero h1 em{display:inline}
  .workspace-hero-caption{max-width:520px}
  .status{grid-template-columns:1fr;gap:19px;padding-block:40px 49px}
  .status .hero-secondary{max-width:700px}
  .play-intro{grid-template-columns:1fr;gap:20px}
  .play-grid{gap:16px}
  .play-topline{padding-inline:20px}
  .play-art{margin-inline:16px}
  .play-card-body{padding-inline:20px}
}
@media(max-width:580px){
  .workspace-hero-visual{aspect-ratio:1.85/1}
  .workspace-hero-content{padding-block:30px 37px}
  .workspace-hero h1{font-size:clamp(51px,11vw,65px)}
  .workspace-hero h1 em{display:block}
  .play-section{padding-block:52px 61px}
  .play-grid{grid-template-columns:1fr;gap:20px}
  .play-art{min-height:178px}
  .play-art svg{height:175px}
  .play-cta{align-items:flex-start;flex-direction:column;gap:21px}
}
