/**** THIS FILE BELONGS TO FORESEEN INSTANCE www.lukashozak.cz, LAST REFRESHED ON 2026-04-10 14:37:27 ****/
:root {
	--bg : #f6f7fb;
	--text : #000;
	--link : #000;
}

body {
	margin:0;
      font: 16px/1.6 ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
      color: black;
      background: radial-gradient(1200px 700px at 10% 0%, rgba(124,58,237,0.25), transparent 60%),
                  radial-gradient(1100px 650px at 90% 10%, rgba(6,182,212,0.18), transparent 55%),
                  var(--bg);
}

footer{
	border-top: 1px solid var(--border);
	padding: 24px 0 40px;
	color: var(--muted);
	font-size: 13px;
}

h1 {
	font-size : 28px;
	font-weight : 800;
	/*letter-spacing : 3px;*/
	margin : 0 0 8px;
}

h2 {
	font-size : 20px;
	font-weight : 800;
	/*letter-spacing : 2px;*/
	margin : 0 0 6px;
}

h3 {
	font-size : 16px;
	font-weight : 800;
	/*letter-spacing : 1.5px;*/
	margin : 0 0 4px;
}

h4 {
	font-size : 14px;
	margin : 0 0 2px;
}

a{ 
	color: black; 
	text-decoration: none; 
}
a:hover{ text-decoration: underline; }

.topbar{
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(10px);
  background: color-mix(in srgb, var(--bg) 80%, transparent);
  border-bottom: 1px solid var(--border);
}

.topbar-inner{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
}

.brand{
  display:flex;
  align-items:center;
  gap: 12px;
  min-width: 200px;
}
.logo{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background:
    linear-gradient(135deg, #6d28d9, #0891b2);
  box-shadow: 0 10px 15px rgba(15,23,42,0.10);
}
.brand-title{
  display:flex;
  flex-direction: column;
  line-height: 1.1;
}
.brand-title strong{ font-size: 15px; letter-spacing: 0.2px; }
.brand-title span{ font-size: 12px; color: var(--muted); }

nav{
  display:flex;
  align-items:center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.nav-link{
  padding: 8px 12px;
  border-radius: 12px;
  color: var(--text);
  border: 1px solid transparent;
}
.nav-link:hover{
  text-decoration: none;
  background: color-mix(in srgb, var(--surface) 65%, transparent);
  border-color: var(--border);
}
.nav-link.active{
  background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 22%, transparent), color-mix(in srgb, var(--brand-2) 16%, transparent));
  border-color: color-mix(in srgb, var(--brand) 35%, var(--border));
}

.personal-content {
	max-width : 100%;
	margin : 0 auto;
}

.personal-content-list {
	max-width : 100%;
	margin : 0 auto;
}

.personal-section {
	border:1px solid white;
	padding : 14px;
	border : none;
	font-size : 14px;
}

.personal-card, .personal-borderless-card {
	display : block;
	color: black;
	text-decoration : none;
	padding : 10px 10px;
    border: 1px solid var(--border);
    overflow:hidden;
    /*position: relative;*/
}


.personal-card {
	background: white;
	/*border-radius : 16px;*/
	/*border: 1px solid rgba(255,255,255, 10%);*/
	padding: 22px;
	margin : 20px 0 20px;
	background-color: color-mix(in srgb, white 42%, transparent);
	box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}


.personal-grid{
	display : grid;
	gap: 8px 14px;
} 

.personal-grid-even {
	grid-template-columns : 1fr 1fr;
}

.personal-grid > div:nth-child(odd) {
	font-size : 110%;
}

.personal-grid > div:nth-child(even) {
	text-align : right;
}

.personal-flex-row {
	display: flex;
	flex-direction: row;
	justify-content : flex-start;
	gap : 20px;
	/*flex-wrap : wrap;*/
}

.personal-flex-column {
	display: flex;
	flex-direction: column;
	justify-content : flex-start;
	gap : 20px;
	min-width:300px;
}

.personal-flex-even {
	flex : 1;
}

.personal-flex-75 { flex : 3 1 calc(800px * 0.75); }
.personal-flex-25 { flex : 1 1 calc(800px * 0.25); }

.personal-flex-66 { flex : 2 1 calc(800px * 0.66); }
.personal-flex-33 { flex : 1 1 calc(800px * 0.33); }


.personal-flex-left-and-right {
	display : flex;
	gap : 10px;
	align-items : center;
	justify-content : space-between;
}

.personal-flex-wrap {
	flex-wrap : wrap;
}

.personal-pad-top {
	padding-top : 10px;
}

.personal-small {
	font-size:80%;
}

.personal-smaller {
	font-size:60%;
}

.personal-tag{
	display:inline-flex;
	align-items:center;
	gap: 8px;
	padding: 6px 10px;
	border-radius: 999px;
	border: 1px solid gray;
	background: color-mix(in srgb, white 72%, transparent);
	color: black;
	font-size: 13px;
	white-space: nowrap;
	margin-right : 7px;
}

.personal-dot {
	width: 6px; height: 6px; border-radius: 99px;
	background: linear-gradient(135deg, #6d28d9, #0891b2);
	/*box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand) 15%, transparent);*/
}

@media screen and (min-width : 600px){
	.personal-content {	max-width : 95%; }
	.personal-content-list { max-width : 95%; }
	.personal-card { border-radius : 16px; }
}

@media screen and (min-width : 800px){
	.personal-content {	max-width : 90%; }
	.personal-content-list { max-width : 90%; }
}