/* Markéta Stehlíková — styles */
:root{--ink:#2E231F;--black:#0F0E0E;--paper:#F4F0EA;--side:#F6F3EE;--serif:'Instrument Serif','Times New Roman',Georgia,serif;--sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:#fff;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;min-height:100vh;position:relative}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.34;background:url(grain.png)}
.frame{position:relative;z-index:1;display:flex;margin:56px;min-height:calc(100vh - 112px);border-radius:16px;overflow:hidden}
.frame::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.14;background:url(grain.png)}
.panel{flex:1 1 50%;min-width:0;background:var(--black);color:var(--paper);padding:40px 48px 56px;display:flex;flex-direction:column}
.side{flex:1 1 50%;min-width:0;background:var(--side);display:flex;justify-content:center;align-items:center;padding:24px 24px 48px}
.side.tall{align-items:flex-start}
.side.tall .wrap{position:sticky;top:24px}
.wrap{width:480px;max-width:100%}
.tools{display:flex;justify-content:flex-end;align-items:center;gap:29px;font-size:17px;height:44px;margin-bottom:10px}
.tools a{color:var(--ink);text-decoration:none}
.ic svg{width:24px;height:24px;display:block;stroke:currentColor;fill:none;stroke-width:1.5}
.lang{display:flex;gap:9px;align-items:center;color:#7a6c64}
.lang a{color:#7a6c64}.lang a[aria-current]{color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:2px}
.photo{display:block;width:100%;height:min(720px,calc(100vh - 260px));min-height:420px;object-fit:cover;object-position:center top;border-radius:10px}
.photo.g{height:auto;aspect-ratio:2/3;min-height:0;margin-bottom:22px}
.name{font-family:var(--serif);font-weight:400;font-size:clamp(40px,4.4vw,72px);line-height:1;text-transform:uppercase;letter-spacing:.01em;color:var(--paper);text-decoration:none;display:block}
nav{display:flex;gap:34px;margin-top:20px;font-size:15.5px}
nav a{color:var(--paper);text-decoration:none;padding-bottom:3px;border-bottom:1px solid transparent}
nav a:hover,nav a[aria-current]{border-color:var(--paper)}
.content{margin-top:clamp(64px,15vh,170px);max-width:620px}
.label{font-family:var(--serif);font-weight:400;font-size:30px;margin-bottom:22px}
.label.sub{margin-top:56px}
.content.long{margin-top:clamp(48px,9vh,100px);max-width:640px}
.content.long .text{font-size:21px;line-height:1.5}
.statement{font-family:var(--serif);font-weight:400;font-size:30px;line-height:1.3}
.text{font-family:var(--serif);font-size:25px;line-height:1.38;margin-bottom:18px}
.soft{opacity:.7}
.links{margin:18px 0 28px;border-top:1px solid rgba(244,240,234,.25)}
.links a{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:16px 0;border-bottom:1px solid rgba(244,240,234,.25);color:var(--paper);text-decoration:none}
.links a span{font-family:var(--serif);font-size:34px;line-height:1.1}
.links a small{font-size:13.5px;opacity:.65}
.links a:hover span{text-decoration:underline;text-underline-offset:5px}
.back{color:var(--paper)}
.status{font-size:14px;color:#e9b7a6;min-height:1.2em;grid-column:1}
.form button:disabled{opacity:.6;cursor:default}
.form{display:grid;gap:22px;max-width:520px}
.form label{display:grid;gap:6px;font-size:13.5px;color:rgba(244,240,234,.7)}
.form input,.form textarea{background:transparent;border:0;border-bottom:1px solid rgba(244,240,234,.5);border-radius:0;color:var(--paper);font:inherit;font-size:17px;padding:8px 0}
.form textarea{resize:vertical}
.form .hp{position:absolute;left:-9999px;height:0;width:0;opacity:0}
.form button{justify-self:start;background:transparent;border:1px solid var(--paper);color:var(--paper);font:inherit;font-size:15.5px;padding:14px 30px;cursor:pointer;border-radius:0}
.form button:hover{background:var(--paper);color:var(--black)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #9bb8cc;outline-offset:3px}
@media (max-width:860px){
 .frame{flex-direction:column;margin:12px;min-height:0;border-radius:14px}
 .panel{padding:28px 24px 44px}
 .content{margin-top:56px}
 .side{padding:16px 16px 36px}
 .wrap{width:100%}
 .photo{height:auto;aspect-ratio:2/3;min-height:0}
 nav{gap:24px}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
