/* NEW ANTIQ — язык «Клавиши» (утверждён 2026-07-06). Общий для всех страниц. */
@font-face{font-family:'Cormorant';src:url('./fonts/CormorantGaramond_500Medium.ttf');font-weight:500}
@font-face{font-family:'Cormorant';src:url('./fonts/CormorantGaramond_400Regular_Italic.ttf');font-weight:400;font-style:italic}
@font-face{font-family:'Inter';src:url('./fonts/Inter_300Light.ttf');font-weight:300}
@font-face{font-family:'Inter';src:url('./fonts/Inter_400Regular.ttf');font-weight:400}
@font-face{font-family:'JB';src:url('./fonts/JetBrainsMono_400Regular.ttf');font-weight:400}
*{margin:0;padding:0;box-sizing:border-box}
a{color:inherit;text-decoration:none}
html{scroll-behavior:smooth}
body{color:#EFE9DB;font-family:'Inter',sans-serif;font-weight:300;padding:120px 40px 60px;position:relative;
 background:
  radial-gradient(55% 38% at 82% -6%, rgba(197,160,89,.16), transparent 62%),
  radial-gradient(46% 34% at 4% 26%, rgba(91,138,114,.11), transparent 64%),
  radial-gradient(60% 42% at 92% 74%, rgba(90,36,23,.16), transparent 60%),
  radial-gradient(75% 55% at 50% 112%, rgba(46,30,16,.55), transparent 62%),
  linear-gradient(180deg,#181310 0%, #100D0B 42%, #0A0908 100%)}
body::after{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:170px}
.substrate{position:fixed;inset:-6%;z-index:0;pointer-events:none}
.substrate i{position:absolute;inset:0;background-size:cover;background-position:center 30%;
 filter:grayscale(.08) brightness(.82) contrast(1.07);will-change:transform,opacity;animation:subzoom 46s ease-in-out infinite alternate}
.substrate i.a{opacity:.15;animation:subzoom 46s ease-in-out infinite alternate, fadeA 56s ease-in-out infinite}
.substrate i.b{opacity:0;animation:subzoom 52s ease-in-out infinite alternate-reverse, fadeB 56s ease-in-out infinite}
@keyframes subzoom{from{transform:scale(1)}to{transform:scale(1.1)}}
@keyframes fadeA{0%,42%{opacity:.15}50%,92%{opacity:.03}100%{opacity:.15}}
@keyframes fadeB{0%,42%{opacity:0}50%,92%{opacity:.14}100%{opacity:0}}
.oring{height:64px;width:auto;align-self:flex-start;object-fit:contain;filter:drop-shadow(0 0 26px rgba(197,160,89,.5));animation:obr 2.6s ease-in-out infinite alternate}
@keyframes obr{from{transform:scale(.97)}to{transform:scale(1.045)}}
.ocall{position:fixed;right:34px;bottom:30px;z-index:50;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer}
.ocall img{height:58px;filter:drop-shadow(0 0 22px rgba(95,191,154,.4));animation:obr 2.6s ease-in-out infinite alternate}
.ocall span{font-family:'JB';font-size:9px;letter-spacing:2px;color:#B9AE96}
@media(prefers-reduced-motion:reduce){.substrate i{animation:none!important}.substrate i.a{opacity:.12}.oring,.ocall img{animation:none}}
.wrap{max-width:1240px;margin:0 auto;position:relative;z-index:2}
.nav{position:fixed;top:20px;left:50%;transform:translateX(-50%);z-index:40;display:flex;align-items:center;gap:28px;
 background:rgba(18,15,12,.74);border:1px solid rgba(215,180,120,.18);border-radius:100px;padding:12px 14px 12px 22px;backdrop-filter:blur(16px)}
.nav img{height:32px}
.nav a{font-family:'JB';font-size:10.5px;letter-spacing:2px;color:#CFC8B8}
.nav a:hover{color:#E8D5A2}
.nav .dna{background:rgba(197,160,89,.15);border:1px solid rgba(197,160,89,.42);color:#E8D5A2;border-radius:100px;padding:9px 18px;white-space:nowrap}
.key{position:relative;background:linear-gradient(180deg, rgba(240,225,200,.055), rgba(240,225,200,.015) 55%);
 border:1px solid rgba(232,205,150,.34);border-radius:24px;overflow:hidden;
 box-shadow:0 40px 80px -40px rgba(0,0,0,.9), inset 0 1px 0 rgba(250,240,220,.17);transition:.35s}
.key:hover{border-color:rgba(123,212,178,.65);transform:translateY(-6px) scale(1.014);
 box-shadow:0 60px 110px -44px rgba(0,0,0,.97), 0 0 82px -14px rgba(95,191,154,.42), 0 0 26px -8px rgba(197,160,89,.3), inset 0 1px 0 rgba(250,240,220,.2)}
.hero{position:relative;min-height:600px;display:flex}
.hero .tx{position:relative;z-index:3;width:55%;padding:70px 64px;display:flex;flex-direction:column;justify-content:center}
.kick{font-family:'JB';font-size:11px;letter-spacing:3px;color:#C5A059;margin-bottom:24px}
.kick i{font-style:normal;color:#5FBF9A}
.hlogo{height:216px;object-fit:contain;object-position:left;margin:-62px 0 -34px -10px;filter:drop-shadow(0 4px 22px rgba(0,0,0,.6))}
.hero h1{font-family:'Cormorant';font-weight:500;font-size:72px;line-height:1.02}
.hero h1 .it{font-style:italic;font-weight:400;color:#8FCDAF}
.hero p{margin-top:26px;color:#B4AC9C;font-size:16px;line-height:1.65;max-width:430px}
.hero .cta{margin-top:38px;display:flex;gap:16px}
.b1{font-weight:400;font-size:13px;letter-spacing:1.5px;color:#101010;background:linear-gradient(180deg,#E8D5A2,#C5A059);border-radius:100px;padding:16px 30px}
.b2{font-size:13px;letter-spacing:1.5px;color:#D8D0BE;border:1px solid rgba(220,190,135,.3);border-radius:100px;padding:16px 30px}
.hero .im{position:absolute;top:0;right:0;bottom:0;width:68%;margin:0;border-radius:0;overflow:hidden}
.hero .im::before{content:'';position:absolute;inset:0;background:var(--ph) center 18%/cover;
 filter:blur(26px) brightness(.62) saturate(.85);
 -webkit-mask-image:linear-gradient(to right, black 6%, transparent 58%);mask-image:linear-gradient(to right, black 6%, transparent 58%)}
.hero .im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block;
 filter:saturate(.9) brightness(.86);
 -webkit-mask-image:linear-gradient(to right, transparent 4%, rgba(0,0,0,.6) 30%, black 58%);mask-image:linear-gradient(to right, transparent 4%, rgba(0,0,0,.6) 30%, black 58%)}
.hero .im:after{content:'';position:absolute;inset:0;background:
 linear-gradient(to right, rgba(17,14,12,.9) 0%, rgba(17,14,12,.45) 26%, rgba(17,14,12,0) 55%),
 linear-gradient(to top, rgba(9,8,7,.4), transparent 38%)}
.phero{min-height:480px}
.phero h1{font-size:56px}
.tick{margin-top:20px;border-radius:100px;border:1px solid rgba(220,190,135,.14);background:rgba(16,13,11,.6);overflow:hidden;padding:13px 0}
.tick .t{display:inline-block;white-space:nowrap;animation:mq 32s linear infinite;font-family:'JB';font-size:10.5px;letter-spacing:3px;color:#A2906B}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tick i{font-style:normal;color:#5FBF9A;margin:0 16px}
.sect{margin:40px 0 22px;font-family:'JB';font-size:16.5px;letter-spacing:3.5px;color:#EFDFB4;display:flex;align-items:center;gap:16px;text-shadow:0 0 26px rgba(197,160,89,.4)}
.sect b{font-weight:400;color:#8FCDAF}
.sect:after{content:'';flex:1;height:1px;background:linear-gradient(to right, rgba(197,160,89,.45), rgba(95,191,154,.35), transparent)}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:20px}
.k{padding:32px 32px 28px;display:flex;flex-direction:column;justify-content:flex-end;min-height:230px}
.k .lab{font-family:'JB';font-size:10px;letter-spacing:2.5px;color:#C5A059;margin-bottom:12px}
.k h3{font-family:'Cormorant';font-weight:500;font-size:33px;color:#F1EADB}
.k p{margin-top:10px;font-size:13.5px;line-height:1.55;color:#A79F8F}
.k .go{margin-top:16px;font-family:'JB';font-size:10.5px;letter-spacing:2px;color:#E3CD95}
.s3{grid-column:span 3}.s4{grid-column:span 4}.s5{grid-column:span 5}.s6{grid-column:span 6}.s7{grid-column:span 7}.s8{grid-column:span 8}.s12{grid-column:span 12}
.kimg{position:relative;min-height:300px;padding:0;display:block}
.kimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.8) brightness(.72);transition:1s}
.kimg:hover img{filter:saturate(1) brightness(.95);transform:scale(1.03)}
.kimg .ov{position:absolute;left:0;right:0;bottom:0;padding:28px 32px;background:linear-gradient(to top, rgba(9,8,7,.92), rgba(9,8,7,0));z-index:2}
.kimg .ov h3{font-family:'Cormorant';font-weight:500;font-size:31px;color:#F1EADB}
.kimg .ov p{color:#C9C1B1;font-size:13px;margin-top:6px}
.kimg .ov .lab{font-family:'JB';font-size:10px;letter-spacing:2.5px;color:#C5A059;margin-bottom:8px;display:block}
.kdna{background:linear-gradient(180deg, rgba(95,191,154,.15), rgba(95,191,154,.03) 60%);border-color:rgba(95,191,154,.3)}
.kdna .lab{color:#5FBF9A}
.kem{background:linear-gradient(180deg, rgba(46,77,62,.30), rgba(46,77,62,.06) 65%);border-color:rgba(95,191,154,.25)}
.split{display:grid;grid-template-columns:5fr 7fr;gap:20px;align-items:start}
.split .head{position:sticky;top:112px}
.split .head .key{padding:46px 44px;min-height:380px;display:flex;flex-direction:column;justify-content:center}
.split .head h2{font-family:'Cormorant';font-weight:500;font-size:52px;line-height:1.05}
.split .head h2 .it{font-style:italic;font-weight:400;color:#8FCDAF}
.split .head p{margin-top:18px;color:#A79F8F;font-size:14.5px;line-height:1.6}
.split .stream{display:flex;flex-direction:column;gap:20px}
.step{padding:38px 40px;display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:start}
.step .num{font-family:'Cormorant';font-weight:500;font-size:64px;color:rgba(143,205,175,.5);line-height:1}
.step h3{font-family:'Cormorant';font-weight:500;font-size:32px}
.step p{margin-top:8px;color:#A79F8F;font-size:14px;line-height:1.6;max-width:480px}
.step .im{margin-top:20px;border-radius:14px;overflow:hidden;height:200px}
.step .im img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) brightness(.8)}
.step .pt{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap}
.tagp{font-family:'JB';font-size:9.5px;letter-spacing:1px;padding:4px 9px;border:1px solid rgba(232,205,150,.22);border-radius:100px;color:#C9AE79}
.tagp.ph{color:#8FCDAF;border-color:rgba(95,191,154,.32)}
.prow{padding:18px 0;border-top:1px solid rgba(232,205,150,.14)}
.prow:first-of-type{border-top:none;padding-top:0}
.prow h4{font-family:'Cormorant';font-weight:500;font-size:25px;color:#F1EADB}
.prow p{margin-top:6px;font-size:13.5px;line-height:1.55;color:#A79F8F}
.prow .pt{margin-top:10px;display:flex;gap:8px;flex-wrap:wrap}
.lvl{font-family:'JB';font-size:10px;letter-spacing:2px;margin-bottom:10px}
.lvl.g{color:#9AA0A6}.lvl.b{color:#B8894F}.lvl.s{color:#BFC3C7}.lvl.au{color:#E8D5A2}
.eco{padding:44px 46px}
.eco .cols{display:grid;grid-template-columns:repeat(4,1fr);gap:22px 30px;margin-top:26px}
.eco h4{font-family:'JB';font-size:10px;letter-spacing:2px;color:#C5A059;padding-bottom:9px;margin-bottom:10px;border-bottom:1px solid rgba(220,190,135,.16)}
.eco ul{list-style:none}
.eco li{font-size:13px;color:#C6BEAE;padding:4px 0}
.foot{margin-top:26px;text-align:center;padding:46px 0 10px}
.foot .s{font-family:'Cormorant';font-style:italic;font-size:46px;color:#EFE9DB;text-shadow:0 0 40px rgba(197,160,89,.25)}
.foot .s b{font-style:italic;font-weight:500;color:#8FCDAF}
.foot .q{margin-top:14px;font-family:'Cormorant';font-style:italic;font-size:22px;color:#A79F8F}
.foot .m{margin-top:20px;font-family:'JB';font-size:10px;letter-spacing:3px;color:#6d675b}
