/* Минималистичное портфолио: белый фон, чёрный текст, фото — главное. Mobile-first. */
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:64px}
body{background:#fff;color:#111;font:16px/1.6 "Helvetica Neue",Helvetica,Arial,system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;padding:0 max(20px,env(safe-area-inset-right)) 0 max(20px,env(safe-area-inset-left))}
img{display:block;width:100%;height:auto;background:#f2f2f2}
a{color:inherit;text-decoration:none}
a:hover{opacity:.6}
html[data-lang="en"] [lang="fr"],html[data-lang="fr"] [lang="en"]{display:none!important}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

.top{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:calc(16px + env(safe-area-inset-top)) 0 16px;background:rgba(255,255,255,.94);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.name{font-weight:500;letter-spacing:.02em;white-space:nowrap}
nav{display:flex;align-items:center;gap:clamp(12px,3vw,32px);font-size:14px}
.lang{font-size:13px;letter-spacing:.08em;border:1px solid #111;padding:2px 8px;border-radius:2px}
@media (max-width:420px){nav a[href="/#about"]{display:none}}

.label{font-size:12px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:#888;margin-bottom:24px}

.hero{display:grid;gap:20px;padding:12px 0 72px}
.hero-txt h1{font-size:clamp(32px,6vw,64px);font-weight:400;line-height:1.05;letter-spacing:-.01em}
.hero-txt p{color:#666;margin-top:8px}
@media (min-width:900px){
  .hero{grid-template-columns:3fr 2fr;align-items:end;gap:48px;padding:24px 0 120px}
}

.work{padding-bottom:72px}
.cards{display:grid;gap:40px}
@media (min-width:700px){.cards{grid-template-columns:repeat(3,1fr);gap:28px}}
.card{display:block}
.card-img{aspect-ratio:1/1;object-fit:cover}
.card-t{display:block;margin-top:14px;font-size:18px}
.card-s{display:block;color:#888;font-size:14px}

.about{padding-bottom:96px}
.about-grid{display:grid;gap:24px}
.about-txt{font-size:clamp(17px,2.2vw,22px);line-height:1.5;max-width:34em}
@media (min-width:700px){.about-grid{grid-template-columns:2fr 3fr;gap:48px;align-items:start}}

.foot{border-top:1px solid #e5e5e5;padding:40px 0 calc(40px + env(safe-area-inset-bottom));display:grid;gap:16px}
.foot-name{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#888}
.contacts{list-style:none;display:grid;gap:8px;font-size:clamp(17px,2.4vw,22px)}
.contacts a{display:inline-block;padding:4px 0;word-break:break-word}
.foot-small{font-size:13px;color:#999;margin-top:16px}

.series{max-width:1100px;margin:0 auto;padding:8px 0 72px}
.back{font-size:14px;color:#888;display:inline-block;padding:8px 0}
.s-head{padding:24px 0 48px;max-width:40em}
.s-head h1{font-size:clamp(30px,5vw,52px);font-weight:400;line-height:1.1}
.s-meta{color:#888;font-size:14px;margin:8px 0 24px}
.s-text p+p{margin-top:1em}
.photos{display:grid;gap:clamp(16px,4vw,48px)}
.ph{cursor:zoom-in}
@media (min-width:900px){.photos{gap:64px}.ph{max-height:92vh;width:auto;max-width:100%;margin:0 auto}}
.next{display:block;margin-top:72px;font-size:18px;border-top:1px solid #e5e5e5;padding-top:24px}

.lb{position:fixed;inset:0;z-index:50;background:#fff;display:flex;align-items:center;justify-content:center;
  padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);touch-action:pan-y}
.lb[hidden]{display:none}
.lb img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;background:none;padding:48px 8px}
.lb button{position:absolute;font-size:34px;line-height:1;padding:14px 18px;color:#111}
.lb-x{top:env(safe-area-inset-top);right:0}
.lb-p{left:0;top:50%;transform:translateY(-50%)}
.lb-n{right:0;top:50%;transform:translateY(-50%)}
.lb-c{position:absolute;bottom:calc(14px + env(safe-area-inset-bottom));left:0;right:0;text-align:center;font-size:13px;color:#888}
@media (hover:none){.lb-p,.lb-n{display:none}}

.err{min-height:60vh;display:flex;flex-direction:column;justify-content:center;gap:12px}